React 中的 Axios GET 请求答案

【问题标题】：Axios GET request in ReactReact 中的 Axios GET 请求
【发布时间】：2018-11-26 14:56:21
【问题描述】：

我正在尝试从 shopify API 执行 GET 请求，但我不知道如何在 reuqest 正文中放置凭据，使用 CURL 它看起来像这样：https://API_KEY:PASSWORD@myShop.myshopify.com/admin/orders.json

但是当我尝试对 axios 做同样的事情时，我得到了xhr.js:173 GET http://localhost:3000/[object%20Object] 404 (Not Found) index.js:1452 Error: Request failed with status code 404，这是我的代码：

axios
  .get( { "Access-Control-Allow-Origin": "*" },
    "https://myShop.myshopify.com/admin/orders.json",

    {
      headers: {
        API_KEY: "key",
        PASSWORD: "password"
      }
    }
  )

  .then(response => {
    console.log(response);
    this.setState(response);
  })

我还尝试将 API_KEY 和 PASSWORD 直接包含在链接中，就像在 CURL 链接中一样，但这不被浏览器接受，因为密钥会被暴露。

我做错了什么？

【问题讨论】：

for start url 应该是 axios.get 的第一个参数和 options 第二个。
如果我将它移动到第二个位置，我会收到此错误：Access to XMLHttpRequest at 'https://myShop.myshopify.com/admin/orders.json' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.，我之前已经尝试过，但是谢谢！
请理解添加标头Access-Control-Allow-Origin 不会阻止CORS 策略错误。必须在接收服务器上启用 CORS。
您可能想检查一下有关 cors 的信息。developer.mozilla.org/en-US/docs/Web/HTTP/CORS 并相应地设置您的响应标头。

标签： reactjs axios shopify

【解决方案1】：

如果您遇到 CORS 错误，则说明您做的事情完全错误。这意味着您将您的 API 凭据暴露给宇宙，这可能是您不想做的事情。

【讨论】：

是的，经过一番阅读我明白了这一点，所以我可能需要改变策略。什么是更好的策略？
构建一个应用程序，然后连接一个应用程序代理。然后，您可以安全地调用 API，并且 CORS 问题为零。