来自本地主机的带有 Azure 函数的 CORS(不是 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

这篇关于来自本地主机的带有 Azure 函数的 CORS(不是 CLI)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！