What's the difference? Why can't JavaScript work with both responses?

Question

I am working on a RSS-reader using as much Javascript as possible. Because of the same-origin-policy I have to request the XML files of the feeds with another solution. First I used the Yahoo! Query Language (YQL) but to be independent I tried to write some PHP code. Although the responses of both solutions are almost the same (with YQL there is some Yahoo data) my solution using PHP does not work.

The YQL solution

function yahoo() {
// request the xml
$.get("https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%3D'http%3A%2F%2Fnews.yahoo.com%2Frss%2Ftopstories'&diagnostics=false", function (data) {
// save the data (title, content, link, date) to the localStorage
    $(data).find("item").each(function () {
        el = $(this);
        if (!el.find("title").text() || !el.find("description").text() || !el.find("link").text() || !el.find("pubDate").text()) {
            console.log("errorEntry");
        } else {
            localStorage.setItem('titleEntry' , el.find("title").text());
            localStorage.setItem('contentEntry' , el.find("description").text());
            localStorage.setItem('linkEntry' , el.find("link").text());
            localStorage.setItem('dateEntry' , el.find("pubDate").text());
    }
    });
});
}

My solution JavaScript:

function php() {
// request the xml
$.get("rss_request.php?feedUrl=http://news.yahoo.com/rss/topstories", function (data) {
// save the data (title, content, link, date) to the localStorage
    $(data).find("item").each(function () {
        el = $(this);
        if (!el.find("title").text() || !el.find("description").text() || !el.find("link").text() || !el.find("pubDate").text()) {
            console.log("errorEntry");
        } else {
            localStorage.setItem('titleEntry' , el.find("title").text());
            localStorage.setItem('contentEntry' , el.find("description").text());
            localStorage.setItem('linkEntry' , el.find("link").text());
            localStorage.setItem('dateEntry' , el.find("pubDate").text());
            localStorage.setItem('typeEntry' , "rss");
    }
    });
});
}

PHP (rss_request.php):

<?php
    $url = $_GET["feedUrl"];
    $response = file_get_contents ($url);
    echo $response;
?>

The `feedUrl` = `http://news.yahoo.com/rss/topstories`? That's working for me. Trying putting it directly into the `file_get_contents`. As test, not as GET, just to test. — chris85, Apr 04 '15 at 00:25
@chris85 Yes that works but JavaScript/jQuery cannot find anything — Tobias Scheithauer, Apr 04 '15 at 00:39
Oh, sorry I thought this a PHP issue, `my PHP solution does not work.`, this seems to be a javascript issue. I'm not to sure about that, maybe this thread will help you though? http://stackoverflow.com/questions/3300332/jquery-find-on-data-from-ajax-call-is-returning-object-object-instead — chris85, Apr 04 '15 at 00:49
Not quite sure what you're expecting here, YQL will wrap the RSS in it's XML result, while getting it with PHP gets the RSS raw. Did you try `console.log(data)` inside the $.get function to see what you get — adeneo, Apr 04 '15 at 01:01
Thank you so much @adeneo. I added `header('Content-type: text/xml');` before `echo $response;` in the PHP script. Now it responses as an XML and everything works :-) — Tobias Scheithauer, Apr 04 '15 at 08:46

score 1 · Accepted Answer · answered Apr 04 '15 at 06:32

What's the difference? Why can't JavaScript work with both responses?

Let's apply some simple logic here which is useful when you look for causes.

You ask about differences. You give two code examples. The difference in those two code examples is:

A: $.get("https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%3D'http%3A%2F%2Fnews.yahoo.com%2Frss%2Ftopstories'&diagnostics=false", function (data) {

B: $.get("rss_request.php?feedUrl=http://news.yahoo.com/rss/topstories", function (data) {

So what is different here? The URL is different!

Now your question is two-folded, so finding the difference was only one part, let's recap the second part:

Why can't JavaScript work with both responses?

Implicitly this names the difference, so the reason is because those two URLs give different data. As the different data has not been presented, there is not much more that can be written to answer your question.

I hope the answer is useful to you and it helps you to continue your work. You can for example now look into the concrete data and find out that even so you expected the data to be the same, by directly comparing it, learn about the differences.

The URL seems not the problem but the datatypes were different. As @adeneo mentioned the YQL responses with some XML my PHP script responses with raw text. I added header('Content-type: text/xml'); before echo $response; in the PHP script. Now it responses XML too and everything works. Thanks for your hint :-) — Tobias Scheithauer, Apr 04 '15 at 08:52
If that is jQuery you can also specify how a response has to be parsed. Otherwise - like you experienced it - the parsing is bound on the content-type header of the response. Exactly. The difference in URLs as a resource locator often is a string sign that the resource itself is different, too. — hakre, Apr 04 '15 at 11:33

What's the difference? Why can't JavaScript work with both responses?

1 Answers1