Javascript Azure移动服务调用API调用时出现控制台错误

我正在将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)
      }

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);
      });

但奇怪的是，这返回了一个200响应，但在请求的资源错误上却出现了一个无“Access Control Allow Origin”头。后端开发人员向我保证CORS是开放的，所以在那里迷失了方向

然后试着融入。集成是有意义的，调用如下所示：

   $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)
      }

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);
      });

我得到了一个非描述性的错误： 选项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.\u request@MobileServices.Web-1.1.2.min.js:2（匿名函数）@MobileServices.Web-1.1.2.min.js:2t.Platform.t.async@MobileServices.Web-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移动服务。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

再加上访问控制允许原点报头错误，带有404

---

有什么想法吗？

第一个问题：您正在通过您的js代码执行跨域请求。因此，您必须在Azure移动服务设置中允许您的angular站点。转到移动服务仪表板>配置>应用程序设置>创建设置“MS_CrossDomainOriginates”，值应为“”。您可以允许使用多个类似“”的站点，但是您的ajax调用看起来不像是在调用移动服务，即使标签表明您正在询问移动服务。无论如何，您应该使用诸如Chrome inspector之类的浏览器调试器，并检查响应是否具有标题“Access Control Allow Origin”。如果没有，您需要返回后端开发人员。（微软通过webapiconfig允许CORs的文档化方法在我发布它时对我不起作用，所以他可能也在这样做。它只在我调试时起作用。）

---

第二个问题：我认为你真的需要首先解决CORs问题。一次一个。

谢谢你的回答。我很确定这可以归结为CORS问题，但我是Azure新手，所以我不确定我的前端是否遗漏了什么。不客气。所以这确实是个问题？很高兴我能帮上忙，但看起来你在调用Azure管理API，所以我不确定我的移动服务说明是否有用。是的，这显然是CORS的问题。我能够访问Azure管理门户，发现允许的来源已设置，但CORS也需要接受的标题。