简体   繁体   English

从浏览器访问 Azure Key Vault 的秘密(node.js 和 Vue.js)

[英]Access secret from Azure Key Vault from browser (node.js with Vue.js)

I have a Vue single-page application (not deployed as of yet), that calls an Azure function to get some data.我有一个 Vue 单页应用程序(尚未部署),它调用 Azure function 来获取一些数据。 The Azure function is has admin level security, and so I need the master key to call it. Azure function 具有管理员级别的安全性,因此我需要主密钥才能调用它。

Because I don't want the master key hardcoded into my JavaScript, I put it into an Azure Key Vault as a secret.因为我不想将主密钥硬编码到我的 JavaScript 中,所以我将它作为秘密放入 Azure Key Vault 中。 Now, I'm having trouble accessing it, so that I can run my Azure function.现在,我无法访问它,所以我可以运行我的 Azure function。

Every tutorial I've found online doesn't help.我在网上找到的每个教程都没有帮助。 I even found an npm module ( https://www.npmjs.com/package/@azure/keyvault-secrets ) that allows one to access secrets from the key vault - however using this module in the browser (where my code will run) is deemed unsafe.我什至发现了一个 npm 模块 ( https://www.npmjs.com/package/@azure/keyvault-secrets ),它允许人们从密钥库访问秘密——但是在浏览器中使用这个模块(我的代码将在其中运行) ) 被认为是不安全的。

If it's relevant, I'd like to be able to access the key vault from my website locally when testing it, but also when I deploy it (I don't know where at the moment, but I'll most likely deploy my website on Azure).如果它是相关的,我希望能够在测试时从我的网站在本地访问密钥保管库,但在我部署它时也能访问它(我现在不知道在哪里,但我很可能会部署我的网站在 Azure 上)。 Also, I'd prefer not having to write server-side code, as I'm writing an SPA另外,我宁愿不必编写服务器端代码,因为我正在编写 SPA

So... how can I access a secret in my key vault from a vue website (aka JavaScript that's run in the browser)?那么...我如何从 vue 网站(又名 JavaScript 在浏览器中运行)访问我的密钥保管库中的秘密?

//Edited after comments //评论后编辑

If you dont have server-side code, you basically cannot fetch from KeyVault.如果您没有服务器端代码,您基本上无法从 KeyVault 中获取。 As such it would be easier to just use Azure AD to authorize against your Function directly and circumvent KeyVault.因此,直接使用Azure AD 直接授权您的 Function并绕过 KeyVault 会更容易。

The main blocker to what you are trying to achieve is lack of CORS support at the service level.您要实现的目标的主要障碍是在服务级别缺乏CORS支持。 Because Azure Key Vault does not provide CORS configuration your requests to Key Vault will fail when run in the browser.因为 Azure Key Vault 不提供 CORS 配置,所以在浏览器中运行时,您对 Key Vault 的请求将失败。

But you do have a few options:但是你有几个选择:

  1. A server-side component which can act as an intermediary and allows you to configure CORS policies for your application.一个服务器端组件,可以充当中介并允许您为您的应用程序配置 CORS 策略。 Because CORS is a browser restriction, a server-side application will be able to communicate with Azure Key Vault without configuring CORS.因为 CORS 是浏览器限制,服务器端应用程序将能够与 Azure Key Vault 通信,而无需配置 CORS。
  2. You can use Azure API Management to act as a bridge between your client-side application and Azure Key Vault.您可以使用Azure API Management作为客户端应用程序和 Azure Key Vault 之间的桥梁。 Because Azure API Management supports CORS it will be able to communicate with Azure Key Vault.因为 Azure API 管理支持 CORS 它将能够与 Azure Key Vault 通信。

You might be interested in this documentation and sample I created demonstrating the two approaches.您可能对我创建的演示这两种方法的文档和示例感兴趣。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 Azure 从密钥库中检索机密 - Azure Retrieve Secret from key vault 无法从 firebase 上托管的 vue.js 项目调用 api 到存储在第三方服务器中的后端 node.js - unable to make api call from vue.js project hosted on firebase to node.js backend stored in third party server 从 Azure 调用 Azure SQL 函数 node.js - Calling Azure SQL from Azure Functions node.js 从 azure blob 存储(静态网站)访问 azure 密钥库 - Access azure key vault from azure blob storage (static website) 当键不是 Node.js 和 typescript 的分区或排序键时,如何从 dynamo db 过滤数据? - How to filter the data from dynamo db when the key is not a partition or Sort key with Node.js and typescript? Node.js 从 Cognito 中删除用户 - Node.js delete user from cognito 显示数据 来自 Firebase RTDB 使用 Vue.js - Display data From Firebase RTDB using Vue.js 如何从 node.js package.json 文件克隆 Azure Dev Ops 存储库? - How to clone a Azure Dev Ops repo from node.js package.json file? Azure Iot Hub Direct Method Call from front end Node.js Website - Azure Iot Hub Direct Method Call from front end Node.js Website 将 Node.js Azure Function 从 Function Extensions 2.x 迁移到 3.x 时出现问题 - Problems migrating Node.js Azure Function from Function Extensions 2.x to 3.x
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM