Azure Function Configuration

When calling Azure function from a web app the following error occurs:

SEC7120: Origin http://localhost:56960 not found in Access-Control-Allow-Origin header.

JavaScript code used in browser to call the Azure function:

var myHeaders = new Headers();
var init = {
method: 'GET',
headers: myHeaders,
mode: 'cors',
cache: 'default'
};

var div = document.getElementById("result");
fetch('https://azurefunctionappfun.azurewebsites.net/api/PersonFunction?code=XXXXXXXXXXXXX&personId=7', init)
.then(function (response) {
if (response.ok) {
return response.json();
}
throw new Error('Network response was not ok.');
}).then(function (json) {
div.textContent = JSON.stringify(json);
}).catch(function (error) {
div.textContent = 'There has been a problem with your fetch operation: ' + error.message;
});

There is a security measure put in place stopping just anybody from calling the function, which is a good idea, but can hinder your testing. To change this for your localhost browser testing the following can be done:

What you are doing is allowing any and all (*) origins to be able to call the function.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s