CODEWITHSUNDEEP
pythonwebsocketsanic
Mittenchops
Mittenchops

Reputation: 19664

How to have Sanic respond with http and ws?

I have the following code for a Sanic hello world based off combining different endpoints here:

Code is:

from sanic import Sanic
from sanic import response
from sanic.websocket import WebSocketProtocol

app = Sanic()

@app.route("/")
async def test(request):
    return response.json({"hello": "world"})


@app.route('/html')
async def handle_request(request):
    return response.html('<p>Hello world!</p>')

@app.websocket('/feed')
async def feed(request, ws):
    while True:
        data = 'hello!'
        print('Sending: ' + data)
        await ws.send(data)
        data = await ws.recv()
        print('Received: ' + data)

@app.route('/html2')
async def handle_request(request):
  return response.html("""<html><head><script>
         var exampleSocket = new WebSocket("wss://0.0.0.0:8000/feed",      "protocolOne");
         exampleSocket.onmessage = function (event) {
         console.log(event.data)};</script></head><body><h1>Hello socket!</h1><p>hello</p></body></html>""")

app.run(host="0.0.0.0", port=8000)
# app.run(host="0.0.0.0", port=8000, protocol=WebSocketProtocol)    # ws

The routes "/" and "/html" work fine, but 

http://0.0.0.0:8000/feed

produces:

Error: Invalid websocket request

and "/html2" renders the page fine, but doesn't log to console, showing in the debugger:

Firefox can’t establish a connection to the server at wss://0.0.0.0:8000/feed.

What should I change or add to make a viable websocket endpoint that plays nicely with the http ones, too?

Upvotes: 2

Views: 2640

Answers (1)

clockwatcher
clockwatcher

Reputation: 3363

Using 0.0.0.0 as your endpoint within your client html doesn't make any sense and you're not using SSL so you want to use ws:// rather than wss://. In other words,

from sanic import Sanic
from sanic import response
from sanic.websocket import WebSocketProtocol

app = Sanic()

@app.websocket('/feed')
async def feed(request, ws):
    while True:
        data = 'hello!'
        print('Sending: ' + data)
        await ws.send(data)
        data = await ws.recv()
        print('Received: ' + data)

@app.route('/html2')
async def handle_request(request):
  return response.html("""<html><head><script>
         var exampleSocket = new WebSocket("ws://" + location.host + '/feed');
         exampleSocket.onmessage = function (event) {
         console.log(event.data)};</script></head><body><h1>Hello socket!</h1><p>hello</p></body></html>""")

app.run(host="0.0.0.0", port=8000)

Upvotes: 5

Related Questions