Hey all,
I have read countless responses to this same question on the forums, but none of them have solved my question so far, unfortunately.
I am building a MERN stack app using the Twitch API and I would like to return a list of live streams using a game_id that I fetch before making another API call to get the list of 100 streamers streaming in that category.
The first API call works fine, but the second one returns this error:
{
error: 'Unauthorized',
status: 401,
message: 'Client ID and OAuth token do not match'
} <- parsedStreams
I unfortunately at this point do not know the proper place to store tokens or anything, so for now I have put the generated token in my .env file. I know for a fact it isn’t expired because I JUST generated a new one to double check.
Here is what the full call looks like:
router.get('/:name', async (req, res) => {
console.log('name route it')
try {
// const tokenCall = await fetch(`https://id.twitch.tv/oauth2/token?client_id=${process.env.CLIENT_ID}&client_secret=${process.env.CLIENT_SECRET}&grant_type=client_credentials`, { method: 'POST'
// })
// const parsedToken = await tokenCall.json();
// const token = parsedToken
// console.log(token, '<- token in Twitch call')
const game = await fetch(`https://api.twitch.tv/helix/games?name=${req.params.name}`, {
method: 'GET',
headers: {
'Authorization': `Bearer ${process.env.ACCESS_TOKEN}`,
'Client-Id': process.env.CLIENT_ID
}
})
const parsedGame = await game.json()
console.log(parsedGame, '<- parsedGame')
const gameId = parsedGame.data[0].id
console.log(gameId, '<- gameId')
const streams = await fetch(`https://api.twitch.tv/helix/streams?game_id=${gameId}&first=100`, {
method: 'GET',
headers: {
'Authorization': `Bearer ${process.env.ACCESS_TOKEN}`,
'Cliend-Id': process.env.CLIENT_ID,
}
})
const parsedStreams = await streams.json()
console.log(parsedStreams, '<- parsedStreams')
} catch (err) {
console.log(err, '<- err in token call')
}
})
Any help is appreciated. Thank you!