0
我正在嘗試做一個基於lifehacker（http://lifehacker.com/5857721/how-to-build-a-chrome-extension）的例子的RSS閱讀器鉻擴展。我基於這個做了我自己的事。它沒有工作。我嘗試了他們的源代碼，並且它工作得很好（對於lifehacker），但是當我將xml源代碼更改爲http://www.engadget.com/rss.xml時，它只顯示了一個空方塊。如果任何人都可以指出任何錯誤或錯誤，我會非常感謝。我的文件是：http://www.engadget.com/rss.xml沒有響應我的XMLHttpRequest。在控制檯沒有錯誤代碼
的manifest.json
{
"name": "RSS Fetcher",
"version": "0.1",
"description": "engadget rss reader.",
"homepage_url": "http://www.engadget.com/",
"background_page": "background.html",
"permissions": [
"<all_urls>",
"http://www.engadget.com/*"
],
"browser_action": {
"default_title": "engadget reader",
"default_popup": "popup.html"
}
}
background.html
<html>
<head>
<script src='scripts/jquery-1.6.1.min.js'></script>
<script src="scripts/parse.js"></script>
<script>
function fetch_feed(url, callback) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(data) {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
var data = xhr.responseText;
callback(data);
} else {
callback(null);
}
}
}
// Note that any URL fetched here must be matched by a permission in
// the manifest.json file!
xhr.open('GET', url, true);
xhr.send();
}
function onRequest(request, sender, callback) {
if (request.action == 'fetch_feed') {
fetch_feed(request.url, callback);
}
}
// Wire up the listener.
chrome.extension.onRequest.addListener(onRequest);
</script>
</head>
<body>
</body>
</html>
popup.html
<html>
<head>
<script src='scripts/jquery-1.6.1.min.js'></script>
<script src="scripts/parse.js"></script>
<script>
function fetch_feed() {
chrome.extension.sendRequest({'action' : 'fetch_feed', 'url' : 'http://www.engadget.com/rss.xml'},
function(response) {
display_stories(response);
}
);
}
function display_stories(feed_data) {
var xml_doc = $.parseXML(feed_data);
$xml = $(xml_doc);
var items = $xml.find("item");
$('#popup').html('<img src="images/logo.png" id="logo" onclick="open_item(\'http://engadget.com/\'); window.close();" /><br clear="all" />');
items.each(function(index, element) {
var post = parse_post(element);
var item = '';
var class2 = '';
if (index >= localStorage['unread_count']) {
// // console.log('visited');
item += '<div class="post read">';
}
else {
item += '<div class="post">'
}
item += '<span class="tag">' + post.tag + '</span>\
<a href="' + post.url + '">\
<div id="' + post.id + '" class="item" onclick="open_item(\'' + post.url + '\');">\
<img src="' + post.img + '" width="107" height="60" />\
<h4>' + post.title + '</h4>\
<span class="description">' + post.description + '...</span>\
</div>\
</a>';
item += '</div>';
$('#popup').append(item);
});
}
</script>
<link rel="stylesheet" href="styles/post.css" type="text/css" />
</head>
<body>
<div id="popup">
</div>
<script>
$(document).ready(function() {
fetch_feed();
});
</script>
</body>
</html>
parse.js
function parse_post(element) {
// console.log(element);
var post = new Object();
post.title = $(element).find("title").text();
post.tag = post.title.split('[')[1].split(']')[0];
post.title = post.title.split('[')[0];
post.id = $(element).find("guid").text();
post.url = $(element).find('link').text();
post.description = $("<div/>").html($(element).find("description")).text();
post.img = $('img', post.description)[0].src; //107x60px
var shorten = 120;
if (post.title.length > 80) {
shorten = 70;
}
post.description = $.trim($(post.description).text());
post.description = post.description.substr(0, shorten);
// console.log(post);
return post;
}
function open_item(url) {
chrome.tabs.create({url: url});
chrome.browserAction.setBadgeText({text:''});
}
我還使用jQuery的1.6.1.min.js 任何幫助:)提前感謝！