Why is esriRequest not working?

[JustinBridwell2]

I am trying to use esri/request to pull in some data from an API. I am have two weird problems. First, when I try to run this, it doesn't complete and throws the following error in the browser console: "Uncaught TypeError: Cannot read property 'trim' of undefined". I am not using trim()anywhere and am not sure why this error is being thrown (specifically on the line where I make my esriRequest). Second, if I try to test this in the browser by pasting in the function to the console, it says that esriRequest is not defined. I have checked the order of my required list and functions several times and they look like they are in the proper order. Am I missing something here?

require([    
"esri/map",    
"esri/basemaps",    
"esri/dijit/BasemapToggle",    
"esri/layers/ArcGISDynamicMapServiceLayer",    
"esri/tasks/ImageServiceIdentifyTask",    
"esri/tasks/ImageServiceIdentifyParameters",    
"esri/layers/WebTiledLayer",    
"esri/dijit/Search",    
"esri/config",    
"esri/request",    
"dojo/json",    
"dojo/promise/all",      
"dojo/domReady!"], function(        
Map,          
esriBasemaps,          
BasemapToggle,          
ArcGISDynamicMapServiceLayer,          
ImageServiceIdentifyTask,          
ImageServiceIdentifyParameters,          
WebTiledLayer,          
Search,          
esriConfig,          
esriRequest,          
JSON,          
all) {         
.....       
var url = "https://earthquake.usgs.gov/ws/designmaps/asce7-16.json?latitude=18&longitude=-66&riskCategory=I&siteClass=D&title=Default";      
esriRequest(url, {        
    responseType: "json"      
 }).then(function(response){         
// The requested data        
    var seis_data = response.data;      
});

[RobertScheitlin__GISP]

Justin,

   You seem to be mixed 4.x and 3.x code... Which are you using? Your tag says 4.1 but you have a require for "esri/map" which is 3.x in 4.x it is "esri/Map", also there is no "esri/basemaps" in 4.x, etc, etc.

[JustinBridwell2]

Sorry, I am refactoring some of this code from another application. I believe it is 3x not 4.1. Could this be part of the problem? The map displays properly when I remove the esriRequest call at the bottom, but I am wondering if some of the other libraries/modules I am using are causing the issue. I tried moving esri/request and esriRequest to the top, but it didn't seem to make a difference.

[RobertScheitlin__GISP]

Justin,

  Yes the issue is the esriRequest. The code format you are using is for 4.x and will not work in 3.x.

in 3.x it looks like this:

var layersRequest = esriRequest({
    url: "https://earthquake.usgs.gov/ws/designmaps/asce7-16.json",
    content: { "latitude": 18, "longitude": -66, "riskCategory": "I", "siteClass": "D", title="Default"},
    handleAs: "json",
    callbackParamName: "callback"
  });
  layersRequest.then(
    function(response) {
      var seis_data = response.response.data;
      console.log("Success: ", response.response.data);
  }, function(error) {
      console.log("Error: ", error.message);
  });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[RobertScheitlin__GISP · Accepted solution]

Don't forget to mark this question as answered by clicking on the "Mark Correct" link on the reply that answered your question.

[JustinBridwell2]

OK, that seemed to resolve the initial issue! Thanks so much Robert. Follow up question though; I am now getting the old "Cross-Origin Read Blocking (CORB) blocked cross-origin response ...<url> ... with MIME type application/json" error. From looking at a few related post, it seems this is cause by the server sending back a jsonp response or something? Is there an easy way to resolve this inside the code? 

[RobertScheitlin__GISP]

Justin,

  Sure. Just add:

require([
...
        "esri/config",
...
      ],
      function(
...
        esriConfig,
...
      ) {
...
// Use CORS
        esriConfig.defaults.io.corsEnabledServers.push("earthquake.usgs.gov"); // supports CORS‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[JustinBridwell2]

Ugh, OK, it is actually not working. I resolved the CORS issue but now I am seeing that `layerRequest` is not defined! Assuming I am going to continue with 3.x, is there something I need to change in my require calls and corresponding functions? 

[RobertScheitlin__GISP]

Justin,

   So it sounds like when you added "esri/config" you got your requires and subsequent parameters out of order.

[JustinBridwell2]

OK, fixed it (I think). When I launched it this time, I got `Success:  {pgauh: 0.383, pgad: 1798.2, pga: 0.383, fpga: 1.217, pgam: 0.466, …}` showing in the console. So I get an Object. But if I try typing `console.log(layersRequest)' in the console, it's still saying its not defined. I don't get it! What I want to do now is pull out the value for s1 from the object into a variable that I will later display in the dom in a table. I thought I could test this out in my console first; not sure what's wrong.