无法将jsonp请求的内容放在视图

时间:2015-05-13 02:38:24

标签: javascript angularjs wordpress http jsonp

我正在向WordPress帐户发出$http.jsonp个请求,我的状态为304,看起来像这样

posts?callback=angular.callbacks._0 GET 304

这是我在浏览器的网络部分看到的内容

Response Headers: 

Link:

</wp-json/posts?callback=angular.callbacks._0&page=2>; rel="next", <http://urbanetradio.com/wp-json/posts/4192>; rel="item"; title="El regreso de Nicolas Jaar", <http://urbanetradio.com/wp-json/posts/4181>; rel="item"; title="Nocturnal complet%C3%B3 su line up y va m%C3%A1s all%C3%A1 de la electr%C3%B3nica", <http://urbanetradio.com/wp-json/posts/4164>; rel="item"; title="24 Horas Non-Stop con Marco Carola", <http://urbanetradio.com/wp-json/posts/4113>; rel="item"; title="Richie Hawtin recibe doctorado de honor en Universidad Britanica", <http://urbanetradio.com/wp-json/posts/4106>; rel="item"; title="%E2%80%9CMi casa es su casa%E2%80%9D el festival del house en San Jos%C3%A9", <http://urbanetradio.com/wp-json/posts/4096>; rel="item"; title="Urbanet Radio lanza su primer Showcase en el Hoxton Pub", <http://urbanetradio.com/wp-json/posts/4091>; rel="item"; title="Frankfurt, sede del Museo de M%C3%BAsica Electr%C3%B3nica Moderna", <http://urbanetradio.com/wp-json/posts/4084>; rel="item"; title="Caricaco y la m%C3%BAsica costarricense vibraron en Guanacaste", <http://urbanetradio.com/wp-json/posts/4037>; rel="item"; title="Un vistazo al Abbey Road Studios", <http://urbanetradio.com/wp-json/posts/4075>; rel="item"; title="Mira el trailer de la pelicula "El principito"", <http://urbanetradio.com/wp-json/posts/4072>; rel="item"; title="Mira el primer episodio de la caricatura de Major Lazer", <http://urbanetradio.com/wp-json/posts/4052>; rel="item"; title="El arte del blunt para celebrar el 420"

这是我需要的确切对象,请参阅服务和控制器中的请求

.service('FreshlyPressed', function($http, $q) {
  return {

    getBlogs: function($scope) {
      var posts = [];
      $http.jsonp('http://urbanetradio.com/wp-json/posts?callback=JSON_CALLBACK')
        .success(function(result) {
          console.log(result);
          $scope.posts = result;
        })
    }
});

.controller('NewsCtrl', function($scope, FreshlyPressed) {

  $scope.doRefresh = function() {
    $scope.posts = FreshlyPressed.getBlogs($scope);
    $scope.$broadcast('scroll.refreshComplete');
  };
  $scope.doRefresh();
});

和html

<div ng-repeat="post in posts">
  <a ng-href="#/tabs/news/{{post.ID}}">
    <h2 ng-bind-html="post.title"></h2>
    <p>{{:: post.date | date}}</p>
  </a>
</div>

我正在用jsonp这样做,因为Access-Allow-Control-Origin

Here is a Plunker以防你想看一看。

问题在于,如果您使用简单的$http.get,您可以在视图中看到呈现的帖子,但只能在浏览器中的本地环境中看到,但是一旦您尝试在移动设备中运行该应用,然后出现这个错误

  

XMLHttpRequest无法加载http://urbanetradio.com/wp-json/posts。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此,不允许原点“http://localhost:8100”访问。

添加$http.jsonp会使请求变得清晰,错误不再存在,但您无法在DOM中看到数据。

修改

现在,根据我的问题,我只是在插件的Changelog视图中看到了一个文本

Add handling for Cross-Origin Resource Sharing (CORS) OPTIONS requests. Preflighted requests (using the OPTIONS method) include the headers Access-Control-Allow-Origin, Access-Control-Allow-Methods, and Access-Control-Allow-Credentials in the response, if the HTTP origin is set.

以防万一,this is the plugin I am using, WP REST API

这是什么意思?

0 个答案:

没有答案