cors出现在React中,但未出现在Node.js中。为什么?

cors出现在React中,但未出现在Node.js中。为什么?,node.js,reactjs,axios,Node.js,Reactjs,Axios,我将axios与React和Node.js一起使用,但结果不同 使用react,我得到了CORS错误,但使用node.js,我得到了正确的响应。 下面是示例代码 反应 import React, { useEffect } from 'react'; import axios from 'axios'; import hmacGenerator from '../utils/hmacGenerator'; const REQUEST_METHOD = 'POST

我将axios与React和Node.js一起使用,但结果不同

使用react,我得到了CORS错误,但使用node.js,我得到了正确的响应。

下面是示例代码

反应

    import React, { useEffect } from 'react';
    import axios from 'axios';
    import hmacGenerator from '../utils/hmacGenerator';

    const REQUEST_METHOD = 'POST';
    const DOMAIN = 'https://api-gateway.exmple.com';
    const URL = '/deeplink'
    const ACCESS_KEY = 'xxxxxx';
    const SECRET_KEY = 'xxxxxx';

    const REQUEST = {
      coupangUrls: [
        'https://www.example.com/search?component=&q=good&channel=user'
      ]
    };

    const App = () => {
      useEffect(() => {
        (async () => {
          try {
            const authorization = hmacGenerator(
              REQUEST_METHOD,
              URL,
              SECRET_KEY,
              ACCESS_KEY
            );

            console.log(authorization);
            axios.defaults.baseURL = DOMAIN;
            const response = await axios.request({
              method: REQUEST_METHOD,
              url: URL,
              headers: { Authorization: authorization },
              data: REQUEST
            });

            console.log(response);
          } catch (err) {
            console.error(err.response);
          }
        })();
      }, []);

      return <div>App</div>;
    };

    export default App;
为什么Node.js没有得到CORS错误

如果你不明白我的问题,请留下评论

请让我知道


谢谢。

这是因为React在客户端(浏览器)上运行,正如Mozilla定义的CORS一样

跨源资源共享(CORS)是一种机制,它使用额外的HTTP头告诉浏览器让在一个源运行的web应用程序访问来自不同源的选定资源

即使您使用Postman进行此API调用,也不会得到任何CORS错误

参考:


希望有帮助

您是否使用节点中的express作为服务器端???
    const axios = require('axios');
    const { generateHmac } = require('./hmacGenerator');

    const REQUEST_METHOD = 'POST';
    const DOMAIN = 'https://api-gateway.exmple.com';
    const URL = '/deeplink'
    const ACCESS_KEY = 'xxxxxx';
    const SECRET_KEY = 'xxxxxx';

    const REQUEST = {
      coupangUrls: [
        'https://www.example.com/search?component=&q=good&channel=user'
      ]
    };


    (async () => {
      const authorization = generateHmac(
        REQUEST_METHOD,
        URL,
        SECRET_KEY,
        ACCESS_KEY
      );
      axios.defaults.baseURL = DOMAIN;

      console.log(authorization);

      try {
        const response = await axios.request({
          method: REQUEST_METHOD,
          url: URL,
          headers: { Authorization: authorization },
          data: REQUEST
        });
        console.log(response.data);
      } catch (err) {
        console.error(err.response.data);
      }
    })();