Cross-Origin Resource Sharing error: MultipleAllowOriginValues

Hello everybody,

I am currently working in the development of an Angular web application which uses OSM to display a map with different layers. Until yesterday everything worked fine having the base layer created as:

    new Tile({
      source: new OSM({
        crossOrigin: 'anonymous',
        url: 'https://{a-c}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png',
     }),
      /* @ts-expect-error */
      type: 'base',
      title: $localize`Open Street Map`,
    }),

Yesterday I started receiving a CORS error when rendering the map with the error being MultipleAllowOriginValues. I am not an expert when it comes to CORS errors and but after analyzing the response and researching for a bit, I realized that in the response headers I was receiving 2 {Access Control Allow Origin: *} headers as shown in the following picture:

However when accessing the url directly from the explorer, even receiving the same headers Response Header, the CORS error is not shown and the image is rendered properly.

Could anybody tell me if this is an error from the OSM server side which needs to be fixed or if I can do something on my end to make it work?

Thank you!

1 post - 1 participant

Read full topic


Ce sujet de discussion accompagne la publication sur https://community.openstreetmap.org/t/cross-origin-resource-sharing-error-multiplealloworiginvalues/106999