uniapp实现公众号微信登录

前端代码

javascript 复制代码
data() {
	return {
		openid: "",
		server: '',
		code:''
	};
},
mounted() {
	this.getCode()
},
methods:{
	getCode() {
		// 非静默授权,第一次有弹框
		this.code = '';
		var callback_url = '回调地址'; // 获取页面url
		var appid = 'APPID';
		this.code = this.getUrlCode().code; // 截取code
		if (this.code == null || this.code === '') {
			// 如果没有code,则去请求
			window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${encodeURIComponent(
	            callback_url
	        )}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`;
		} else {
			// 当code不等于空时,调用后端接口获取用户信息
			this.getUserInfo();
			// 你自己的业务逻辑
		}
	},
	getUserInfo() {
		let token = uni.getStorageSync("token");
		const header = {
			"Content-Type": "application/json",
			"Authorization": token
		};
		let data = {}
		data.code = this.code
		data.appid= '你的appid'
		data.secret= '你的secret'
		uni.request({
			url: 'https://api.ecom20200909.com/Api/getOpenid',
			data: data,
			header: header,
			timeout: 20000,
			method: 'POST',
			dataType: 'json',
			success: (res) => {
				this.setOpenid(res.data.openid);
				uni.setStorageSync('openid', res.data.openid)
			}
		})
	},
	getUrlCode() {
		// 截取url中的code方法
		var url = location.search;
		var theRequest = new Object();
		if (url.indexOf('?') != -1) {
			var str = url.substr(1);
			var strs = str.split('&');
			for (var i = 0; i < strs.length; i++) {
				theRequest[strs[i].split('=')[0]] = strs[i].split('=')[1];
			}
		}
		return theRequest;
	},
}

后端php代码

php 复制代码
public function getOpenid(){
    $code = input('post.code');
    $param["appid"]=input('post.appid');
    $param["secret"]=input('post.secret');
    $param["code"]=$code;
    $param["grant_type"]="authorization_code";
    $json = $this->curlPost("https://api.weixin.qq.com/sns/oauth2/access_token",$param);
    $rv=json_decode($json,true);
    return json($rv);
}

public function curlPost($url = '', $postData = '', $options = array()) {
  if (is_array($postData)) {
      $postData = http_build_query($postData);
  }
  $ch = curl_init();
  curl_setopt($ch, CURLOPT_URL, $url);
  curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
  curl_setopt($ch, CURLOPT_POST, 1);
  curl_setopt($ch, CURLOPT_POSTFIELDS, $postData);
  curl_setopt($ch, CURLOPT_TIMEOUT, 30); //设置cURL允许执行的最长秒数
  if (!empty($options)) {
      curl_setopt_array($ch, $options);
  }
  //https请求 不验证证书和host
  curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
  curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
  $data = curl_exec($ch);
  curl_close($ch);

  return $data;
}
相关推荐
中国胖子风清扬1 小时前
GPUI 在 macOS 上编译问题排查指南
spring boot·后端·macos·小程序·rust·uni-app·web app
码云数智-园园1 天前
uni-app 实现物流进度跟踪功能:从 UI 到数据驱动的完整方案
ui·uni-app
陈思杰系统思考Jason2 天前
系统思考:认知边界与组织发展
百度·微信·微信公众平台·新浪微博·微信开放平台
CaracalTiger2 天前
OpenClaw开源项目汇总:Installer一键部署、Moltworker云端方案、钉钉飞书微信接入全指南
微信·开源·aigc·钉钉·飞书·学习方法·业界资讯
予你@。3 天前
UniApp + Vue3 实现 Tab 点击滚动定位(微信小程序)
微信小程序·小程序·uni-app
游戏开发爱好者83 天前
完整教程:App上架苹果App Store全流程指南
android·ios·小程序·https·uni-app·iphone·webview
予你@。3 天前
uni-app progress 组件使用详解
uni-app
iOS阿玮3 天前
春节提审高峰来袭!App Store 审核时长显著延长。
uni-app·app·apple
2501_916007473 天前
ios上架 App 流程,证书生成、从描述文件创建、打包、安装验证到上传
android·ios·小程序·https·uni-app·iphone·webview
2501_915106324 天前
iPhone 文件管理,如何进行应用沙盒文件查看
android·ios·小程序·https·uni-app·iphone·webview