如何从 JS 获取和保存令牌中获取 ASP.NET Web Api 令牌（登录）

Question

我正在构建一个 React 客户端来与我的 Asp.Net WebAPI (.NET Framework) 进行交互。 我可以成功注册，并将数据发布到数据库（如果我对令牌进行硬编码）。

当通过邮递员“登录”时，它是带有“grant_type、用户名、密码”的 http://localhost:44331/token。 如何在 JS 中编写 fetch 以登录并获取令牌并将令牌保存在我的 React 应用程序中。

这是我目前的获取：

 const handleSubmit = (event) => { event.preventDefault(); fetch("https://localhost:44331/token", { method: "POST", mode: "no-cors", body: JSON.stringify({ grant_type: grant_type, username: username, password: password, }), headers: new Headers({ "Content-Type": "application/json", }), }) .then((response) => response.json()) .then((data) => { console.log(data); }) .catch((error) => { console.log(error); }); };

PS 我对 JS 和 C# 真的很陌生。

Answer 1

保罗7，

有关数据存储的知识在此活动范围内很有帮助。 我建议获取一些关于在 fe 和 be 中获取信息的可能性的信息。

一些替代方案是：

• 会话存储
• 本地存储
• 饼干
• 缓存

---

它们都有应用，但在技术细节上有所不同。

---

回到您的问题 - 我建议将您的令牌保存到本地存储：

localStorage.setItem("token", data.token);

其中data.token是您的财产。

以下函数在这些操作中可能很有用（因为有时您必须在从剪贴板检索数据之前进行各种转换。）：

• JSON.stringify() - 将 JavaScript 对象或值转换为 JSON 字符串
• JSON.parse() - 方法解析一个 JSON 字符串，构造字符串所描述的 JavaScript 值或对象