Azure 移动服务 invokeAPI 调用的控制台错误

Question

我正在将我的 Angular 应用程序与 Azure 服务后端集成。

我最初只是像这样使用标准的 $http 调用：

   $http({
      method: 'POST',
      url: "https://services.example.com/Api/myApi",
      headers : {
        "Content-Type": "application/json",
        "Ocp-Apim-Subscription-Key": "my-key"
      },
      data : post,
      success : function(data,status) {
        console.log(data + "  " + status);
      },
      failure : function(err) {
          console.log(err)
      }

但这奇怪地返回了 200 响应，但抛出了一个 No 'Access-Control-Allow-Origin' header is present on the requested resource 错误。后端开发人员向我保证 CORS 是开放的，所以迷路了。

然后尝试与 https://github.com/TerryMooreII/angular-azure-mobile-service 集成。集成很有意义，调用如下所示：

Azureservice.invokeApi('myApi', {
          method: 'post',
          body: {
             data: 'Cheese'
          },
          headers : {
             'Content-Type' : 'application/json'
          }
      })
      .then(function(response) {
          console.log('Here is my response object');
          console.log(response)
      }, function(err) {
          //console.error('Azure Error: ' + err);
      });

而且我收到无法描述的错误：选项 https://services.example.com/api/myApi MobileServices.Web-1.1.2.min.js:2

t.DirectAjaxTransport.t.performRequest@MobileServices.Web-1.1.2.min.js:2t.Platform.t.webRequest@MobileServices.Web-1.1.2.min.js:2t.MobileServiceClient.MobileServiceClient._request @MobileServices.Web-1.1.2.min.js:2（匿名函数）@MobileServices.Web-1.1.2.min.js:2t.Platform.t.async@MobileServices.Web-1.1.2.min.js:2Promise @ MobileServices.Web-1.1.2.min.js:2t.Platform.t.async @MobileServices.Web-1.1.2.min.js:2invokeApi @angular-azure-mobile-service.min.js:1$scope.submit @form.js:30$a.functionCall @angular.js:10567（匿名函数）@angular.js:18627$get.h.$eval @ angular.js:12412$get.h.$apply @angular.js:12510(匿名函数) @angular.js:18626n.event.dispatch @jquery.js:4435n.event.add.r.handle@jquery.js:4121

再次加上 Access-Control-Allow-Origin header 错误，出现 404！

有什么想法吗？

Answer 1

第一个问题：您正在通过 angular js 代码进行跨域请求。因此，您必须在 Azure 移动服务设置中允许 angular 站点。转到您的移动服务仪表板 > 配置 > 应用程序设置 > 创建设置 "MS_CrossDomainOrigins"，值应为“http://[yoursitename]". You could allow multiple sites like this "http://[site1],http://[site2]”，但您的 ajax 呼叫看起来不像是在呼叫移动设备服务，即使标签表明您询问的是移动服务。无论如何，你应该使用像 Chrome 检查器这样的浏览器调试器并检查响应是否有 header "Access-Control-Allow-Origin" 。如果没有，您需要返回给您的后端开发人员。（Microsoft 记录的通过 webapiconfig 允许 COR 的方法在我发布时对我不起作用，所以也许他也在做同样的事情。它只在我调试时起作用。）

第二个问题：我认为你真的需要先弄清楚CORs问题。一次一个。

Azure 移动服务 invokeAPI 调用的控制台错误

Console Error with Azure Mobile Services invokeAPI call

javascript

azure

angularjs

azure-mobile-services