My Vue.js应用程序通过Node.js后端与数据交互，可访问敏感数据和非敏感数据。我已经能够保护节点服务器上的API，即使用google身份验证API处理敏感数据(如更新定价信息(的API。这要求用户必须使用谷歌帐户登录，然后才能与这些API的帐户进行交互。
我现在正在努力保护API，因为它只检索非敏感的数据(如名称、描述、我销售的产品价格等(，这样即使是所述API也无法在没有某种形式的身份验证的情况下直接访问。ie.如果我使用Postman之类的东西直接从API检索数据，而不进行身份验证，我将无法获得任何数据。然而，这些API是从Vue.app的一部分访问的，该部分不需要登录。即，网站上的用户无需首先登录即可查看产品、价格等信息。
为了保护这些"非敏感"的API，我必须将一些"秘密"(如API密钥(从Vue前端传递到Node后端。从我写过的另外两篇文章(这里和这里(中，我相信在运行时不可能将环境变量传递到Vue应用程序中(我使用的是Vue CLI3(。这让我不得不将API密钥硬编码到前端代码中，这意味着它不再是"秘密"或安全的。
本质上，我正在尝试进行"应用程序身份验证"，但如果不能在运行时在Vue中传递ENV变量，我不知道如何安全地进行验证。
我在互联网上读到的所有内容都指向其中之一：
- 在构建时将ENV变量传递到Vue中(在这种情况下不安全(；或
- 我错过了一些东西，因为我想在运行时将ENV变量传递到Vue中
问题：我试图保护不敏感的数据，是不是想得太多或过于复杂了？
这样做的一种方法如下：
- 验证成功后生成JSON Web令牌
- 将令牌发送回客户端(Vue应用程序(并将其存储在浏览器的本地存储中
- 在API路由上，您希望安全地添加一个函数，该函数将检查请求是否包含您在步骤2中提供的令牌。您可以将令牌作为请求主体的一部分发送，也可以作为标头发送
这是确保API安全的一种简单而有效的方法。