Trying to lock a API route behind authentication, having problems authenticating from my web app

So I've read over the SapphireJS documentation on how to lock my bot's API routes behind authentication using an authenticated() decorator like so:
import { createFunctionPrecondition } from '@sapphire/decorators';
import { HttpCodes, ApiResponse, ApiRequest } from '@sapphire/plugin-api';

export const authenticated = () =>
createFunctionPrecondition(
(request: ApiRequest) => Boolean(request.auth?.token),
(_request: ApiRequest, response: ApiResponse) => response.error(HttpCodes.Unauthorized)
);
import { createFunctionPrecondition } from '@sapphire/decorators';
import { HttpCodes, ApiResponse, ApiRequest } from '@sapphire/plugin-api';

export const authenticated = () =>
createFunctionPrecondition(
(request: ApiRequest) => Boolean(request.auth?.token),
(_request: ApiRequest, response: ApiResponse) => response.error(HttpCodes.Unauthorized)
);
However I'm now trying to send an API request to this route and I'm not quite sure how to authorize it. My web app uses NextJS and uses Next-Auth to authenticate using Discord's OAuth2. I thought I might be able to send a request like so:
const settingsResponse = await fetch(`${process.env.DISCORD_BOT_URL}/api/guilds/${guildId}/config`, {
method: 'GET',
headers: {
'Content-Type': 'application/json'
},
// Send the token in the auth property as expected by the decorator (I thought?)
credentials: 'include',
// @ts-ignore - Adding auth property to fetch options
auth: {
token: session.accessToken
}
});
const settingsResponse = await fetch(`${process.env.DISCORD_BOT_URL}/api/guilds/${guildId}/config`, {
method: 'GET',
headers: {
'Content-Type': 'application/json'
},
// Send the token in the auth property as expected by the decorator (I thought?)
credentials: 'include',
// @ts-ignore - Adding auth property to fetch options
auth: {
token: session.accessToken
}
});
But I can't seem to figure out how to properly authenticate with my bot using this method and I'm continuing to get unauthorized responses. Any advice?
5 Replies
Seren_Modz 21
Seren_Modz 214mo ago
next-auth would be incompatible with the auth that sapphire's api plugin has built-in the cookies being completely different: next-auth uses jwts while the api plugin takes another approach
Seren_Modz 21
Seren_Modz 214mo ago
GitHub
plugins/packages/api/src/lib/structures/http/Auth.ts at main · sap...
Plugins for the Sapphire Framework. Contribute to sapphiredev/plugins development by creating an account on GitHub.
Seren_Modz 21
Seren_Modz 214mo ago
Sapphire Framework
Using the built in OAUTH2 route (backend) | Sapphire
If you are using localhost as your test environment, make sure you use http//localhost in
Seren_Modz 21
Seren_Modz 214mo ago
Sapphire Framework
Using the built in Oauth2 route (frontend) | Sapphire
As there are many different libraries for making web frontends these days we will only cover raw HTML and JavaScript on
Doc
DocOP4mo ago
Ah okay, I'll have to work on setting up my own authentication system then

Did you find this page helpful?