飞书二维码联合登录，对接起来太简单了

最新推荐文章于 2025-01-23 13:45:38 发布

王念博客

最新推荐文章于 2025-01-23 13:45:38 发布

阅读量350

点赞数 3

文章标签：飞书

本文链接：https://blog.csdn.net/ZuiChuDeQiDian/article/details/144227680

版权

1.先创建一个飞书应用

2.引入 JS 库

<script src="https://lf-package-cn.feishucdn.com/obj/feishu-static/lark/passport/qrcode/LarkSSOSDKWebQRCode-1.0.3.js"></script>

3. 自定义 js

 const goto = "https://passport.feishu.cn/suite/passport/oauth/authorize?client_id=cli_&redirect_uri=httindex&response_type=code&state=STATE";
    const QRLoginObj = QRLogin({
        id: "login_container",
        goto: goto,
        width: "400",
        height: "400",
        style: "background-color: #eee;"
    });
    const handleMessage = function (event) {
        try {
            if (QRLoginObj.matchOrigin(event.origin) && QRLoginObj.matchData(event.data)) {
                const loginTmpCode = event.data.tmp_code;
                console.log(loginTmpCode);
                //window.location.href = `${goto}&tmp_code=${loginTmpCode}`;
            }
        } catch (error) {
            console.error('处理消息时发生错误:', error);
        }
    };
    if (window.addEventListener) {
        window.addEventListener('message', handleMessage, false);
    } else if (window.attachEvent) {
        window.attachEvent('onmessage', handleMessage);
    }

4.html代码

<body>
    <div class="container">
        <div class="qr-box" id="login_container">
            <p class="tips">请使用手机扫描二维码登录</p>
        </div>
    </div>
</body>

询问AI