Skip to content

Socket.IO not connecting in Chrome browser (HTTPS, custom port 6530) #5343

Open
@tirthgajjar087

Description

@tirthgajjar087

Socket issue:

My Laravel backend is hosted on https://example001.com/, while my Reactapp is hosted on https://example002.com./ React uses the 4.8.1 version of the socket.io client, and Laravel uses the 4.7.5 version. What happens if I don't open website, https://example001.com/(my primary chat.js code), in Chrome so My https://example002.com/ website won't connect to the socket, breaks the socket connection, and displays a Websocket error.

What need I do to effectively run my https://example001.com/ without opening that website?..(SAFARI ,FIRE FOX RUNNING WELL)

My local (http) environment works properly, and the only problem is with the https environment.

My local (http) environment works properly, and the only problem is with the https environment.

Error :
Socket connection error---------: J: websocket error at Z.onError (https://example002.com/assets/engine.io-client-C44f3zIw.js:1:1577) at ws.onerror (https://example002.com/assets/engine.io-client-C44f3zIw.js:1:7721)

Server listing on: wss://example001:6530/socket.io/?user_id=1&user_token=eU1GUXBpbk...&user_type=admin&user_status=active&environment=production&EIO=4&transport=websocket

code:

export const handleSocketConnection = createAsyncThunk(
"socket/connectSocket",
async (data, thunkAPI) => {
const { user_id, user_type, user_token } = data;

    var options = {
        transports: ['websocket'],
        query: {
            user_id,
            user_token,
            user_type,

        },
        secure: true,
        withCredentials: false,
    };

    try {
        const socket = io(CHAT_URL, options);


        socket.on("connect", () => {
            console.log("Socket connected successfully");
            thunkAPI.dispatch(setSocketConnected(true));
        }
        );
        socket.on("connect_error", (err) => {
            console.error("Socket connection error---------:", err);
        });
        socket.on("disconnect", () => {
            console.log("Socket disconnected");
            thunkAPI.dispatch(setSocketConnected(false));
        });

        return thunkAPI.dispatch(setSocket(socket));
    } catch (error) {
        thunkAPI.dispatch(setSocketConnected(false));
        return rejectWithValue(error);
    }
}

);

Metadata

Metadata

Assignees

No one assigned

    Labels

    to triageWaiting to be triaged by a member of the team

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions