企業微信掃碼登入網頁功能實現程式碼
阿新 • • 發佈：2022-01-23
企業微信掃碼登入功能，程式碼如下所示：
//jq寫法完善版
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>資訊平臺</title>
<script src="http://rescdn.qqmail.com/node/ww/wwopenmng//sso/wwLogin-1.0.0.js" type="text/" charset="utf-8"></script>
<script src="http://apps.bdimg.com/libs//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);
getSwww.cppcns.com //通用大眾，不完整版，存在使用者同時掃碼，使用者串登入
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>1111</title>
<script src=www.cppcns.com"http://rescdn.qwww.cppcns.comqmail.com/node/ww/wwopenmng/js/sso/wwLogin-1.0.0.js" type="text/script" charset="utf-8"></script>
</head>
<body >
<div id="code" ></div>
<script>
window.WwLogin({
"id" : "code",//顯示二維碼的容器id
"appid" : "xxxxxx","agentid" : "xxxxxx",//企業微信的cropID，在 企業微信http://www.cppcns.com管理端->我的企業 中檢視
"redirect_uri" :"xxxxxxxxxxxx",//重定向地址，需要進行UrlEncode
"state" : "3828293919281",//用於保持請求和回撥的狀態，授權請求後原樣帶回給企業。該引數可用於防止csrf攻擊（跨站請求偽造攻擊），建議企業帶上該引數
"href" : "",//自定義樣式連結，企業可根據實際需求覆蓋預設樣式。詳見文件底部FAQ
});
</script>
</body>
</html>
B.完整版
<div class="itemLogin WXLogin" v-show="isWXCode == true">
<div class="pcOrWX">
<span class="webTitle webTitleWX">企業微信掃碼登入</span>
<span class="iconfont icon-diannao pcCode" @click="pcWXCode(false)" title="手動輸入登入"></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 Url = "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){},pcWXCode(val){
let vm = this;
this.isWXCode = val;
if(vm.isWXCode == true){
setInterval(function(){
vm.getSessionWXLogin();//輪詢後臺資料登入
},3000);
}
},
待完善碼過期後傳入的引數沒有變化問題，後續優化...
到此這篇關於企業微信掃碼登入網頁功能的文章就介紹到這了,更多相關企業微信掃碼登入內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！