Discussions

je recois un objet vide de l'api

Image

Bonjour,

 

je ne comprends pourquoi

 

page

export default async function Article({ params: { id } }) {
  const resp = await fetch("http://localhost:3000/api/articles", {
    method: "POST", // on envoi l id a notre api
    body: JSON.stringify({
      id,
    }),
  });

  const article = await resp.json();
  console.log(article);
  return (
    <div
      style={{
        color: "white",
        background: "green",
      }}
    >
      <h1> {article.title}</h1>
    </div>
  );
}

 

 

api route

 

import { NextResponse } from "next/server";

export async function POST(request) {
  const data = await request.json(); // on recoit la requete de /blog/id/page.jsx
  const id = data.id; // on recupere l id
  try {
    const resp = await fetch(
      `https://jl-next-projet-default-rtdb.europe-west1.firebasedatabase.app/articles/${id}.json`
    );

    const data = await resp.json();

    if (!resp.ok) {
      throw new Error("cet article n'existe pas");
    }

    return NextResponse.json(data, { status: 200 });
  } catch (e) {
    throw new Error(e.message);
  }
}

 

J ai mis un console.log dans mon fichier page et je recois un objet vide dans le terminal

J ai essayé aussi de mettre un consolelog dans mon route mais rien n'apparait dans le terminal.

J ai bien sur verifié mes url qui sont confroment a ce que j'ai dans mon firebase, l id est aussi dans l urldu navigateur je suis bien sur le port 3000 du coup je ne vois pas pourquoi je recois un objet vide...

5 réponses
Image
Louis-Nicolas Leuillet
Le 10/06/2024 à 14:21

Hello ton code me semble bon, tu as essayé de faire console.log sur ton api route ? La réponse devrait être dans le terminal du serveur et pas du navigateur.

Image
Jean-luc Crobeddu
Le 10/06/2024 à 15:06

oui j'ai fait un console.log dans mon api mais rien ne se passe dans le terminal du serveur. Et si je fais un console.log dans mon page.jsx j'ai {} qui s'affiche dans mon terminal

Image
Louis-Nicolas Leuillet
Le 11/06/2024 à 05:40

Si tu ne vois aucun console .log dans ton api, c'est qu'elle n'est pas appelée (tout dépend de où tu le mets) ! Normalement ton code devrait renvoyer au moins quelque chose sur ce code-là, autrement il y a un problème que je ne comprends pas.

import { NextResponse } from "next/server";

export async function POST(request) {
  console.log('api');
  const data = await request.json(); // on recoit la requete de /blog/id/page.jsx
  const id = data.id; // on recupere l id
  try {
    const resp = await fetch(
      `https://jl-next-projet-default-rtdb.europe-west1.firebasedatabase.app/articles/${id}.json`
    );

    const data = await resp.json();

    if (!resp.ok) {
      throw new Error("cet article n'existe pas");
    }

    return NextResponse.json(data, { status: 200 });
  } catch (e) {
    throw new Error(e.message);
  }
}
Image
Jean-luc Crobeddu
Le 11/06/2024 à 07:05

bonjour
oui j'ai fait le test hier console.log("toto") mais rien ne se passe dans le terminal du serveur.

Image
Louis-Nicolas Leuillet
Le 12/06/2024 à 09:07

Dans ce cas c'est que ton API ne fonctionne pas. Tu utilises bien le routeur app ? Essaye donc :

fetch("/api/articles"
Image
Inscrivez-vous ou connectez-vous pour participer à la discussion.

Informations

Créée le June 10, 2024 12:38 PM
Dernière activité le June 12, 2024 9:07 AM