Websocket Connection error: Invalid origin

Frappe Framework App Development
1

Hi i got Websocket Connection error: Invalid origin in Frappe Messenger, have any of you ever got it?
import { io } from ‘socket.io-client’

export function initSocket() {
let host = window.location.hostname
let siteName = window.site_name
let port = window.location.port ? :${socketio_port} : ‘’
let protocol = port ? ‘http’ : ‘https’
let url = ${protocol}://${host}${port}/${siteName}
// add log
console.log(‘:electric_plug: [Socket] Connecting to:’, url)
console.log(‘:electric_plug: [Socket] Protocol:’, protocol)
console.log(‘:electric_plug: [Socket] Host:’, host)
console.log(‘:electric_plug: [Socket] Port:’, port)
console.log(‘:electric_plug: [Socket] Site Name:’, siteName)
let socket = io(url, {
withCredentials: true,
reconnectionAttempts: 5,
})
socket.on(‘connect’, () => {
console.log(‘[Socket] Connected successfully! ID:’, socket.id)
})

socket.on(‘connect_error’, (error) => {
console.error(‘:cross_mark: [Socket] Connection error:’, error.message)
})

2

The “Invalid origin” error usually means the server doesn’t allow your site’s URL, check your WebSocket server’s allowed origins and ensure the protocol and port match.

1 Like