钉钉扫码登录

vue+element+C#集成钉钉扫码登录模块（前端页面）

---

页面

<-采用了teb切换页的形式-->
<el-tab-pane label="钉钉登录" name="third">
            <div
              style=" width:400px height: 238px;background: #ffffff"
              id="ding-login">
            </div>
</el-tab-pane>

---

前端逻辑

methods:{
	dingLogin() {
      window.DDLogin({
        id: "ding-login",
        goto: "", 在钉钉官方开发文章中可以查看例子，redirect_uri必须是域名，而且是appid所对应的域名。
        style: "border:none;background-color:#FFFFFF;",
        width: "300",
        height: "300",
      });
      var handleMessage = (event) => {
        var origin = event.origin;
        console.log(event);
        if (origin == "https://login.dingtalk.com") {
          //判断是否来自ddLogin扫码事件。
          var loginTmpCode = event.data;
          //获取到loginTmpCode后就可以在这里构造跳转链接进行跳转了
          console.log("loginTmpCode", loginTmpCode);
        }
      };
      if (typeof window.addEventListener != "undefined") {
        window.addEventListener("message", handleMessage, false);
        console.log("add event");
      } else if (typeof window.attachEvent != "undefined") {
        window.attachEvent("onmessage", handleMessage);
        console.log("attach event");
      }
    },
    //切换标签页事件（element官方文档有）
    handleClick(tab) {
      if (tab.index == "1") {
        this.dingLogin();
      }
    },
}

---

后端逻辑（netCore5.0）

public TableData DingLogin(string tmpAuthCode)
        {
            string AppId = "";
            string AppSecret = "";
            IDingTalkClient client = new DefaultDingTalkClient("https://oapi.dingtalk.com/sns/getuserinfo_bycode");
            OapiSnsGetuserinfoBycodeRequest req = new OapiSnsGetuserinfoBycodeRequest();
            req.TmpAuthCode = tmpAuthCode;//临时授权码
            OapiSnsGetuserinfoBycodeResponse oapiSnsGetuserinfoBycodeResponse = client.Execute(req, AppId, AppSecret);
            var result = new TableData();
            var obj = DeleteDataPrivilege("u");
            if (oapiSnsGetuserinfoBycodeResponse.UserInfo == null) return null;
            result.data = obj.Where(u=>u.OpenId.Contains( oapiSnsGetuserinfoBycodeResponse.UserInfo.Openid));//去和数据库中的openId作比较（前提数据库中必须有openId）
            return result;

        }