在角度js中以第三方网站发布时跨域问题

时间:2015-10-01 05:19:17

标签: javascript jquery angularjs http http-headers

    HTML Code:                                                                       

    <div  ng-app="myApp" ng-controller="myController">
    <div>
       <input type="button" data-ng-click="submit()"                                                                   value="Continue"></input>
      </div>
    </div>

点击继续按钮后发布第三方网站而不更改URL。在IE浏览器中它工作正常,但其他浏览器无效,我面临以下问题..

Angular Code:   
 var myAppex = angular.module("myApp", []);
 myAppex.controller('myController', ['$scope','$window', '$http','$location',
                   function($scope, $window, $http,$location) {

                $scope.submit = function() {                                   
              var headersSend = {
                                                                                                                 'Access-Control-Allow-Origin': '*',                                                           'Access-Control-Allow-Credentials': 'true',                                                     'Access-Control-Allow-Headers': 'X-Custom-Header,x-requested-with, Content-Type, origin, authorization, accept, client-security-token,Overwrite, Destination, User-Agent, Translate, Range, Content-Range, Timeout, X-File-Size, X-Requested-With, If-Modified-Since, X-File-Name, Cache-Control, Location, Lock-Token, If',                               'Access-Control-Allow-Methods' : 'POST, GET, OPTIONS, PUT',                                                   'Content-Type': 'application/json;charset=utf-8',                                                            'Accept': 'application/json',                                                                };                                                                              $http({method: 'POST',                                                               url:respData.thirdpartyurl,  //ex: https://en.wikipedia.org/wiki/W3Schools                       crossDomain: true, processData: true,                                                                 dataType: 'jsonp',                                                                headers : headersSend,                                                              data: respData.somedata                                                           }).success(function(data,status, headers, config) {                                            $('body').html(data);                                                                         headers  = headersSend;                                                           }).error(function(data, status, headers, config) {                      if(status == 400) {                                                $scope.messages = data; } else {                                         alert('Unexpected server error.');                                   }
                                                                      });
                                                                  };

                                }]);

浏览器控制台中的ISSUE

XMLHttpRequest无法加载https://en.wikipedia.org/wiki/W3Schools。 No&#39; Access-Control-Allow-Origin&#39;标头出现在请求的资源上。起源&#39; http://localhost:8081&#39;因此不允许访问。响应的HTTP状态代码为501 ..

任何帮助非常感谢。提前致谢

1 个答案:

答案 0 :(得分:1)

使用corsproxy npm install corsproxy

然后做一个corsproxy。它将从1337/9292开始。根据它的起点,(比方说9292)附加你的外部网址,即你的情况“https://en.wikipedia.org/wiki/W3Schools”附加http://localhost:9292/en.wikipedia.org/wiki/W3Schools,它会正常工作。< / p>