Next.js Discord

Discord Forum

API Dynamic Routes

Unanswered
Pacific sand lance posted this in #help-forum
Open in Discord
Pacific sand lanceOP
I need some assists with API Dynamic Routes, and I have tried looking at the documentation, and it seems to not help me that much

Route: api/guilds/[guildId]/toggle-developer-status

## Route.ts
export async function POST(
  req: Request,
  context: { params: Promise<{ guildId: string }> }
) {
  const { guildId } = await context.params;

  const { enabled, user } = await req.json();

  const botRes = await fetch(`${process.env.BOT_API_URL}/api/toggle-developer-support`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      Authorization: `Bearer ${process.env.BOT_SECRET}`,
    },
    body: JSON.stringify({ guildId, enabled, user }),
  });

  const isJson = botRes.headers.get('content-type')?.includes('application/json');
  const data = isJson ? await botRes.json() : { error: 'Non-JSON response from bot' };

  return new Response(JSON.stringify(data), {
    status: botRes.status,
    headers: { 'Content-Type': 'application/json' },
  });
}


My issue is related to fetching the [guildId] as it keep outputting 
POST /api/guilds/1364844318086529025/toggle-developer-support 404 in 1290ms

12 Replies

@Orange-crowned Warbler > context: { params: Promise<{ guildId: string }> } This is incorrenct. Update like this: `export async function POST( req: Request, { params }: { params: { guildId: string } } // Changed this line ) { const guildId = params.guildId; // Changed this line const { enabled, user } = await req.json();`
Pacific sand lanceOP
# I GET THIS ERROR
[0] Error: Route "/api/guilds/[guildId]/toggle-developer-support" used `params.guildId`. `params` should be awaited before using its properties. Learn more: https://nextjs.org/docs/messages/sync-dynamic-apis
[0]     at POST (file://C%3A/Users/va495/Desktop/solva-web/src/app/api/guilds/%5BguildId%5D/toggle-developer-support/route.ts:5:25)
[0]   3 |   { params }: { params: { guildId: string } }
[0]   4 | ) {
[0] > 5 |   const guildId = params.guildId;
[0]     |                         ^
[0]   6 |
[0]   7 |   const { enabled, user } = await req.json();
[0]   8 |
[0]  POST /api/guilds/1364844318086529025/toggle-developer-support 404 in 1618ms
@Orange-crowned Warbler Your Next.js version?
Pacific sand lanceOP
v15.3.1
awareness481
What's the value of botRes.status?
@awareness481 What's the value of `botRes.status`?
Pacific sand lanceOP
Unsure, as I try to ask ChatGPT to provide some support with fixing issue; I have been having.
awareness481
Could you just try to console.log the value of botRes.status? It's possibly 404 which would explain why you get a 404 response in your route.
Pacific sand lanceOP
  console.log('BOT API response status:', botRes.status);

[0] BOT API response status: 404
awareness481
Yeah, since its 404 and you do

return new Response(JSON.stringify(data), {
    status: botRes.status, // <--- status here
    headers: { 'Content-Type': 'application/json' },
  });


it makes sense that the nextjs route also returns 404. You'd need to figure out why this

 const botRes = await fetch(`${process.env.BOT_API_URL}/api/toggle-developer-support`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      Authorization: `Bearer ${process.env.BOT_SECRET}`,
    },
    body: JSON.stringify({ guildId, enabled, user }),
  });


returns 404
@Pacific sand lance I need some assists with API Dynamic Routes, and I have tried looking at the documentation, and it seems to not help me that much **Route**: `api/guilds/[guildId]/toggle-developer-status` ## `Route.ts` ts export async function POST( req: Request, context: { params: Promise<{ guildId: string }> } ) { const { guildId } = await context.params; const { enabled, user } = await req.json(); const botRes = await fetch(`${process.env.BOT_API_URL}/api/toggle-developer-support`, { method: 'POST', headers: { 'Content-Type': 'application/json', Authorization: `Bearer ${process.env.BOT_SECRET}`, }, body: JSON.stringify({ guildId, enabled, user }), }); const isJson = botRes.headers.get('content-type')?.includes('application/json'); const data = isJson ? await botRes.json() : { error: 'Non-JSON response from bot' }; return new Response(JSON.stringify(data), { status: botRes.status, headers: { 'Content-Type': 'application/json' }, }); } My issue is related to fetching the `[guildId]` as it keep outputting POST /api/guilds/1364844318086529025/toggle-developer-support 404 in 1290ms
Pacific sand lanceOP
# Finish Outcome ~ Fixed Version
import { NextResponse } from 'next/server';

export async function POST(
  request: Request,
  context: { params: Promise<{ id: string }> }
) {
  const { id } = await context.params;
  const { enabled, user } = await request.json(); 

  const botRes = await fetch(`${process.env.BOT_API_URL}/api/toggle-developer-support`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      Authorization: `Bearer ${process.env.BOT_SECRET}`,
    },
    body: JSON.stringify({ guildId: id, enabled, user }), 
  });

  const isJson = botRes.headers.get('content-type')?.includes('application/json');
  const data = isJson ? await botRes.json() : { error: 'Non-JSON response from bot' };

  return NextResponse.json(data);
}