首页 > 基础资料 博客日记

keycloak~为微信二维码添加动态kc认可的动态state

2024-07-29 11:00:03基础资料围观217

本篇文章分享keycloak~为微信二维码添加动态kc认可的动态state,对你有帮助的话记得收藏一下,看Java资料网收获更多编程知识

本实例将通过keycloak社区登录实现微信二维码的登录,并且二微码不是keycloak动态生成,而是通过微信提供的js生成的,在页面上直接输出的方式实现的。

动态state

在Keycloak中使用微信二维码登录时,state参数确实是由后端生成的,并且用于确保登录过程的安全性,防止CSRF攻击等。如果你尝试在前端写死state值或者在前端生成,可能会导致一些安全和整合问题,正如你在parseSessionCode方法中遇到的错误。

前端代码,生成keycloak的state

  • 格式:session_code.tab_id.client_id
  • js方法生成state
<script src="${url.resourcesPath}/script/wxLogin.js"></script>
<script>

var client_id = "${client_id!''}";
var redirect_uri = "${redirect_uri!''}";
if (redirect_uri.indexOf("?") > 0) {
    redirect_uri = redirect_uri + "&client_id=" + client_id;
} else {
    redirect_uri = redirect_uri + "?client_id=" + client_id;
}
let decodedLoginUrl = '${p.loginUrl}'.replace(/&amp;/g, '&');
var stateValue = getQueryVariable(decodedLoginUrl, "session_code") + "." + getQueryVariable(decodedLoginUrl, "tab_id") + "." + getQueryVariable(decodedLoginUrl, "client_id")
new WxLogin({
    href: "https://static.test.com/statics/css/wechatimgregister.css",
    self_redirect: false,
    id: "wechatImg",
    appid: "${weixinAppId}",
    scope: "snsapi_login",
    redirect_uri: "${weixinCallback}?redirect_uri=" + redirect_uri,
    state: stateValue,
    style: "black",
    info: "${msg("weixinPrompt")}"
});

</script>
  • 当我们使用上面的keycloak认可的state之后,就可以把回调地址也设置成keycloak默认生成的callback地址了,并且keycloak的第一认证流登录后流程也是可以直接使用的。


文章来源:https://www.cnblogs.com/lori/p/18329571
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:jacktools123@163.com进行投诉反馈,一经查实,立即删除!

标签:

相关文章

本站推荐

标签云