chatengine-io / react-chat-engine

React component for a cheap and easy chat API
138 stars 35 forks source link

WebSocket error on using ChatEngine component #52

Closed Valkyrie006 closed 3 years ago

Valkyrie006 commented 3 years ago

I tried to create a basic React application with react-chat-engine and when I use the ChatEngine component, on hosting it gives the error - SyntaxError: Failed to construct 'WebSocket': The URL contains a fragment identifier ('$'). Fragment identifiers are not allowed in WebSocket URLs. Please look into it!

alamorre commented 3 years ago

Good point. Right now the username and user-secret are passed through the URL as params. So if your secret has special chars then we're not handling it properly 😒

I'll keep this open and assign myself. We should change the auth flow a bit it'll just take some time

In the meantime you can use longer alphanumeric secrets that would be great

Valkyrie006 commented 3 years ago

If you are using APIs and sending data through URL as params due to GET request, then you can simply change GET to POST request and in that case, you can send data through the body(example-JSON) without any restrictions. This helps particularly in the case of big params and special characters params.

alamorre commented 3 years ago

The socket connection is a bit of an exception. All APIs pass data through standard bodies and headers.

The socket connection currently takes the Auth Context from the URL because they don't have headers. Really I'm going to make the socket connect automatically then pass auth after through request data.

The main takeaway is: There's a plan to connect socket more properly then every API will be totally fine

alamorre commented 3 years ago

Socket connection: https://github.com/alamorre/react-chat-engine/blob/08c6b4c0e6b67dad7a9c1f9452e72259173486b7/src/components/Socket/index.js#L183

Normal working API: https://github.com/alamorre/react-chat-engine/blob/08c6b4c0e6b67dad7a9c1f9452e72259173486b7/src/actions/chats/getChat.js#L5

mosesconverse commented 3 years ago

An error is occurring stating that my ChatEngine imported from react-chat-engine is not recognized although I installed the react chat engine with a --force command to see it fully installed

alamorre commented 3 years ago

Can you please submit a code snippet of you using so I can see?

mosesconverse commented 3 years ago

actually, ![Uploading 2021-05-10.png…]() it has finally worked. Thanks though