Can't login using BOSH and WebSocket

Hello!

I’m trying to configure converse.js with ejabberd server. System: Debian 9.4, Mageia 6, ip address of the host: 10.11.118.4 HTTP-server: Apache apache-2.4.25, Apache-2.4.27 XMPP server: Ejabberd-18.01, Ejabberd-18.06 Converse.js: 4.0.0

1. Using WEBSOCKET Ejabberd configuration:

port: 5280
    ip: "::"
    module: ejabberd_http
    request_handlers:
      "/ws": ejabberd_http_ws
      "/bosh": mod_bosh
      "/oauth": ejabberd_oauth
      "/api": mod_http_api
    web_admin: true
    http_bind: true
    register: false
    captcha: false

Apache configuration:

<VirtualHost _default_:80>
    ServerAdmin root@localhost
    ServerName localhost
        ServerAlias example.com

# WS
ProxyPass /ws/ http://10.11.118.4:5280/ws/
ProxyPassReverse /ws/ http://10.11.118.4:5280/ws/
</VirtualHost>

Converse.js configuration:

converse.initialize({
        websocket_url: 'http://example.com/ws/',
        show_controlbox_by_default: true,
});

JS-console log: Load the page http://example.com/converse.js/

GET http://example.com/src/website.js 404 (Not Found)
example.com/:96 GET http://example.com/logo/mastodon.svg 404 (Not Found)
example.com/:19 GET http://example.com/converse.js/analytics.js 404 (Not Found)
example.com/:230 GET http://example.com/logo/keycdn.svg 404 (Not Found)
(index):231 GET http://example.com/logo/wikisuite-white.png 404 (Not Found)
converse.js:5311 Uncaught TypeError: Cannot create property 'isAnimating' on boo
    at new Collapse (converse.js:5311)
    at initializeDataAPI (converse.js:6287)
    at BSN.initCallback (converse.js:6293)
    at HTMLDocument.<anonymous> (converse.js:6298)
Collapse @ converse.js:5311
initializeDataAPI @ converse.js:6287
BSN.initCallback @ converse.js:6293
(anonymous) @ converse.js:6298
(index):232 GET http://example.com/logo/hostpresto.png 404 (Not Found)
(index):1 This page includes a password or credit card input in a non-secure con

I think the errors above do not affect the situation Try to login:

converse.js:52382 POST http://example.com/ws/ 400 (Bad Request)
sendFunc @ converse.js:52382
_processRequest @ converse.js:52397
_throttledRequestHandler @ converse.js:52543
_connect @ converse.js:51890
connect @ converse.js:49774
connect @ converse.js:62668
authenticate @ converse.js:62646
wrapper @ converse.js:14184
handler @ converse.js:2131
converse.js:63065  ERROR: request id 1.1 error 400 happened
_converse.log @ converse.js:63065
Strophe.error @ converse.js:63086
_onRequestStateChange @ converse.js:52285
XMLHttpRequest.send (async)
sendFunc @ converse.js:52382
_processRequest @ converse.js:52397
_throttledRequestHandler @ converse.js:52543
_connect @ converse.js:51890
connect @ converse.js:49774
connect @ converse.js:62668
authenticate @ converse.js:62646
wrapper @ converse.js:14184
handler @ converse.js:2131
converse.js:63071  FATAL: TypeError: Cannot read property 'split' of undefined
_converse.log @ converse.js:63071
Strophe.log @ converse.js:63799
fatal @ converse.js:48816
_handleError @ converse.js:48718
_changeConnectStatus @ converse.js:50408
_doDisconnect @ converse.js:50448
_onRequestStateChange @ converse.js:52290
XMLHttpRequest.send (async)
sendFunc @ converse.js:52382
_processRequest @ converse.js:52397
_throttledRequestHandler @ converse.js:52543
_connect @ converse.js:51890
connect @ converse.js:49774
connect @ converse.js:62668
authenticate @ converse.js:62646
wrapper @ converse.js:14184
handler @ converse.js:2131
converse.js:63071  FATAL: error: Cannot read property 'split' of undefined
_converse.log @ converse.js:63071
Strophe.log @ converse.js:63799
fatal @ converse.js:48816
_handleError @ converse.js:48728
_changeConnectStatus @ converse.js:50408
_doDisconnect @ converse.js:50448
_onRequestStateChange @ converse.js:52290
XMLHttpRequest.send (async)
sendFunc @ converse.js:52382
_processRequest @ converse.js:52397
_throttledRequestHandler @ converse.js:52543
_connect @ converse.js:51890
connect @ converse.js:49774
connect @ converse.js:62668
authenticate @ converse.js:62646
wrapper @ converse.js:14184
handler @ converse.js:2131
converse.js:63065  ERROR: User connection callback caused an exception: TypeError

Try to load the page _http://example.com/ws/_, I get the duty message from Ejabberd:

If I change the configuration of converse.js to direct websocket-link - it works fine: Converse.js configuration:

converse.initialize({
        websocket_url: 'ws://example.com:5280/ws/',
        show_controlbox_by_default: true,
});

2. Using BOSH Ejabberd configuration is the same. Apache configuration:

<VirtualHost _default_:80>
    ServerAdmin root@localhost
    ServerName example.com
    
# BOSH
ProxyPass /bosh/ http://10.11.118.4:5280/bosh/
ProxyPassReverse /bosh/ http://10.11.118.4:5280/bosh/
</VirtualHost>

Converse.js configuration:

converse.initialize({
        bosh_service_url: 'http://example.com/bosh/
        show_controlbox_by_default: true,
});

Try to load the page http://example.com/bosh/, I get the duty message from Ejabberd-server:

JS-console log: Load the page http://example.com/converse.js/ Same as in 1.

Try to login:

converse.js:63065  ERROR: Server did not offer a supported authentication mechanism

Questions: See 1: How to use websocket connection through http-proxy? See 2: How to configure converse.js to make it work using bosh? 3. What about errors in JS-console?:

GET http://example.com/src/website.js 404 (Not Found)
example.com/:19 GET http://example.com/converse.js/analytics.js 404 (Not Found)
example.com/:96 GET http://example.com/logo/mastodon.svg 404 (Not Found)
example.com/:230 GET http://example.com/logo/keycdn.svg 404 (Not Found)
example.com/:19 GET http://example.com/converse.js/analytics.js 404 (Not Found)
example.com/:231 GET http://example.com/logo/wikisuite-white.png 404 (Not Found)
example.com/:232 GET http://example.com/logo/hostpresto.png 404 (Not Found)
converse.js:5311 Uncaught TypeError: Cannot create property 'isAnimating' on boolean 'false'
    at new Collapse (converse.js:5311)
    at initializeDataAPI (converse.js:6287)
    at BSN.initCallback (converse.js:6293)
    at HTMLDocument.<anonymous> (converse.js:6298)

Thanks!

[jcbrand]

You are specifying the websocket URL as if it’s an HTTP URL.

You need to change the following:

converse.initialize({
        websocket_url: 'http://example.com/ws/',
        show_controlbox_by_default: true,
});

to

converse.initialize({
        websocket_url: 'ws://example.com/ws/',
        show_controlbox_by_default: true,
});

[jcbrand]

No worries, I’m glad you got it working. Thanks for a very detailed bug report (I wish they all looked like this).