Question

我正在尝试按照说明使用Firebase Admin SDK验证ID令牌。我当前的身份验证代码如下（在Vue中）：

// Auth.vue, inside the firebaseui config callback
signInSuccessWithAuthResult: function(authResult, redirectUrl) {
      authResult.user
        .getIdToken(/* forceRefresh */ true)
        .then(function(idToken) {
          // Send token to your backend via HTTPS
          // ...
          console.log(idToken);
        })
        .catch(function(error) {
          // Handle error
          console.log(error);
        });

登录正常，我可以完美地获得authResult。但是，似乎函数getIdToken是问题所在，因为在控制台上出现以下错误：

Cross-Origin Request Blocked: 
The Same Origin Policy disallows reading the remote resource at 
https://securetoken.googleapis.com/v1/token?key=AIzaSyApp5yu051vMJlNLoQ1ngVSd-f2k7Pdavc. 
(Reason: CORS request did not succeed).

在我的请求列表中，一个挂起的是OPTIONS方法，具有以下标头：

OPTIONS /v1/token?key=AIzaSyApp5yu051vMJlNLoQ1ngVSd-f2k7Pdavc HTTP/1.1
Host: securetoken.googleapis.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:62.0) Gecko/20100101 Firefox/62.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.8,pt-BR;q=0.5,de;q=0.3
Accept-Encoding: gzip, deflate, br
Access-Control-Request-Method: POST
Access-Control-Request-Headers: x-client-version
Origin: http://localhost:8080
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache

我什至不知道问题出在哪里。它来自Vue方面吗？我正在开发服务器中运行它（通过简单的yarn serve，vue cli 3）。解决方案是当我在可以实际配置cors的生产服务器上运行Vue时吗？

任何对此事的欢迎都非常欢迎... 谢谢！

Answer 1

弄清楚了。我在错误的地方叫它。帮助的是this thread，它向我指出了Preflighted Requests，这是OPTIONS请求的要求：

“预检”请求首先通过OPTIONS方法向另一个域上的资源发送HTTP请求，以确定实际请求是否可以安全发送。跨站点请求这样被预处理，因为它们可能会影响用户数据。

因此，我意识到我不应该在我最初获得授权的Post请求中发送此请求。将其移至另一种方法可以使其工作。

Vue Firebase验证ID令牌CORS问题

1 个答案: