I’m not familiar with nextJS so I’m not totally sure, but looks like nextJS uses a tool called SWR to make api requests
You need to be VERY careful the scope of the API key you are storing client side and which api calls you make to Discourse so that you don’t expose your global API key to users since it looks like nextJS is a client side framework instead of server side. The proper way is probably to have next.js make a server side api request that then makes an authenticated api call out to your Discourse instance.
This answer might help you out:
As per the docs Arguments you should do
const fetcher = (url, token) => axios .get(url, { headers: { Authorization: "Bearer " + token } }) .then((res) => res.data); const { data, error } = useSWR( [`http://localhost:8000/api/v1/users/get-avatar`, auth.token], fetcher ); if (error) console.log(error); if (data) console.log(data);