Openlayers 4 - Load WMS image layer require authentication

Question

I try to load WMS image layer with openlayers 4.6 and angular 5, the code is:

const syr_layer = new ol_layer_Image({
  source: new ol_source_ImageWMS({
      url         


        

Answer 1

For you purpose, you may want to use tileLoadFunction (API doc) from ol.source.ImageWMS

To illustrate, you can look below. The 2 "secrets" are customLoader and for authentication to uncomment req.setRequestHeader("Authorization", "Basic " + window.btoa(user + ":" + pass));

The answer is mainly borrowed from How to add a http header to openlayers3 requests? but with some adaptations as the syntax provided was not working.