我收到错误 GET http://localhost:3000/api/products 404（未找到）答案

【问题标题】：I am getting an error GET http://localhost:3000/api/products 404 (Not Found)我收到错误 GET http://localhost:3000/api/products 404（未找到）
【发布时间】：2021-02-22 07:17:40
【问题描述】：

嗯，StackOverflow 中有很多关于这个错误的问题，我已经看到所有这些问题都对我不起作用。我正在使用 react with redux 试图获取一些产品。我的后端服务器节点在端口 5000 上运行，并且每当我尝试使用我的前端运行的端口 3000 获取数据时，我同时使用同时启动两个服务器。请有人帮我解决这个问题

package.json 文件

{
  "name": "proshop",
  "version": "1.0.0",
  "description": "MERN application named proshop",
  "main": "server.js",
  "type": "module",
  "scripts": {
    "start": "node backend/server",
    "server": "nodemon backend/server",
    "client": "npm start --prefix frontend",
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "data:import": "node backend/seeder",
    "data:destroy": "node backend/seeder -d"
  },
  "keywords": [
    "NodeJS",
    "ExpressJs",
    "React",
    "Redux",
    "MongoDb"
  ],
  "author": "Narayan Maity",
  "license": "ISC",
  "dependencies": {
    "bcryptjs": "^2.4.3",
    "colors": "^1.4.0",
    "concurrently": "^5.3.0",
    "dotenv": "^8.2.0",
    "express": "^4.17.1",
    "express-async-handler": "^1.1.4",
    "mongoose": "^5.10.9"
  },
  "devDependencies": {
    "nodemon": "^2.0.6"
  }
}

这是我的 productsAction.js 文件

import axios from 'axios';
import {
  PRODUCT_LIST_FAIL,
  PRODUCT_LIST_REQUEST,
  PRODUCT_LIST_SUCCESS,
} from '../constants/productConstants';

export const listProducts = () => async (dispatch) => {
  try {
    dispatch({ type: PRODUCT_LIST_REQUEST });

    const { data } = await axios.get('http://localhost:5000/api/products');

    dispatch({ type: PRODUCT_LIST_SUCCESS, payload: data });
  } catch (error) {
    dispatch({
      type: PRODUCT_LIST_FAIL,
      payload:
        error.response && error.response.data.message
          ? error.response.data.message
          : error.message,
    });
  }
};

如果我使用像 HTTP://localhost:5000/api/products 这样的完整地址，它会给我 CORS 错误

【问题讨论】：

在react 或client 文件夹中，在package.json 中添加新的key 和value 对"proxy": "http://localhost:5000"。然后你可以做await axios.get('/api/products')
感谢@lala 它的工作请作为答案发布，所以我可以接受

标签： node.js reactjs redux

【解决方案1】：

如果在 client 或 react 项目文件夹中添加 "proxy": "http://localhost:5000" 会更容易和 focus，如下所示：-

client/package.json

{
  "name": "projectname",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
  ...}
  "proxy": "http://localhost:5000"
}

那么你可以这样做：-

await axios.get('/api/products') // straight away use whatever path you've specified

【讨论】：

我添加了代理，但出现错误，并且在浏览器上出现此代码 try { dispatch({ type: PRODUCT_LIST_REQUEST }) const { data } = await axios.get('/api/products') dispatch ({ type: PRODUCT_LIST_SUCCESS, payload: data }) } catch (error) { dispatch({ type: PRODUCT_LIST_FAIL, payload: error.response && error.response.data.message ? error.response.data.message : error.message, }) } } 我已将代理设置为“代理”：“localhost:5000”，但仍然出现错误
CORS 错误？或不同的错误？你能更新你上面的代码吗
import axios from 'axios' import { PRODUCT_LIST_REQUEST, PRODUCT_LIST_SUCCESS, PRODUCT_LIST_FAIL, } from '../constants/productConstants' export const listProducts = () => async (dispatch) => { try { dispatch ({ type: PRODUCT_LIST_REQUEST }) const { data } = await axios.get('/api/products') dispatch({ type: PRODUCT_LIST_SUCCESS, payload: data }) } catch (error) { dispatch({ type: PRODUCT_LIST_FAIL, payload : error.response && error.response.data.message ? error.response.data.message : error.message, }) } }
错误：对象作为 React 子级无效（找到：带有键 {} 的对象）。如果您打算渲染一组子项，请改用数组。
问题是什么时候使用下面的代码抛出错误： import express from 'express' import asyncHandler from 'express-async-handler' import Product from '../models/productModel.js' const router = express.Router() //@desc 获取所有产品 //@route GET /api/products //@access Public router.get( '/', asyncHandler(async (req, res) => { const products = await Product.find({}) throw new Error('Some Error') res.json(products) }) ) 我收到错误，但是当我删除该行时，它会在抛出错误时正常工作，它会从 :3000/api 查找数据/产品