从 generate.cshtml 页面源代码中隐藏 API 令牌

Question

我有一个.cshtml页面，单击按钮会调用 API

目前，我的 JS 代码如下所示：

var headers = {};
headers["Authorization-Token"] = '@Model.ApiToken';

$.ajax({
    url: "my-url",
    type: "GET",
    headers: headers
});

但是，如果最终用户打开浏览器控制台，转到 Network 选项卡，搜索生成的cshtml ，他可以看到：

令牌可以以明文形式看到（在上图中裁剪以供展示）
没有这个 header，我不能打电话给我的 API，因为如果 header 不存在，电话会立即被拒绝

有没有办法将它隐藏给最终用户，如果有，怎么做？
谢谢

Answer 1

最好将令牌保留在浏览器之外，一种选择是将令牌存储在 cookie 中（当然是加密的）。 ASP.NET Core 可以自动为您处理。 或者在后端作为用户 session 的一部分。

一个可能更好的选择是考虑使用 Backend For Frontend（又名 BFF）模式来保护 SPA 应用程序。

看