Create JWT error null

[helveden]

Hello i search to create token

I try this : const serverClient = StreamChat.getInstance( apiKey, api_secret); < error here const token = serverClient.createToken(us);

const client = new StreamVideoClient({ apiKey, user, token }); const call = client.call('default', callId);

but i have error here :

[helveden]

leave img see next comment :)

[helveden]

[szuperaz]

Hi,

Based on your screenshot you're trying to create a stream chat server client in a browser environment. This is a security problem, you should never put your API secret in a client application. The following code will only work in a Node.js environment:

const serverClient = StreamChat.getInstance( apiKey, api_secret); < error here
const token = serverClient.createToken(us);

Your client application should receive the token from your own backend. This is the typical flow:

• Users log in to your application using your own login method, and then they receive a token they can use to call your application backend
• Your application backend has a protected endpoint that can issue Stream tokens
• You can create Stream tokens on the backend with the createToken method.

A sidenote: I can see that you're using our React Video SDK. For server-side video integrations you can use our new node SDK which has support for both chat and video products.

I'm going to close this ticket, but feel free to reopen it if you have further questions.

[szuperaz]

If you don't yet have such backend, you can use Stream's static token generator: https://getstream.io/chat/docs/react/token_generator/ while in development mode. But you should never use static tokens in your production application, these are for testing only.

[helveden]

i use token in application on dashboard, and this token is available with what the doc suggests. Am I wrong ? Because in my case, it is a js error or jwt never has its object, it is obvious when we compile the code during a yarn build.

Cordialy

Le jeu. 16 mai 2024 à 09:07, Zita Szupera @.***> a écrit :

If you don't yet have such backend, you can use Stream's static token generator: https://getstream.io/chat/docs/react/token_generator/ while in development mode. But you should never use static tokens in your production application, these are for testing only.

— Reply to this email directly, view it on GitHub https://github.com/GetStream/stream-chat-js/issues/1299#issuecomment-2114230904, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABRDSYV7TUAH4TABHZPTUCLZCRLMTAVCNFSM6AAAAABHW7RSTKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDCMJUGIZTAOJQGQ . You are receiving this because you authored the thread.Message ID: @.***>

[szuperaz]

Yes, you're doing what the documentation suggests, but in the wrong environment. Based on your screenshot you're running the token generation code in a browser, but it should be run in Node.js.

Let me know if I missed something, and your application isn't a browser application.

[helveden]

I don't understand the report, I have to run a nodejs server outside of my react code to have a video conference? Maybe like a socket.io, only to make a token? I want to do it but I doubt it will solve this problem. Maybe I can find a new solution to generate a jwt (I lack experience on this subject by the way) in xhr from my react client then initialize the object new StreamVideoClient({ apiKey, user, token });

Le jeu. 16 mai 2024 à 09:41, Zita Szupera @.***> a écrit :

Yes, you're doing what the documentation suggests https://getstream.io/chat/docs/javascript/tokens_and_authentication/?language=nodejs#generating-tokens, but in the wrong environment. Based on your screenshot you're running the token generation code in a browser, but it should be run in Node.js.

Screenshot.2024-05-16.at.09.38.56.png (view on web) https://github.com/GetStream/stream-chat-js/assets/6690098/314d2ca9-9c0c-4eb1-9586-db66a22b8062

Let me know if I missed something, and your application isn't a browser application.

— Reply to this email directly, view it on GitHub https://github.com/GetStream/stream-chat-js/issues/1299#issuecomment-2114291029, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABRDSYXHMCIWYLNWFY6HPVLZCRPJXAVCNFSM6AAAAABHW7RSTKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDCMJUGI4TCMBSHE . You are receiving this because you authored the thread.Message ID: @.***>

[szuperaz]

• As I mentioned for testing you can use our static token generator: https://getstream.io/chat/docs/react/token_generator/ -> you can provide the API secret from your dashboard to it, and a user id and it will give you a token that you can copy-paste in your code and provide to StreamVideoClient. These tokens don't expire, so you only have to do it once. No need for a separate backend.
• But, for production use, you'll need to have a backend. This is not related to our product, this is how all API services work. If you were to have your application secret from the dashboard in your React app, then anyone could get your secret, issue tokens, and use your Stream subscription. So you need to have a backend application that can securely authenticate the users who can use your video conference application and issue Stream tokens. " Maybe I can find a new solution to generate a jwt (I lack experience on this subject by the way) in xhr from my react client then initialize the object" -> Yes typically your backend provides an XHR endpoint for your React app to call and issue a Stream token. It's fine if your don't have experience with creating JWT tokens, our node SDK will take care of token creation using the createToken method.

[helveden]

Yes but the createToken method I can't reach it because the previous line const serverClient = StreamChat.getInstance(apiKey, api_secret); contains the error.

I will see for an alternative of creating jwt in my api php and sending it to new StreamVideoClient({ apiKey, user, token });

Le jeu. 16 mai 2024 à 11:08, Zita Szupera @.***> a écrit :

• As I mentioned for testing you can use our static token generator: https://getstream.io/chat/docs/react/token_generator/ -> you can provide the API secret from your dashboard to it, and a user id and it will give you a token that you can copy-paste in your code and provide to StreamVideoClient. These tokens don't expire, so you only have to do it once. No need for a separate backend.
• But, for production use, you'll need to have a backend. This is not related to our product, this is how all API services work. If you were to have your application secret from the dashboard in your React app, then anyone could get your secret, issue tokens, and use your Stream subscription. So you need to have a backend application that can securely authenticate the users who can use your video conference application and issue Stream tokens. " Maybe I can find a new solution to generate a jwt (I lack experience on this subject by the way) in xhr from my react client then initialize the object" -> Yes typically your backend provides an XHR endpoint for your React app to call and issue a Stream token. It's fine if your don't have experience with creating JWT tokens, our node SDK https://getstream.io/video/docs/api/ will take care of token creation using the createToken method.

— Reply to this email directly, view it on GitHub https://github.com/GetStream/stream-chat-js/issues/1299#issuecomment-2114621282, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABRDSYSSNXE2SM32TGKPXBDZCRZQHAVCNFSM6AAAAABHW7RSTKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDCMJUGYZDCMRYGI . You are receiving this because you authored the thread.Message ID: @.***>

[szuperaz]

If you have a PHP backend, we have a PHP SDK for token generation: https://getstream.io/chat/docs/php/?language=php