首先,需要到微信开放平台创建移动应用,获取appid、appsecret;
其次appid、appsecret值填写在manifest.json中的'SDK配置'中; '模块权限配置'中选择OAuth(登录鉴权); 在登录页,添加如下代码,获取微信用户信息openid和access_token:
html:
<div id="wx_login" style="display: none">
<div class="other">
<div class="xian"></div>
<div class="say">或用微信登录</div>
<div class="xian"></div>
</div>
<div class="icon">
<img src="./images/log_wei.png" id="wx_loginimg" onclick="wx()">
</div>
<p id="info" style="padding: 0 1em;text-align:left;display: none">登录认证通道信息:</p>
<br/>
<div id="oauth" style="display: none"></div>
<br/>
<div id="output" style="display: none;">
</div>
</div>
js:
if(mui.os.plus){
var access_token = '';
var openid = '';
document.addEventListener('plusready', function() {
plus.runtime.getProperty(plus.runtime.appid,function(inf){
if(inf.version > 1.0){ //检测版本号
if (plus.runtime.isApplicationExist({pname: 'com.tencent.mm', action: 'weixin://'})) { //检测是否有微信客户端
document.getElementById('wx_login').style.display = 'block';
}
}
});
});
var auths={};
function wx() {
// 获取登录认证通道
plus.oauth.getServices(function(services){
// var txt="图标登录认证通道信息:";
for(var i in services){
var service=services[i];
if(service.description == '微信'){
auths[service.id]=service;
var de = document.getElementById('wx_loginimg');
de.setAttribute('onclick','login(this.id)');
de.id=service.id;
}
}
// info.innerText=txt;
},function(e){
outLine("获取登录认证失败:"+e.message);
});
}
// 登录认证
function login(id){
outSet("----- 登录认证 -----");
var auth=auths[id];
if(auth){
var w=null;
if(plus.os.name=="Android"){
w=plus.nativeUI.showWaiting();
}
document.addEventListener("pause",function(){
setTimeout(function(){
w&&w.close();w=null;
},2000);
}, false );
auth.login(function(){
w&&w.close();w=null;
outLine("登录认证成功:");
outLine(JSON.stringify(auth.authResult));
access_token = auth.authResult.access_token;
userinfo(auth);
},function(e){
w&&w.close();w=null;
outLine("登录认证失败:");
outLine("["+e.code+"]:"+e.message);
mui.toast('登录失败');
// plus.nativeUI.alert("详情错误信息请参考授权登录(OAuth)规范文档:http://www.html5plus.org/#specification#/specification/OAuth.html",null,"登录失败["+e.code+"]:"+e.message);
});
}else{
outLine("无效的登录认证通道!");
mui.toast('无效的登录认证通道');
}
}
// 获取用户信息
function userinfo(a){
outLine("----- 获取用户信息 -----");
a.getUserInfo(function(){
outLine("获取用户信息成功:");
outLine(JSON.stringify(a.userInfo));
var nickname=a.userInfo.nickname||a.userInfo.name||a.userInfo.miliaoNick;
openid = a.userInfo.openid;
wx_login(access_token,openid);
},function(e){
outLine("获取用户信息失败:");
outLine("["+e.code+"]:"+e.message);
mui.toast('获取用户信息失败!');
});
}
function wx_login(access_token,openid) {
//接口名根据具体方法名定
mui.ajax(apiname + '/app/app_wx_login', {
data:{
access_token:access_token,
openid:openid
},
dataType: 'json', //服务器返回json格式数据
type: 'post', //HTTP请求类型
timeout: 10000, //超时时间设置为10秒;
success: function(data) {
if(data['token']){
localStorage.removeItem('token');
localStorage.clear(); //清除localstorage
//获取键的值
localStorage.setItem("token", data['token']);
if(go){
window.location.href = go;
}else{
mui.openWindow({
url: 'user.html',
id:'user.html'
});
}
}
},
error: function(xhr, type, errorThrown) {
//异常处理;
var s = JSON.parse(xhr['response']);
mui.toast(s['message']);
}
});
}
}