Issue with JSON.parse() from URL

Question

I have this code trying to obtain prices from Bloomberg but I can't make it works.

This is the URL:

https://www.bloomberg.com/markets2/api/intraday/BACHOCOB:MM?days=1&interval=2&volumeInterval=15

And my failure code:

<p id="quote"></p>

<script>
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            var price= JSON.parse(this.responseText);
            document.getElementById("quote").innerHTML = price[0]["previousClosingPriceOneTradingDayAgo"];
        }
    };
    xmlhttp.open("GET", "https://www.bloomberg.com/markets2/api/intraday/BACHOCOB:MM?days=1&interval=2&volumeInterval=15&currency=MXN", true);
    xmlhttp.send();
</script>

Thanks in advance.

Possible duplicate of [Why does my JavaScript get a “No 'Access-Control-Allow-Origin' header is present on the requested resource” error when Postman does not?](https://stackoverflow.com/questions/20035101/why-does-my-javascript-get-a-no-access-control-allow-origin-header-is-present) — Lasithe, Jul 25 '18 at 05:13

score 0 · Accepted Answer · answered Jul 25 '18 at 05:08

0

What is the excat error message your getting? Is it something like "No 'Access-Control-Allow-Origin' header is present on the requested resource"?

If so, that has nothing to do with JSON.parse as it is a security measure against XSS (Cross Site Scripting). You cannot request web responses from other domains if the server doesn't allows it explicitly.

See https://en.wikipedia.org/wiki/Cross-origin_resource_sharing for more information.

As an additional note: you can work around this. Even if you have no access to the server you could make use of a proxy server, that gets the request for you and uses the appropriate response header to allow your script to make the response. An example would be "corsproxy" from npm (No experience with it. Just a quick google search).

answered Jul 25 '18 at 05:08

Thieri

203
1
10

Hi There; In fact i didn't receive nothing as a response, just a blank web page. – Daniel Jul 25 '18 at 05:17
Yeah i pasted your code in a fiddle: https://jsfiddle.net/v856fws9/ and the cross-origin problem popped up. You can see it in the developer console in your browser. Something like Dev-Tools->jS-Console. Depending on your specific browser. For beginners CORS/Cross-Origin is not an easy problem. Try reading about it. – Thieri Jul 25 '18 at 05:19
If this answer helped you and answered your question please consider to upvote it and mark it as the accepted answer. thank you – Thieri Jul 25 '18 at 05:52

score 0 · Answer 2 · answered Jul 25 '18 at 05:16

You can get value as below by adding jQuery to your project

$.ajax({
    type: "GET",
    url: "https://www.bloomberg.com/markets2/api/intraday/BACHOCOB:MM?days=1&interval=2&volumeInterval=15",
    dataType: "json",
    success: function(getPrice) {
        $('#quote').append(getPrice[0].previousClosingPriceOneTradingDayAgo);
    }
});

score 0 · Answer 3 · answered Jul 25 '18 at 05:26

It seems CORS is an issue. Since you are using GET request to an SSL URL, it expects you to send this request from an HTTPS origin. To test your script, use Chrome Browser with CORS extension installed. You shall see the result.

In short, you need an HTTPS origin URL, you might want to try CURL with PHP for a possible solution if SSL is an issue !

Issue with JSON.parse() from URL

3 Answers3