来自 localhost(不是 CLI)的带有 Azure 功能的 CORS [英] CORS with Azure function from localhost (not CLI)

问题描述

我们在 vue.js 应用程序中使用 axios 来访问 Azure 函数.现在我们遇到了这个错误:

We are using axios in a vue.js app to access an Azure function. Right now we are getting this error:

No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://localhost:8080' is therefore not allowed access.

我们正在尝试以这种方式在函数中设置响应标头:

We are trying to set response headers in the function this way:

context.res = {
  body: response.data,
  headers: {   
    'Access-Control-Allow-Credentials': 'true',
    'Access-Control-Allow-Origin': 'http://localhost:8080',
    'Access-Control-Allow-Methods': 'GET',
    'Access-Control-Request-Headers': 'X-Custom-Header'
  }
}

有人遇到过这个错误吗?

Has anyone run across this error?

推荐答案

当您不使用 CLI 而使用 Visual Studio/VS Code 时，要设置 CORS 在本地工作 - 您需要将 local.settings.json 文件添加到您的项目，如果它不存在.

To set CORS working locally when you are not using CLI and you are using Visual Studio/ VS Code - you need to add local.settings.json file into your project if it's not there.

确保直接复制到输出"设置为如果较新则复制"

Make sure "Copy to output directly" set to "copy if newer"

然后在您的local.settings.json"中，您可以像这样添加 CORS": "*":

Then in your "local.settings.json" you can add CORS": "*" like so:

{
  "IsEncrypted": false,
  "Values": {

  },
  "Host": {
    "LocalHttpPort": 7071,
    "CORS": "*"
  }
}

更多信息:https://docs.microsoft.com/en-us/azure/azure-functions/functions-run-local

这篇关于来自 localhost(不是 CLI)的带有 Azure 功能的 CORS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！