2

Attempting to tap http://www.anagramica.com/api to determine all words that can be made from an inputted word. As expected cross-origin policy does not allow using a normal GET request to receive the JSON data. On the anagramica homepage, JSONP is mentioned. I attempted implementing this below.

<!DOCTYPE html>
<html>
<head>
    <script src="jquery-3.3.1.min.js"></script>
    <title>word play</title>
</head>

<body>
    <h1>Speak A Word</h1>
    <script>
    document.body.onclick = function() {
    $.getJSON("http://www.anagramica.com/all/dog?callback=?",function(json){
    console.log(json);
});
        }   
    </script>

</body> 
</html>

This resulted in the following error.

"Cross-Origin Read Blocking (CORB) blocked cross-origin response http://www.anagramica.com/all/dog?callback=jQuery33106950206857384036_1542003732614&_=1542003732615 with MIME type application/json. See https://www.chromestatus.com/feature/5629709824032768 for more details."

Relevant posts here: Loading cross-domain endpoint with jQuery AJAX

Make cross-domain ajax JSONP request with jQuery

Wondering why JSONP is not working in this case?

  • 4
    `http://www.anagramica.com/all/dog?callback=jQuery33106950206857384036_1542003732614&_=1542003732615` doesn’t return a response that’s usable as JSONP — instead it just returns normal JSON data, with an application/json content-type (instead of the text/javascript content-type it should return if it were intended for JSONP use). – sideshowbarker Nov 14 '18 at 02:58
  • You might want to instead try proxying the response, as explained in the *How to use a CORS proxy to get around “No Access-Control-Allow-Origin header” problems* section of the answer at https://stackoverflow.com/questions/43871637/no-access-control-allow-origin-header-is-present-on-the-requested-resource-whe/43881141#43881141 – sideshowbarker Nov 14 '18 at 03:00
  • Okay, I see, that makes sense. Will go the proxy route, thanks! – Caleb Carithers Nov 14 '18 at 05:27

0 Answers0