Uncaught SyntaxError: Unexpected token p in JSON at position 4?

Hello everyone, i’m a french novice developer and,i’ve a problem with my background.js and app.js.

I want do an API twitch request with XMLHttpRequest but Google Chrome console say that:

I will send my .js codes lines after :slight_smile:

THX

Looks like you are calling id.twitch.tv/streams

Thats not a valid endpoint, you are getting a 404 http error and not processing that before attempting to JSON decode

Streams API is documented here:

Okay thx but i’v another problem now :upside_down_face:

Sry dude i’m bad in JavaScript programming language :sweat_smile:

This tells me nothing.

What are you actually trying to do, and what code do you have thats trying to do it

I trying to know when streamer is online or offline to notify users

  1. Client-ID needs to be a header
  2. You are missing an oAuth token - Requiring OAuth for Helix Twitch API Endpoints
  3. Your URL is constructed wrong

Should be

http://api.twitch.tv/helix/streams?user_login=anaee

  1. these days it’s easier for your front end to call your backend and the backend makes the call to Twitch with an App Access Token - https://dev.twitch.tv/docs/authentication/getting-tokens-oauth#oauth-client-credentials-flow

To get the curl -H ‘Authorization:*****’
we need to do :

POST https://id.twitch.tv/oauth2/token
    ?client_id=<your client ID>
    &client_secret=<your client secret>
    &grant_type=client_credentials
    &scope=<space-separated list of scopes>

but where i put it (sry dude)

This would be done on a backend system which would collect the token and store it for reuse, most commonly a cron job, or other service for handling fetch/store/maintatin of a token

I’m losted, it’s complicated
how can I do this :joy:

You need an oAuth token to make requests to helix

If you are not logging the user into your website via oAuth that means an App Access Token

Whilst you can, you should generate an App Access Token each time you need to call Helix you should create one and store and use it till it expires.

You can’t use the oAuth Token on the front end as it constitutes a password and needs to be protected.

So your front end needs to call the server, the server recalls the preexisting App Access Token and calls helix to get the live stream status.

That said, since it’s also a server you can use webhooks instead which means you don’t have to call helix at all, Twitch will tell you when a stream starts and ends. Then you just store the Stream status in your database

Okay thx i go to do that