Description
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);
}
}
);