Add extra headers to Javascript?

[LarsFagerbakke]

Is it possible to add extra headers to the JavaScript client? We having a client with their ArcGIS server located in their DMZ where they could open it up if I could add extra headers to the http requests that goes from the JavaScript application (running in Azure).

[ReneRubalcava]

Take a look at the RequestInterceptor in 4x. It should allow you do this on a URL basis.

[LarsFagerbakke]

As I understand the documentation you could use RequestInterceptor for esriRequest, but how do I tie this to TileLayer?

var sampleLayer = new TileLayer({
url: "https://tiles.arcgis.com/tiles/nGt4QxSblgDfeJn9/arcgis/rest/services/New_York_Housing_Density/MapSer..."
});

var map = new Map({
basemap: "streets",
layers: [sampleLayer]
});

var view = new MapView({
container: "viewDiv",
map: map,
zoom: 4,
center: [15, 65] // longitude, latitude
});

If sampleLayer were on a server requiring extra headers, for instance a set "apitoken", is that possible?

[ReneRubalcava]

it works on all requests made internally in the API. You specify which URL requests you want to intercept and then you can add the extra headers.

Something like adding headers might look like this.

var host = "https://domain-for-tiles.com";
var url = "domain-for-tiles.com/the-tile-url";
var access_token = "I&AM&A&TOKEN&&&&&"

esriConfig.request.interceptors.push({
  urls: host,
  before: function(params) {
    if (params.url.includes(url)) {
      params.requestOptions.headers = params.requestOptions.headers || {};
      params.requestOptions.headers.ACCESS_TOKEN = access_token;
    }
  }
});‍‍‍‍‍‍‍‍‍‍‍‍‍

I haven't added headers, but I've added access tokens via query params. You can add anything that is part of request options.