Consume GeoProcessing Service in JS

[YassineKha]

Currently I'm working to develop an MVC Web application and I need to consume an ARCGis GeoProcessing service using Javascript to Calculate the displacement between two surfaces (Layers).

I have made lot of search in the internet to find some samples or code examples but without result.

Could you please share with me some samples link or some codes examples to get a start

below is the Geoprocessing Definition

> Task: Surface Difference Display Name: Surface Difference
>
> Description: Geoprocessing tool that calculates the volumetric
> difference between two surfaces.
>
> Category:
>
> Help URL:
> https://URL/arcgis/rest/directories/arcgisoutput/SurfaceDifference_GPServer/SurfaceDifference/SurfaceDifference.htm
>
> Execution Type: esriExecutionTypeAsynchronous
>
> Parameters:
Parameter: in_surface Data Type: GPString Display Name
> Input Surface Description: The terrain or TIN surface whose relative
> displacement is being evaluated from the reference surface. Direction:
> esriGPParameterDirectionInput Default Value: CB_1993_RasterTin
> Parameter Type: esriGPParameterTypeRequired Category: Choice List: [
> CB_1993_RasterTin, cb2003_RasterTin ]
>
> Parameter: in_reference_surface Data Type: GPString Display Name
> Reference Surface Description: The terrain or TIN surface that will be
> used as the baseline for determining the relative displacement of the
> input surface. Direction: esriGPParameterDirectionInput Default Value:
> cb2003_RasterTin Parameter Type: esriGPParameterTypeRequired Category:
> Choice List: [ cb_1994_RasterTin, cb2011_RasterTin, pu_2003_RasterTin,
> vid2000_RasterTin, CB_1993_RasterTin, cb2003_RasterTin ]
>
> Parameter: out_feature_class Data Type: GPFeatureRecordSetLayer
> Display Name Output Feature Class Description: The output feature
> class containing contiguous triangles and triangle parts that have the
> same classification grouped into polygons. The volume enclosed by each
> region of difference is listed in the attribute table. Direction:
> esriGPParameterDirectionOutput Default Value: Geometry Type:
> esriGeometryPolygon HasZ: false HasM: false Spatial Reference: null
>
> Fields: OID ( type: esriFieldTypeOID , alias: OID ) Volume ( type:
> esriFieldTypeDouble , alias: Volume ) SArea ( type:
> esriFieldTypeDouble , alias: SArea ) Code ( type: esriFieldTypeInteger
> , alias: Code ) Shape_Length ( type: esriFieldTypeDouble , alias:
> Shape_Length ) Shape_Area ( type: esriFieldTypeDouble , alias:
> Shape_Area ) Features: None.
>
>
> Parameter Type: esriGPParameterTypeRequired Category:
>
> Parameter: pyramid_level_resolution Data Type: GPDouble Display Name
> Pyramid Level Resolution Description: The terrain pyramid-level that
> will be used to generate the input surface. The default is 0, or full
> resolution. This parameter is only used with the terrain dataset.
> Direction: esriGPParameterDirectionInput Default Value: 0 Parameter
> Type: esriGPParameterTypeOptional Category:
>
> Parameter: reference_pyramid_level_resolution Data Type: GPDouble
> Display Name Reference Surface Pyramid Level Resolution Description:
> The terrain pyramid-level that will be used to generate the reference
> surface. The default is 0, or full resolution. This parameter is only
> used with the terrain dataset. Direction:
> esriGPParameterDirectionInput Default Value: 0 Parameter Type:
> esriGPParameterTypeOptional Category:
>
> Parameter: out_raster Data Type: GPRasterDataLayer Display Name Output
> Raster Description: The output raster surface whose values represent
> the input surface normalized against the reference surface. Positive
> values reflect areas where the input surface is above the reference
> surface, whereas negative values indicate the areas where the input
> surface is below the reference surface. The raster's values are
> derived from a TIN using linear interpolation. Direction:
> esriGPParameterDirectionOutput Default Value: Parameter Type:
> esriGPParameterTypeOptional Category: Raster Options
>
> Parameter: raster_cell_size Data Type: GPDouble Display Name Raster
> Cell Size Description: The cell size of the output raster. Direction:
> esriGPParameterDirectionInput Default Value: 10 Parameter Type:
> esriGPParameterTypeOptional Category: Raster Options
>
> Parameter: out_tin_basename Data Type: GPString Display Name Output
> TIN Base Name Description: The base name given to each output TIN
> surface. If one TIN dataset is not sufficient to represent the data,
> multiple TINs will be created with the same base name. Direction:
> esriGPParameterDirectionInput Default Value: Parameter Type:
> esriGPParameterTypeOptional Category: TIN Options
>
>
>
> Supported Operations: Submit Job

Many thanks in advance

[ChristianBischof]

If you wanna use ArcGIS REST services you'll have to use the request class from the API which could look something like this:

require([
        "esri/allyourotherclasses",
        "esri/request"
    ], function (allyourotherclasses, esriRequest, ) {
    let serviceURL 'URLtoyourservice/arcgis/rest/services/MYSERVICE/gptool';
     // this is the smaple data which has to be provided in unicode in the url
     // ?f=json&locations=[{"routeId":"60","measure":"0"}]&outSR=102100
    let request = 'f=json&locations=%5B%7B%22routeId%22%3A%2260%22%2C%22measure%22%3A%220%22%7D%5D&outSR=102100';

    let myURL = serviceURL += request;
    esriRequest(myURL, { responseType: 'json} ).then((response) => {
    console.log(response.data);
    })
});

Here is a link to the unicode converter I've used:
https://www.url-encode-decode.com/

and here is the link to the ArcGIS REST API:
https://developers.arcgis.com/rest/services-reference/get-started-with-the-services-directory.htm
 

[BlakeTerhune]

You could try using the native JavaScript fetch() API.

fetch() | The Vanilla JS Toolkit

[ChristianBischof]

I have used this approach as well at some projects.