503 error when trying to connect to websocket

Hi there,

I'm trying to create a websocket on a frontend ajax function located on a website i'm building. However i'm permanently getting 503 errors when i'm trying to connect. I've based my code from this file. Currently i have this code:

$.ajax({
    url: url + '/api/devices',
    headers: {
        "Authorization": "Basic " + btoa(username + ":" + password)
    },
    success: function(devices){
        var socket = new WebSocket('ws' + url.substring(4) + '/api/socket');
        
            socket.onclose = function (event) {
            console.log('socket closed');
        };

        socket.onmessage = function (event) {
            console.log(event);
        }
    }
});

I've read about websockets from the mozilla developer documentation and currently I can't use https on for either my traccar server or site i'm building. I don't think my issue is stemming from cookies or authentication problems since my devices and users requests are working fine. Am i doing something wrong here?
Best regards,
Simon

What's the full error? Sounds like a server issue.

My apoligies for the late reply.
My current situation has changed a bit so if you want me to make a different ticket let me know.
Right now i'm getting 405 (Method Not Allowed) errors and i'm using the same code as posted in the initial post. The exact response i'm getting is:

Responseheaders:

HTTP/1.1 405 Method Not Allowed
    Date: Tue, 19 Jan 2021 15:25:19 GMT
    Server: Jetty
    Cache-Control: must-revalidate,no-cache,no-store
    Content-Type: text/html;charset=iso-8859-1
    Content-Length: 99
    Keep-Alive: timeout=5, max=100
    Connection: Keep-Alive

RequestHeaders:

    GET /api/socket HTTP/1.1
    Host: traccar.HOSTNAME.nl
    User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:84.0) Gecko/20100101 Firefox/84.0
    Accept: */*
    Accept-Language: nl,en-US;q=0.7,en;q=0.3
    Accept-Encoding: gzip, deflate, br
    Sec-WebSocket-Version: 13
    Origin: https://SITEURL
    Sec-WebSocket-Extensions: permessage-deflate
    Sec-WebSocket-Key: KEY
    Connection: keep-alive, Upgrade
    Pragma: no-cache
    Cache-Control: no-cache
    Upgrade: websocket

Additionally my client on traccar.HOSTNAME.nl seems very slow/sluggish to use. Currently it's not picking up the coordinates from my phone as it should and it keeps giving me popups with the text "websocket connection error". After looking in the developer console there are the same 405 errorcodes. It there a setting somewhere i have to turn on before websockets are enabled? Or is there something else going on?

Thanks in advance,
Simon

As long as you are using official version and don't mess with configuration, websocket should be enabled by default.

Thanks for the quick response!
So how would i have to go about trying to find the source of this issue? Should i look into the server settings or in the traccar application?

Does the official web app work?

Yes it does work, even though its very slow as described above. The web app seems to sometimes find the connection though, but mostly it just shows 405 errors in the developer console.

Sometimes? Are you sure you don't have anything else in between? Proxies firewalls etc?

Since were using https were using a proxy that (should) allow us to use request from https sites since you cant ajax to a http resource from a https source. Do you think that the proxy could be interferring with the requests?

After looking some more about the 405 error the the mozilla developer web docs has this to say:

The server MUST generate an Allow header field in a 405 response containing a list of the target resource's currently supported methods.

It seems weird to me that the 'api/socket' request doesn't send any Allow headers back, but after looking for them i'm pretty sure i'm not getting them. Could this be due to the https proxy?

Why not check directly?