CODEWITHSUNDEEP
node.jstypescriptnext.jsnext.js13
Vladimirzb
Vladimirzb

Reputation: 497

Next.js 13 Route Handler Hanging on GET Request

I'm currently working on a Next.js 13 project and I'm having some trouble with the new routing feature. I've set up a route handler in app/api/ingresos/route.ts with the following code:

import { NextResponse } from 'next/server';
import PocketBase from 'pocketbase';

export async function GET() {
  const pb = new PocketBase('http://127.0.0.1:8090');
  const records = await pb.collection('ingresos').getFullList({
    sort: '-created',
  });
  return NextResponse.json(records);
}

When I try to make a GET request to http://localhost:3000/api/ingresos using Thunder Client, the request just loads indefinitely and doesn't return a response. Additionally, I'm seeing a 404 error in the console:

GET http://localhost:3000/api/ingresos 404 (Not Found)
eval @ on-demand-entries-client.js:49
eval @ websocket.js:58
handleMessage @ websocket.js:57

I've checked that my PocketBase server is running and that the 'ingresos' collection exists. Here's the structure of my project:

PS C:\Users\zantl\OneDrive\Escritorio\REACT\gestions-gastospro> Get-Tree
app/
  api/
    Ingresos/
      route.ts
  components/
    navbar.tsx
    tablaIngresosCliente.tsx
  Ingresos/
    page.tsx
  favicon.ico
  globals.css
  layout.tsx
  page.tsx
pocketbase_0.16.10_windows_amd64/
  pb_data/
    data.db
    logs.db
  pb_migrations/
    1690143617_created_ingresos.js
    1690143631_updated_ingresos.js
  CHANGELOG.md
  LICENSE.md
  pocketbase.exe
public/
  next.svg
  vercel.svg
.eslintrc.json
.gitignore
next-env.d.ts
next.config.js
package-lock.json
package.json
postcss.config.js
README.md
tailwind.config.js
tsconfig.json

I'm not sure what's causing this issue. Could it be a problem with my async/await usage, or perhaps something to do with how I've set up my route handler? Any help would be greatly appreciated!

Upvotes: 0

Views: 2132

Answers (1)

Yilmaz
Yilmaz

Reputation: 49561

Can you run the code inside try/catch block and catch the error

export async function GET() {
  const pb = new PocketBase('http://127.0.0.1:8090');
  try {
    const records = await pb.collection('ingresos').getFullList({
      sort: '-created',
    });
    return new Response(JSON.stringify(records));
    
  } catch (error) {
    console.error(error)
    return new Response('Could not fetch', { status: 500 })

  }      
}

Upvotes: 2

Related Questions