反应不使用代理URL将数据发布到服务器

发布于 2025-01-19 12:42:22 字数 2048 浏览 2 评论 0原文

对于前端,我在React JS中有一个代码,并且正在尝试将JSON数据作为React到Express的查询。 Express Server正在端口5000

  const [ search, setSearch ] = useState("");

  const updatesearches = async () => {
    const result = await fetch("/api/searchposts",{
      method: "POST",
      body: JSON.stringify({search}),
      headers: {
        "Content-Type" : "application/json",
      }
    });
    const res = await result.json();
    console.log(res);
  }

  useEffect(() => {
    updatesearches();
  },[search])

服务器运行完美,我已经在邮递员上测试过。对于后端,这里是exrpess控制器的代码:

const { PostModel }  = require("../models");

const getsearchposts = async (req , res) => {
    const result = await PostModel.find({title : "Ukraine war: Gruesome evidence points to war crimes on road outside Kyiv"});
    res.send(result);
}
module.exports = { getsearchposts };

poststrouters.js文件中

const express = require("express");
const router = express.Router();
const { getsearchposts } = require("../controllers/getsearchposts");

router.post("/api/searchposts", getsearchposts );

module.exports = router;

,在react package.json文件中,我使用了“ proxy”:“ http:// local -host :5000“,

当我更改搜索状态在下面

POST http://localhost:3000/api/searchposts net::ERR_INTERNET_DISCONNECTED
Sidebar.js:9          Uncaught (in promise) TypeError: Failed to fetch
    at updatesearches (Sidebar.js:9:1)
    at Sidebar.js:22:1
    at invokePassiveEffectCreate (react-dom.development.js:23479:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1)
    at invokeGuardedCallback (react-dom.development.js:4056:1)
    at flushPassiveEffectsImpl (react-dom.development.js:23566:1)
    at unstable_runWithPriority (scheduler.development.js:468:1)
    at runWithPriority$1 (react-dom.development.js:11268:1)
    at flushPassiveEffects (react-dom.development.js:23439:1)

For the front end, I have a code in react js and I am trying to post the JSON data as a query from react to express.
Express server is running on port 5000

  const [ search, setSearch ] = useState("");

  const updatesearches = async () => {
    const result = await fetch("/api/searchposts",{
      method: "POST",
      body: JSON.stringify({search}),
      headers: {
        "Content-Type" : "application/json",
      }
    });
    const res = await result.json();
    console.log(res);
  }

  useEffect(() => {
    updatesearches();
  },[search])

The server is working perfectly which I already have tested on the postman. For the back end here is the code of the exrpess controller:

const { PostModel }  = require("../models");

const getsearchposts = async (req , res) => {
    const result = await PostModel.find({title : "Ukraine war: Gruesome evidence points to war crimes on road outside Kyiv"});
    res.send(result);
}
module.exports = { getsearchposts };

In the postrouters.js file

const express = require("express");
const router = express.Router();
const { getsearchposts } = require("../controllers/getsearchposts");

router.post("/api/searchposts", getsearchposts );

module.exports = router;

And in the react package.json file i have used "proxy" : "http://localhost:5000",

The output is printed on the browser console when i change the search state is below

POST http://localhost:3000/api/searchposts net::ERR_INTERNET_DISCONNECTED
Sidebar.js:9          Uncaught (in promise) TypeError: Failed to fetch
    at updatesearches (Sidebar.js:9:1)
    at Sidebar.js:22:1
    at invokePassiveEffectCreate (react-dom.development.js:23479:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1)
    at invokeGuardedCallback (react-dom.development.js:4056:1)
    at flushPassiveEffectsImpl (react-dom.development.js:23566:1)
    at unstable_runWithPriority (scheduler.development.js:468:1)
    at runWithPriority$1 (react-dom.development.js:11268:1)
    at flushPassiveEffects (react-dom.development.js:23439:1)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文