钉钉扫码登录第三方网站

钉钉官方文档：扫码登录第三方网站 - 开放平台

方式一：使用钉钉提供的扫码登录页面

https://oapi.dingtalk.com/connect/qrconnect?appid= 
SuiteKey 
&response_type=code&scope=snsapi_login&state=STATE&redirect_uri=REDIRECT_URI

也可以试试

https://http://login.dingtalk.com/oauth2/auth?&response_type=code&corpid=CORPID&scope=openid corpid&prompt=consent&client_id=CLIENT_ID&redirect_uri=REDIRECT_URI&state=dingtalk

方式二：登录二维码内嵌到自己页面中

1、页面引入js文件<script src="https://http://g.alicdn.com/dingding/dinglogin/0.0.5/ddLogin.js"></script>

2、创建放置二维码的组件<div id="login_container"></div>

3、创建实例

DDLogin({
 id:"login_container",
 goto: encodeURIComponent(this.dingUrl + '&redirect_uri='+this.redirectUrl),
 style: "border:none;background-color:transparent;",
 width : "240",
 height: "300"
        });

 4、添加扫码回调处理

let vm = this
 var handleMessage = function (event) {
 var origin = event.origin;
 if( origin == "https://login.dingtalk.com" ) { //判断是否来自ddLogin扫码事件。
    var loginTmpCode = event.data; 
    let state = new Date().getTime()
    //获取到loginTmpCode后就可以在这里构造跳转链接进行跳转了
    let url = vm.dingUrl + '&redirect_uri=' + vm.redirectUrl + '&loginTmpCode=' + loginTmpCode + '&state=' + state
    var link = document.createElement('a');
    link.href = url;
    link.click();
   }
 };
 if (typeof window.addEventListener != 'undefined') {
 window.addEventListener('message', handleMessage, false);
        } else if (typeof window.attachEvent != 'undefined') {
 window.attachEvent('onmessage', handleMessage);
        }