在前端开发中，跨域请求接口是经常会碰到的问题。如果你的后端应用使用了 Keycloak 来做身份认证，那么你就需要在前端应用中获取 Keycloak 的访问令牌（access token）来调用接口。
keycloak-request-token 是一个很好的帮助获取 Keycloak access token 的 npm 包，下面我们来学习一下如何使用。
安装
通过 npm 安装 keycloak-request-token:
npm install keycloak-request-token
使用
1. 初始化
在使用 keycloak-request-token 完成所有 Keycloak 相关配置后，我们就可以进行初始化：
-- -------------------- ---- ------- ----- --------------- - --------------------------------- ----- -------------- - - -------------- -------------------- ------ ---------- --------- -------------- ------------- ------------------ --------- ------------- --------- ------------ - ----- --------------- - --- -------------------------------
注意：keycloakConfig 中的变量需要替换为你实际的 Keycloak 配置信息。
2. 获取 Access Token
获取 Keycloak access token 可以使用 keycloakRequest.getToken() 方法来发出请求。
keycloakRequest.getToken()
.then((token) => {
console.log('Access Token: ', token)
})
.catch((error) => {
console.log('Error: ', error)
})如果成功，将返回 access token；否则将返回错误信息。
3. 将 Access Token 作为请求头
获取到 access token 后，需要将它添加到请求头中用于调用后端接口：
-- -------------------- ---- -------
----- ------- - -
---- -----------------
-------- -
---------------- ------- - - --------------
-
-
--------------------------------------- -- -
-------------------------------- - ------- - - -----
-- ----- - ----- ----
------------------ - -------- --------------- --
----------- -- -
-- --------
--
--注意：options.url 和 options.headers 中的变量需要替换为你实际的后端接口信息和 access token。
总结
通过本文，我们学习了如何使用 npm 包 keycloak-request-token 来获取 Keycloak access token 并使用它来调用后端接口，通过了解该包使得我们的前端应用实现 Keycloak 认证变得十分容易，同时也提高了项目开发的效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedb685b5cbfe1ea0611562