CODEWITHSUNDEEP
javascriptazurehttp-headerscors
Boris K
Boris K

Reputation: 3580

Azure Serverless Function-Enabling CORS in response headers

I've got a serverless function on Azure, written in Javascript, returning some HTML and front end JS. The JS is supposed to access a blob file hosted remotely. Right now, it's throwing me CORS errors. Even though I've added Access-Control-Allow-Origin to the headers:

headers: {
                        'Content-Type': 'text/html',
                        'Access-Control-Allow-Origin': '*'
                        'Access-Control-Allow-Origin': 'https://tif.azurewebsites.net',
                        'Access-Control-Allow-Methods': 'GET, POST, OPTIONS, PUT, PATCH, DELETE',
                        'Access-Control-Allow-Credentials':'true',
                        'Access-Control-Allow-Headers': 'X-Requested-With,content-type',
                        'Access-Control-Allow-Headers' : 'Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers' 
                      }

The Content-Type header works perfectly.

What am I doing wrong here?

Upvotes: 2

Views: 377

Answers (1)

Gaurav Mantri
Gaurav Mantri

Reputation: 136146

As discussed in the comments, since your JS code is accessing the Blob Storage you would need to configure CORS settings for Blob Storage. When configuring CORS settings, please make sure that all settings are correct. A slight mismatch in the settings would result in 403 error returned from Storage Service.

Based on your environment, here's what I would recommend:

Allowed Origins: https://tif.azurewebsites.net

Allowed Methods: Select all of the methods.

Allowed Headers: *

Exposed Headers: *

Upvotes: 3

Related Questions