我想从类似于 http://blog.neosavvy.com/?feed=rss2 的内容中提取博客提要用于不在同一域中的 Angular 应用程序。
我打算使用 ProxyPass,但是 ProxyPass 不能与/?feed=rss2 一起使用。是否有重写规则可以用来避免 Javascript 在获取不在同一 URL 中的内容时出现的跨域问题。
我使用 AngularJS 的服务来获取提要内容,就像使用任何其他服务一样。
这是我用来获取博客 rss 的代码:
$scope.getBlogPost = function() {
$http({method:'GET', url:'http://blog.neosavvy.com/?feed=rss2'}).
success(function (data, status, headers, config) {
console.log("data returned");
}).
error(function (data, status, headers, config) {
console.log("data not returned");
});
}
这是我收到的错误 - 因此需要代理通行证或其他替代方法。
XMLHttpRequest 无法加载 http://blog.neosavvy.com/?feed=rss2 .产地http://local.something.com Access-Control-Allow-Origin 不允许。
最佳答案
你可以使用类似 YQL 的东西或 Google Feed API
我用后者做了一个例子,你可以在这里查看:http://plnkr.co/edit/Plb1fz?p=preview
您可以使用 Google Feed API 而不是使用 $http
服务,您的 Controller 将如下所示
app.controller('ctrl', function($scope) {
var feed = new google.feeds.Feed("http://blog.neosavvy.com/?feed=rss2");
feed.load(function(result) {
$scope.$apply(function(){
$scope.entries = result.feed.entries;
})
});
});
请注意,由于范围从 Angular 外部更改,因此需要调用 $apply
来通知 Angular。
一些注意事项,首先您需要将以下脚本添加到您的文档中
- https://www.google.com/jsapi
- angular-sanitize.min.js
然后,由于必须首先加载 Google Feed API,因此有必要手动引导您的 Angular 应用
google.load("feeds", "1");
google.setOnLoadCallback(function(){
angular.bootstrap(document.body, ['app']);
});
由于提要包含 html,您将 ngSanitize 模块声明为依赖项
var app = angular.module('app', ['ngSanitize']);
要显示提要中的条目,您可以使用 ngRepeater
遍历收到的条目,当然还可以使用 ng-bind-html
指令清理 html .
<div ng-repeat='entry in entries'>
<h1>{{entry.title}}</h1>
<div ng-bind-html= "entry.content"></div>
</div>
关于javascript - 将 Wordpress 博客文章拉入 Angular JS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13782756/