【问题标题】:Cors and preflight errors with axios in vue在 vue 中使用 axios 的 Cors 和预检错误
【发布时间】:2018-12-22 07:30:25
【问题描述】:

在我的应用程序中,我将 laravel 作为后端,jwt-auth 作为身份验证,社交名流作为 oauth2 提供者,vue 作为我的前端。

现在我在客户端使用 axios 通过 github 对用户进行授权,例如(https://github.com/login/oauth/authorize),然后通过后端 api 获取访问令牌。

如果我使用 POSTMAN 发出授权请求,一切正常,但如果我使用前端 axio 请求发出请求,我总是会出错。我想我得到它们是因为某些 Header 值不正确。谁能解释一下 axion 请求需要哪些变量来执行授权请求。

亲切的问候。

【问题讨论】:

  • 您遇到了哪个 cors 错误?您对自己的服务器或 github 提出什么请求?如果到 github,那么 api 可能不打算在客户端使用,如果到您的服务器,那么您需要为 OPTIONS 请求添加正确的标头
  • 我可以和邮递员一起使用。我认为,如果 github 不打算被客户端使用,它也不会起作用。我收到此错误:当我执行获取请求时,预检响应无效(重定向)。这是请求:github.com/login/oauth/… 这里解释:developer.github.com/apps/building-oauth-apps/…
  • Postman 工作是因为它忽略了 CORS,浏览器使用 CORS 标头来确定是否允许请求。

标签: javascript laravel oauth-2.0 axios jwt-auth


【解决方案1】:

您可以在非常糟糕的浏览器中禁用 cors,或者您必须在后端启用 cors 并检查后端是否启用了 cors 在浏览器网络选项卡中查找 Access-Control-Allow-Origin 标头或您必须使用代理,以便将请求发送到与浏览器看到的相同的来源,但被重定向到其他一些 url。

In create-react-app this works by adding
"proxy":"http://youUrl:portNo."

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-03-01
    • 1970-01-01
    • 2021-09-09
    • 2016-09-06
    • 2021-03-26
    • 2017-12-14
    • 2020-10-26
    • 2017-08-01
    相关资源
    最近更新 更多