CORS 问题，HapiJS HAPI-16

Question

编辑：这只适用于 HapiJS 16- 版本

我有一个客户端在 react 和一个使用 HapiJS 的服务器。

在客户端，我尝试向服务器发出 POST 请求，但出现以下错误

选项http://localhost:3001/sentilize/ 404（未找到）localhost/:1 无法加载http://localhost:3001/sentilize/：对预检的响应 请求未通过访问控制检查：否 请求中存在“Access-Control-Allow-Origin”标头 资源。因此不允许使用原点“http://localhost:3000” 使用权。响应的 HTTP 状态代码为 404。

我在 3001 端口上运行服务器。我在 3000 上运行客户端。

任何帮助/指导将不胜感激。另外，我可以使用 POSTMAN 成功地向服务器发出 post 请求。只是来自 React 是行不通的。

这是我的 server.js

import Hapi from "hapi";
import { routes } from "./routes";

const server = Hapi.server({
  host: "localhost",
  port: 3001,
  routes: { cors: true }
});

// Register Routes
routes.forEach(route => {
  server.route(route);
});

// We need to install babel-polyfill
// because async and await are in es7
async function start() {
  try {
    await server.start();
  } catch (err) {
    console.log(err);
  }
  console.log("Hapii server is running");
}

start();

这是在前端进行调用的代码

  fetchSentiment = () => {
    axios
      .post("/", {
        sentence: this.state.value
      })
      .then(response => {
        this.setState({ sentiment: response.data });
      })
      .catch(error => {
        console.log("Error: ", error);
      });
  };

我有一个 axios 实例设置如下 (axios-sentiment.js)

import axios from "axios";

const instance = axios.create({
  baseURL: "http://localhost:3001/sentilize"
});

export default instance;

Answer 1

服务器配置看起来正确。正在使用的客户端 HTTP 库可能未发送正确的标头。特别要确保请求具有Origin 标头。请注意，cors: true 设置仅支持某些 CORS 场景，并非在所有情况下都有效。阅读 simplified requests 以了解 CORS 的一些细微差别。然后route.options.cors 文档会更有意义，如果需要，您可以将其设置为对象以调整其行为。

其他一些不相关的提示：

• async await 在 Node 7.6 及更高版本中受支持。你可能根本不需要 babel 或 babel-polyfill。请参阅 node.green 了解支持的语言功能。
• 尝试/捕获一个仅记录错误的 Promise 链是不应再使用的旧模式。 Promise 错误过去通常被默认吞下，但现在不再是，它们被现代版本的 Node（以及浏览器）记录下来。如果您想更加激进，可以使用throw-rejects 来故意使进程崩溃，而不仅仅是记录，这样更容易发现错误。