Question

我已尝试在stackoverflow中针对此问题接受了答案。在angularjs中，当我向本地post发送Api请求时，它可以工作。但是当我更改为跨域api时，它不起作用。

这是我的代码

 var myapp = angular.module('myApp',['ngRoute','http-auth-interceptor'])
    .config(['$httpProvider', function($httpProvider) {
        $httpProvider.defaults.useXDomain = true;
        delete $httpProvider.defaults.headers.common['X-Requested-With'];
    }])
     .factory('featuresData', function ($http) {
        return{          
            doCrossDomainGet: function(data) {
                return $http({
                    url:'http://example.com/api/login',
                     type: "POST",
        crossDomain: true,
        data: JSON.stringify({"username":"test_teacher" , "password":"123"}),
        contentType:  'application/json; charset=utf-8',
        dataType: "json",
        success: function (response) {
            console.log(response);


        },
        error: function (xhr, status) {
            alert("error");
        }
                })
            }        
        }
});

我在控制台收到此消息：

XMLHttpRequest无法加载example.com/api/login。 No＆＃39; Access-Control-Allow-Origin＆＃39;标头出现在请求的资源上。 Origin＆＃39; localhost＆＃39 ;;因此不允许访问。响应的HTTP状态代码为405。

Api在Android,Ios客户端应用和CURL

中运行良好

curl command

curl -X POST -H "Accept: Application/json" -H "Content-Type: application/json" http://example.com/api/login -d '{"username":"test_teacher","password":"123"}'

curl output

{"username":"test_teacher","roles":["ROLE_TEACHER"],"access_token":"7q8dcreo5bngk32jq8nmefrfgp6nope2"}

Answer 1

您的角度应用和后端grails api不在同一个域中。所以当你从angular到grails后端进行api调用时，它实际上是一个跨域的ajax调用。除非您已相应地配置了应用程序，否则无法进行跨域ajax调用。

请参阅cors plugin - 它将帮助您支持角色。

Answer 2

我遇到了类似的问题，经过长时间的研究后，我找到了一个适合我的简单解决方案。

删除web.config中所有与CORS相关的设置

喜欢

 <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
      </customHeaders>
    </httpProtocol>

只需在WebAPIconfig.cs中添加这两行

即可

// Web API routes

var cors = new EnableCorsAttribute（“”，“”，“*”）; config.EnableCors（CORS）;

和你的角色

的帖子请求

 Factory.postData = function (data) {
        var request = $http({
            method: "POST",
            url: urlBase+'api/url',
            data: data,
            headers: {
                "Content-Type": "application/json"
            }
        });
        return request;
    }

在angularjs post方法中获得405错误

2 个答案: