**
注:目前已经停止使用hbuilder 转战uniapp 此方法是否失效未知
**
公司项目是个vue构建的webapp项目 有个提现功能 需要获得微信的openid
前提:获得微信开放平台一系列appid appsecret 具体不赘述 下面是代码
新建wxlogin.js文件(名字随意)
var auths=null;
function authLogin(){
var s = auths[0];
if ( !s.authResult ) {
s.login( function(e){
// 获取登录操作结果
var result = e.target.authResult;
alert( "登录认证成功:"+JSON.stringify(result) );
authUserInfo()
}, function(e){
alert("登录认证失败!");
}, {} );
}
}
function authUserInfo(){
var s = auths[0];
if ( !s.authResult ) {
alert("未登录授权!");
} else {
s.getUserInfo( function(e){
alert( "获取用户信息成功:"+JSON.stringify(s.userInfo) );
//拿到用户信息,进行相关处理,ajax传用户数据到服务器等
var prame = JSON.stringify(s.userInfo);
}, function(e){
alert( "获取用户信息失败:"+e.message+" - "+e.code );
} );
}
}
function authLogout(){
for ( var i in auths ) {
var s = auths[i];
if ( s.authResult ) {
s.logout(function(e){
alert( "注销登录认证成功!" );
}, function(e){
alert( "注销登录认证失败!" );
});
}
}
}
function wxlog(){
plus.oauth.getServices( function(services){
auths = services;
authLogin();
}, function(e){
alert("获取分享服务列表失败:"+e.message+" - "+e.code);
} );
} export default{
wxlog //该步骤重要
}
main.js引入
import utils from'./assets/js/wxlogin.js'; // 引入刚才新建的js文件
Vue.prototype.$utils=utils
业务页面xxx.vue页面使用
<template>
<div class="out">
<div class="submit" @click="$utils.wxlog()">wx登录 // 点击按钮即可唤起微信授权页面
</div>
</div>
</template>
打包后使用hbuilder真机运行即可看到效果 需要打包发布的话 配置里必须勾选微信登录并且填写appid和appsecret 并且应用包名要和申请微信开放平台时的包名保持一致
点击按钮后即可拿到具体的openid之类的参数
后续使用自己随机应变即可