I need help with some things about the api router
Unanswered
Little fire ant posted this in #help-forum
Little fire antOP
Hi guys,
I have a few questions about the api router in nextjs,
1. if i have a get method in the route.ts that is to give visitors to that link a response right?
2. I have a site that i want to use to get data from. the site uses access tokens which require a "client secret" and "client ID". and then I am meant to use the access token to make further requests. How would I do this? I have looked through nextjs documentation but I am still confused as it doesn't pertain to using external apis
I have rewritten code countless times, I only want to ask this question to learn and see how you would implement something like this, the api I am referencing does not have a client that i can use.
I am willing to pay well if someone can show me verbose examples and explanations in dms .
I have a few questions about the api router in nextjs,
1. if i have a get method in the route.ts that is to give visitors to that link a response right?
2. I have a site that i want to use to get data from. the site uses access tokens which require a "client secret" and "client ID". and then I am meant to use the access token to make further requests. How would I do this? I have looked through nextjs documentation but I am still confused as it doesn't pertain to using external apis
I have rewritten code countless times, I only want to ask this question to learn and see how you would implement something like this, the api I am referencing does not have a client that i can use.
I am willing to pay well if someone can show me verbose examples and explanations in dms .
10 Replies
Western paper wasp
The
GET function in route.ts is used to make that route respond to GET requests according to the function body. Browsers make GET requests when they visit a link, so one use would be to give visitors to that link a response.You should store the “client secret†and “client ID†as environment variables (https://nextjs.org/docs/app/building-your-application/configuring/environment-variables).
Then, in a server component, route handler, or server action, you can exchange those credentials for an access token (for example, using
You might want to make an
Then, in a server component, route handler, or server action, you can exchange those credentials for an access token (for example, using
fetch to the external API), and store the token from the response in a variable. Finally, you can use that accessToken variable in further fetch requests.You might want to make an
obtainAccessToken function which performs the first fetch and returns the accessToken, so that you can perform that credential exchange more easily if it’s something you need to do a lot.Be sure not to use
NEXT_PUBLIC environment variables or run the token/secret-related code in client components, since usually (depending on the nature of the specific API you’re using) it’s important to make sure malicious visitors to your site can’t steal those credentials.Little fire antOP
Thank you so much for such a thorough answer, I really appreciate and respect the time you put into this answer, I will try my best to take from what you said and implement it into what I am trying to do. This helped clear some things up, so I can use fetch to get the token? I was trying something completely different to be honest, but as soon as I have the chance I will give this a go. thank you once again
Little fire antOP
in my head this is kind of how i see this working at the moment
Little fire antOP
@Western paper wasp any further feedback would be greatly appreciated.
Western paper wasp
That looks good to me
You can use
fetch vs axios.get interchangeably; they serve the same functionAnd you can call your
getData() / obtainAccessToken() just as normal function calls from your main GET function in route.ts