Converting a GET request to a POST request to perform a spatial query

7915
3
Jump to solution
12-14-2020 01:09 AM
IzzyMcLees
New Contributor II

Hi,

I am trying to integrate some JavaScript functionality into my Survey123 form whereby, a user will be nofified whether the polygon they've drawn, overlaps with an existing polyon.

I have managed to achieve this for polygons with straight edges, however when I draw polygons as circles or by freehand, it returns the error "404 page not found".

I believe this is because polygons with curved edges can have an incredibly lengthy geometry string which is too long for the query URL and is constrained by the GET request that I am currently using. I know a way to solve this is to change the GET request to a POST request, as this is not constraint by querystring length but I am unsure of how to do this?

My question is, how can I write a POST request to perform the same spatial query as below that will work for more complex geometry?

I have inserted my code below:

 

// Convert javaScipt object to a JSON string
var geoString = JSON.stringify(geoObject);
// return geoString;

// Change the parameters in the query URL to work with different geometryType, spatialRel, etc.
// Ref: https://developers.arcgis.com/rest/services-reference/query-feature-service-layer-.htm
var url = featurelayer_url+"/query?where=1%3D1&geometry="+geoString+"&geometryType=esriGeometryPolygon&spatialRel=esriSpatialRelOverlaps&units=esriSRUnit_Meter&returnCountOnly=true&f=json";

if (token) {
url = url+"&token="+token;
}

// return url;

// create a new XMLHttpRequest object to request data from the server. Then define the type of request
// method (GET or POST), the file location (url) and async (true (asynchronous) or false (synchronous))
// send() sends a request to the server (used for GET).
var xhttp = new XMLHttpRequest();
xhttp.open("GET", url, false);
xhttp.send();

 

 

1 Solution

Accepted Solutions
IzzyMcLees
New Contributor II

I have finally got it too work!

The reason it was not working was because I was trying to include the "/query?" part of the query string in the parameters and it should have been in the url. See code below:

// Convert javaScipt object to a JSON string
    var geoString = JSON.stringify(geoObject);
    // return geoString;

    // Change the parameters in the query URL to work with different geometryType, spatialRel, etc.
    // Ref: https://developers.arcgis.com/rest/services-reference/query-feature-service-layer-.htm
   var url = featurelayer_url + "/query?";

    if (token) {
        url = url+"&token="+token;
    }

    var params = "where=1%3D1&geometry="+geoString+"&geometryType=esriGeometryPolygon&spatialRel=esriSpatialRelOverlaps&units=esriSRUnit_Meter&returnCountOnly=true&f=json";
    
    
    // create a new XMLHttpRequest object to request data from the server. Then define the type of request
    // method (GET or POST), the file location (url) and async (true (asynchronous) or false (synchronous))
    // send() sends a request to the server (used for GET).

    var xhttp = new XMLHttpRequest();
    xhttp.open("POST", url, false);
    
    // Send the proper header information along with the request
    xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    
    xhttp.send(params);

 

View solution in original post

3 Replies
TJSimons
Esri Contributor

Hi,

You could try passing the parameters in the URL of the GET request in the body of the POST request by using the body parameter of the xhttp.send() method.

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/send

You could also use form data.

https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects

IzzyMcLees
New Contributor II

Hi @TJSimons,

Thank you very much for your response!

I have actually been trying to pass the parameters from the url in the body of the POST request for a while now, however I am struggling with the formatting. This may be due to some of the parameters being objects?

Do you know how the parameters need to be formatted for this to be successful??

Many thanks!

0 Kudos
IzzyMcLees
New Contributor II

I have finally got it too work!

The reason it was not working was because I was trying to include the "/query?" part of the query string in the parameters and it should have been in the url. See code below:

// Convert javaScipt object to a JSON string
    var geoString = JSON.stringify(geoObject);
    // return geoString;

    // Change the parameters in the query URL to work with different geometryType, spatialRel, etc.
    // Ref: https://developers.arcgis.com/rest/services-reference/query-feature-service-layer-.htm
   var url = featurelayer_url + "/query?";

    if (token) {
        url = url+"&token="+token;
    }

    var params = "where=1%3D1&geometry="+geoString+"&geometryType=esriGeometryPolygon&spatialRel=esriSpatialRelOverlaps&units=esriSRUnit_Meter&returnCountOnly=true&f=json";
    
    
    // create a new XMLHttpRequest object to request data from the server. Then define the type of request
    // method (GET or POST), the file location (url) and async (true (asynchronous) or false (synchronous))
    // send() sends a request to the server (used for GET).

    var xhttp = new XMLHttpRequest();
    xhttp.open("POST", url, false);
    
    // Send the proper header information along with the request
    xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    
    xhttp.send(params);