未捕获（承诺中）在节点js中发送数据响应时显示错误，并且地图函数在react中显示错误

Question

这是节点js 承诺出错

import express from "express";

const app = express();

const port = process.env.PORT || 3000;

app.get('/jokes', (req ,res) => {
  const jokes = [
    {
      id: 1,
      title: 'Why don\'t scientists trust atoms?',
      content: 'Because they make up everything!'
    },
    {
      id: 2,
      title: 'Did you hear about the mathematician who\'s afraid of negative numbers?',
      content: 'He\'ll stop at nothing to avoid them!'
    },
    {
      id: 3,
      title: 'Why did the scarecrow win an award?',
      content: 'Because he was outstanding in his field!'
    },
    {
      id: 4,
      title: 'Why don\'t skeletons fight each other?',
      content: 'They don\'t have the guts!'
    },
    {
      id: 5,
      title: 'What do you call fake spaghetti?',
      content: 'An impasta!'
    }
  ];

      res.send(jokes);        
    }); 


app.listen(port, () => {
  console.log(`Server at http://localhost:${port}`);
});

我遇到的错误

这是反应代码 尝试在react文件中使用map函数，但我没有捕获TypeError：joks.map不是函数

import  { useEffect, useState } from "react"
import React from "react"
import axios from 'axios'
import './App.css'
function App() {
  const [jokes, setJokes] = useState([])

  useEffect(() => {
   axios.get('http://localhost:3000/jokes')
   .then((response) =>{
    setJokes(response.data)
   })
   .catch((error) =>{
    setJokes(error)
   })
  }, [])
  

  return (
    <>
     <h1>Fullstack</h1>
      <p>JOKES : {jokes.length}</p>
      
      {
        jokes.map((joke,index) =>{
            <div key={joke.id} >
              <h3>{joke.title}</h3>
              <h3>{joke.title}</h3>
            </div>
        })
      }
    </>
  )
}
export default App

前端错误

尝试使用 send 和 json 发送数据

无法在反应错误中映射它，说笑话。map不是一个函数

Answer 1

您的 API 收到 403 错误，请检查日志以查看错误。