Why is esriRequest not working?

2130
10
Jump to solution
05-23-2019 05:26 AM
JustinBridwell2
Occasional Contributor II

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;      
});
0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Esteemed Contributor

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

View solution in original post

0 Kudos
10 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

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
Occasional Contributor II

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.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

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
MVP Esteemed Contributor

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

0 Kudos
JustinBridwell2
Occasional Contributor II

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? 

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Justin,

  Sure. Just add:

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

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? 

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Justin,

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

JustinBridwell2
Occasional Contributor II

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. 

0 Kudos