//jq寫法完善版
<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>信息平臺(tái)</title>
    <script src="http://rescdn.qqmail.com/node/ww/wwopenmng/js/sso/wwLogin-1.0.0.js" type="text/javascript" charset="utf-8"></script>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <style>
        #code{
            /*wrp_code_rl_btn*/
            width: 100px;
            height: 100px;
        }
        iframe img{
            width: 100px;
            height: 100px;
        }
    </style>
</head>
<body >
    <input type="text" id="state"/>
    <div id="code" onclick="getSessionWX8()"></div>

    <script>
        function getSessionWX(){
            let url = 'https://xxxxxxxxxxxxx.com/getState';
            let vm=this;
            $.ajax({
                url: url,
                method: 'get',
                dataType: 'json',
                success: function(data){
                        $('#state').val(data.payload.results.state);
                        getSession();
                    },
                    error:function(){
                            // alert("服務(wù)器或網(wǎng)絡(luò)問題");
                    }
                });
          };
          getSessionWX();
          function getSession(){
            var clientId= $('#state').val();
            console.log(clientId);
            window.WwLogin({
                    "id" : "code",  //顯示二維碼的容器id
                    "appid" : "wx86dd16937ec6403f",
                    "agentid" : "1000014",  //企業(yè)微信的cropID，在 企業(yè)微信管理端->我的企業(yè) 中查看
                    "redirect_uri" :"https://xxxxxxxxx.com",   //重定向地址，需要進(jìn)行UrlEncode
                    "state" : clientId,   //用于保持請(qǐng)求和回調(diào)的狀態(tài)，授權(quán)請(qǐng)求后原樣帶回給企業(yè)。該參數(shù)可用于防止csrf攻擊（跨站請(qǐng)求偽造攻擊），建議企業(yè)帶上該參數(shù)
                    "href" : "",    //自定義樣式鏈接，企業(yè)可根據(jù)實(shí)際需求覆蓋默認(rèn)樣式。詳見文檔底部FAQ

            });
          }
        setInterval(function(){
            var clientId= $('#state').val();
            let url = 'https://xxxxx.com/getSessionId?state=' + clientId;
            $.ajax({
                url: url,
                method: 'get',
                dataType: 'json',
                success: function(data){
                      console.log(data);
                      // window.location.href='/index.html';
                    },
                    error:function(){
                            //alert("服務(wù)器或網(wǎng)絡(luò)問題");
                    }
                });
        },3000);
        </script>

</body>
</html>

//通用大眾，不完整版，存在用戶同時(shí)掃碼，用戶串登錄
<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>1111</title>
    <script src="http://rescdn.qqmail.com/node/ww/wwopenmng/js/sso/wwLogin-1.0.0.js" type="text/javascript" charset="utf-8"></script>

</head>
<body >
    <div id="code" ></div>

    <script>
        window.WwLogin({
                "id" : "code",  //顯示二維碼的容器id
                "appid" : "xxxxxx",
                "agentid" : "xxxxxx",  //企業(yè)微信的cropID，在 企業(yè)微信管理端->我的企業(yè) 中查看
                "redirect_uri" :"xxxxxxxxxxxx",   //重定向地址，需要進(jìn)行UrlEncode
                "state" : "3828293919281",   //用于保持請(qǐng)求和回調(diào)的狀態(tài)，授權(quán)請(qǐng)求后原樣帶回給企業(yè)。該參數(shù)可用于防止csrf攻擊（跨站請(qǐng)求偽造攻擊），建議企業(yè)帶上該參數(shù)
                "href" : "",    //自定義樣式鏈接，企業(yè)可根據(jù)實(shí)際需求覆蓋默認(rèn)樣式。詳見文檔底部FAQ

        });
    </script>

</body>
</html>
B.vue完整版

<div class="itemLogin WXLogin" v-show="isWXCode == true">
              <div class="pcOrWX">
                <span class="webTitle webTitleWX">企業(yè)微信掃碼登錄</span>
                <span class="iconfont icon-diannao pcCode" @click="pcWXCode(false)" title="手動(dòng)輸入登錄"></span>
              </div>
              <div id="code" @click="getSessionWX1(1)">
                <iframe id="iframe1" :src="WXCodeUrl" frameborder="0" scrolling="no" width="320px" height="313px"></iframe>
              </div>
            </div>

getSessionWX(){
            let vm=this;
            let url = 'https://xxxxx.com/getState';
            $.get(url,function(data){
              var data = JSON.parse(data);
              //https://open.work.weixin.qq.com/wwopen/sso/qrConnect?appid=wx86dd16937ec6403f&agentid=1000014&redirect_uri=https://xxxxxx.com/loginPCByWx&state=5245fc29-ff12-459d-b880-9f16047ba8cd&login_type=jssdk
              vm.stateWX = data.payload.results.state;
              var cssUrl = "https://xxxxx.com/static/css/wxerweima.css";
              vm.WXCodeUrl = "https://open.work.weixin.qq.com/wwopen/sso/qrConnect?appid=wx86dd16937ec6403f&agentid=1000014&redirect_uri=https://xxxxxx.com/loginPCByWx&state=" + vm.stateWX + "&href=" + cssUrl + " rel="external nofollow" &login_type=jssdk";
            },"text");
          },
          getSessionWXLogin(){
            let vm=this;
            let url = 'https://xxxxxx.com/getSessionId?state=' + vm.stateWX;
            $.get(url,function(data){},"text");
          },
         pcWXCode(val){
            let vm = this;
            this.isWXCode = val;
            if(vm.isWXCode == true){
              setInterval(function(){
                  vm.getSessionWXLogin();//輪詢后臺(tái)數(shù)據(jù)登錄
              },3000);
            }
         },

待完善碼過期后傳入的參數(shù)沒有變化問題，后續(xù)優(yōu)化...

到此這篇關(guān)于企業(yè)微信掃碼登錄網(wǎng)頁(yè)功能的文章就介紹到這了,更多相關(guān)企業(yè)微信掃碼登錄內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: