Open Layers 3 WMS Authentication

I have a GeoServer and I only want to serve layers via WMS to a user who has a user account. This is fine to configure on the GeoServer side as you can enable Basic Authentication and then pass the credentials as part of the URL.

This works great in Firefox, unfortunately this ability has been removed for many browsers now as Basic Authentication is deprecated in URLs.

So, set the url with

https://MY_USER_NAME:MY_PASSWORD@www.BLAH.com

      

        
        
        
      

    

Does not work any more.

So, I'm leaving my head scratching as to how to provide client side credentials when doing an OL3 WMS query. Apparently there is no documentation.

Usually my WMS calls look like this:

WMS_layer = new ol.layer.Tile({
      preload: Infinity,
      visible: true,
      opacity:0.7,
      extent: ol.proj.transformExtent([-1.194, 51.880, -1.111, 51.930], "EPSG:4326", "EPSG:3857"),
      source: new ol.source.TileWMS(({
        url: 'https://www.my-geoserver.co.uk/geoserver/' + workspace + '/wms',
        params: {'LAYERS': workspace + ':' + layer_name, 'TILED': true, 'VERSION': '1.3.0'},
        projection: projection,
        serverType: 'geoserver',
        FORMAT: 'image/jpeg'
        }))
});

      

        
        
        
      

    

So, since I can no longer add the username and password to the url, how can I get authenticated. I can use authentication headers as one of the solutions, but how can I send the authentication header via a WMS call to OL3?

I've heard people tend to use server side proxies to handle XHR request, I don't know where to start with that!