How to parse this JSON in Javascript?

Question

Looking for a little guidance. I'm following this guide to build my own Google Chrome extension.

http://www.seomoz.org/blog/building-chrome-apps-and-extensions

It works great with their examples, but when I try to apply it to my own JSON data, it's not working.

Their example:

var messages = [];
var whens = [];

function checkNotifications(){
  $.getJSON('http://dl.dropbox.com/u/31988864/notifications.json',function(data){
    var new_messages = [];
    var new_whens = [];
    $.each(data, function(key, val) {
      if (messages.indexOf(val['message']) == -1){
        chrome.browserAction.setBadgeText({'text': 'New'});
        chrome.browserAction.setBadgeBackgroundColor({'color': '#f00'});
      }
      new_messages.push(val['message']);
      new_whens.push(val['when']);
    });
    messages = new_messages;
    whens = new_whens;
  });
}

checkNotifications();
// 1800000 milliseconds is 30 minutes
setInterval(checkNotifications,1800000);

The sample data notifications.json looks like:

[
    {"message": "<b>New blog post</b>: by David Sottimano - <a href='http://www.distilled.net/blog/miscellaneous/proxy-server-essential-information-for-seos/'>Proxy server essential information for SEOs</a>", "when": "6 days ago"},
    {"message": "<b>New module released</b>: Further SEO - <a href='http://www.distilled.net/u/linkbait/'>Linkbait that gets links</a>", "when": "11 days ago"},
    {"message": "<b>New blog post</b>: by Benjamin Estes - <a href='http://www.distilled.net/blog/web-analytics/segmenting-keywords-using-seotools/'>Segmenting keywords using SeoTools</a>", "when": "14 days ago"},
    {"message": "<b>New blog post</b>: by Will Critchlow - <a href='http://www.distilled.net/blog/conversion-rate-optimization/why-your-cro-tests-fail/'>Why your CRO tests fail</a>", "when": "16 days ago"} 
]

Very straight forward. It gets the data from notifications.json, and essentially does a foreach on the results looking for new a message tag. If it finds one, it sets NEW on the extension badge.

Naturally I want to change the $.getJSON('http://dl.dropbox.com/u/31988864/notifications.json', to my own RSS feed, which is done with a little help from Google to convert to JSON.

https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&q=http://feeds.feedburner.com/thegearpost

Here's a sample of the output. It's rather long, so I'm only providing a snippet.

{
  "responseData": 
  {
    "feed":
    {
      "feedUrl":"http://feeds.feedburner.com/thegearpost",
      "title":"TheGearPost",
      "link":"http://thegearpost.com",
      "author":"",
      "description":"The online gadget, gear and gift guide for men.",
      "type":"rss20",
      "entries":
      [
        {
          "title":"Man Crates",
          "link":"http://feedproxy.google.com/~r/thegearpost/~3/_WO8mJS7dUY/",
          "author":"Pat",
          "publishedDate":"Fri, 03 May 2013 12:19:10 -0700",
          "contentSnippet":"Call in your own care package with Man Crates."

I'm thinking I can replace the sample code's message with Google's contentSnippet section.

However, this doesn't work, and this is my question:

How would I make this work? I've tried val['responseData.feed.contentSnippet'], val['feed.contentSnippet'], and even just val['contentSnippet'] in the below section, but none of it is working.

$.each(data, function(key, val) {
  if (messages.indexOf(val['responseData.feed.contentSnippet']) == -1){
    chrome.browserAction.setBadgeText({'text': 'New'});
    chrome.browserAction.setBadgeBackgroundColor({'color': '#f00'});
  }
});

Ultimately I'd like to be able to change the words NEW to an actual unread count. But I think I need to get the background checks working to begin with.

score 0 · Answer 1 · answered May 05 '13 at 20:14

0

The thing you need to iterate over is responseData/feed/entries, so:

$.each(data.responseData.feed.entries, 
  function(key, entry) {
    var snippet = entry.contentSnippet;
    // whatever you need to do
  }
);

answered May 05 '13 at 20:14

Paul Roub

36,322
27
84
93

Thanks. Still not working. Would I change the if statement to `if (messages.indexOf(entry['contentSnippet']) == -1){` ? – Pat May 05 '13 at 21:03
or `(messages.indexOf(entry.contentSnippet) < 0)` – Paul Roub May 05 '13 at 21:37
Weird. With the sample data, the chrome badge would show NEW on refresh. I'm not getting anything, which leads me to believe it's still not working. – Pat May 05 '13 at 21:52
It works fine for me CodePen or the JS console (once I disabled web security in Chrome); the same code *should* work fine in an Extension. Are you seeing errors in the Javascript console when running your extension? – Paul Roub May 05 '13 at 22:11
Good point. No errors in the console. I'm not well versed in JS/JSON to be honest, so I was hoping some minor changes to the sample extension would fix it up, but seems to be not the case. – Pat May 05 '13 at 22:21
In fact, nothing in the background page is going to the log. A simple `console.log("hello world");` isn't even showing up. – Pat May 05 '13 at 23:17
@BeardFist yes I believe I am. Looks like console.log doesn't work from background pages. I'm still not getting a working extension (must not be as simple as just changing a few words around). http://stackoverflow.com/questions/3829150/google-chrome-extension-console-log-from-background-page – Pat May 06 '13 at 12:16
@Pat I assure you, console.log works just fine in background pages. – BeardFist May 06 '13 at 15:15

How to parse this JSON in Javascript?

1 Answers1