javascript - Zeit (Vercel) 现在无服务器身份验证请求因 CORS 而失败

标签 javascript cors authorization serverless vercel

在执行 PATCH 时,我无法正确处理 CORS 问题/POST/PUT来自浏览器的请求发送 Authorization带有 Bearer token 的标题(这在浏览器之外和 GET 请求中正常工作)在 Zeit Now serverless 中.

我正在使用 Auth0如果有帮助,授权方面。

这是我的now.json headers 部分,我已经为这些尝试了很多组合,但都没有从浏览器成功。

Headers in now.json

  • 我尝试使用 npm cors打包不成功
  • 尝试添加 routesnow.json
  • 尝试使用 res.addHeader() 在无服务器函数顶部设置标题
  • 还尝试处理 OPTIONS请求手动执行此操作:

  • OPTIONS method custom handling

    最后,这是我得到的错误
    Access to XMLHttpRequest at 'https://api.example.org/api/users' from origin 'https://example.org' has been blocked by CORS policy: 
    Response to preflight request doesn't pass access control check: It does not have HTTP ok status.
    

    不知道我错了什么或如何正确处理。

    最佳答案

    我能够使用 micro-cors 绕过这个问题.

    我查了its code并且我尝试使用 res.setHeader 自己尝试做的事情并没有太大区别手动,可能错过了我猜的一些东西。

    不过我不明白为什么 now.json 中的设置无法正常工作,我需要在无服务器功能中手动执行此操作。

    无论如何,如果其他人发现这篇文章,我最终会得到这样的结果:

    import micro from "micro-cors";
    
    function MyApi(req, res) {
      if (req.method === "OPTIONS") {
        return res.status(200).end();
      }
      // handling other requests normally after this
    }
    
    const cors = micro();
    
    export default cors(MyApi);
    

    我可能会用自己编写的解决方案再试一次,以便更好地理解出了什么问题,也因为我不想要额外的依赖。

    如果我这样做,将更新此答案。

    编辑:经过深入检查后,我发现另一个问题是库 express-jwt专门更改 res对象当jwt解析失败。

    我有一个小型中间件,它通过以下方式破坏了一切:

    await authValidateMiddleware(req, res);
    

    当那个await失败了,它破坏了一切,因为express-jwt更改了res头在不知不觉中(设置错误),然后我尝试设置 res header 手动尝试自己正确处理错误,因此引发有关“多次更改 res header ”的问题。

    关于javascript - Zeit (Vercel) 现在无服务器身份验证请求因 CORS 而失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61217119/

    相关文章:

    java - Spring Security 自定义用户组授权

    javascript - 使用 react js 状态来存储经过身份验证的用户的 token 是否安全?

    javascript - 当用户标记复选框时触发 jquery 操作

    javascript - htaccess 中的访问控制允许来源

    javascript - json 字符串化和 json 解码问题

    java - Spring Security CORS 问题 : "OPTIONS http://localhost:8080/403 ()"

    google-drive-api - Google Drive 和 CORS 跨域请求

    laravel - 对所有 API 请求使用客户端凭证中间件

    JavaScript 获取构造函数未定义

    javascript - 如何防止页面在表单提交后重新加载 - JQuery