Question

我使用Azure Mobile App进行Google身份验证，使用以下代码：

var client = new WindowsAzure.MobileServiceClient(appUrl);
    client.login("google").done(function (results) {
    console.log("You are now logged in as: " + results.userId);                             
}, function (err) {
       console.log("Error: " + err);
    });

它有效。但是，当我尝试获取有关经过身份验证的用户的信息时，在完成功能中添加代码：

var url = client.applicationUrl + '/.auth/me';
fetch(url)
    .then(function (data) {
          return data.json()
     }).then(function (user) {
// The user object contains the claims for the authenticated user
});

我收到以下错误：

无法加载Fetch API https://accounts.google.com/o/oauth2/v2/auth?response_type=code&client_id=3 ... 请求中不存在“Access-Control-Allow-Origin”标头资源。因此不允许原点'null'访问。如果是不透明的响应满足您的需求，将请求的模式设置为'no-cors' 在禁用CORS的情况下获取资源。

此错误与跨源请求有关，可以通过两种方式解决：

使用jsonp代替json，但我不知道fetch函数如何与jsonp一起使用。
最好使用CORS，应在Google Developer Console中激活此CORS选项。

可能的问题是，我的网络应用程序和Azure移动应用程序位于不同的域中，但我在Google Developer Console上将这两个域添加到授权的JavaScript源。

顺便说一下，我在Chrome中遇到的错误。如果我尝试Edge，我会收到以下错误：

SCRIPT5022：ReferenceError：'fetch'未定义

因为Edge还不支持抓取。

Answer 1

我建议将以下配置应用于Azure移动服务found here.

   <system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>

或者，它可能是此post here中讨论的错误。

试图获取有关经过身份验证的用户

1 个答案: