Question

使用在React Insidefect中使用提取的问题

2020-05-24

948

javascript node.js reactjs express

我是Note Node和React的新手，我正在尝试获取一些数据并在我的React页面上显示。这很简单。我有一台在Localhost上运行的Express Server：3001，我的React应用程序在Localhost：3000上。我正在尝试获取数据，然后通过钩子将数据设置为状态。我似乎无法在React页面或Web开发人员控制台上获取数据。有什么方法可以看到在控制台中获取的数据？

这是我的React组件：

571159960

这是我的节点服务器：

025362949

我得到的结果是没有数据，而Chrome Dev Tools Console中的这两个错误。 /p>

index.js:1 unuffult syntaxerror：意外的令牌'＆lt;'

app.jsx：19未被师（在承诺）语法：意外的标记＆lt;在位置0

中非常感谢任何帮助！

Answer 1

您需要指定服务器返回数据的 Content-Type 。

您可以在发送响应之前使用 res.setHeader ，也可以使用 res.json() 发送 json 响应

https.get(url, (response) => {
    console.log("statusCode", res.statusCode);

    response.on("data", (d) => {
      const weatherData = JSON.parse(d);
      console.log(weatherData);
      res.json(weatherData); // use json response

    });
  }).on("error", (e) => {
    console.error(e);
  })

Answer 2

看起来result.json()可能有错误。

可能是请求返回的是html而不是json。

您可以使用postman或其他工具通过'localhost：3001'获取真正的响应以清除哪里出了问题。

Answer 3

const data = await result.json();

如果结果没有有效的 json，此行将出现问题。这就是您遇到错误的原因。捕获该错误并查看响应