uniapp h5微信分享php

### UniApp H5 微信支付获取 OpenID 的解决方案 #### 前端处理流程 为了实现微信H5支付功能，在前端需要先获得用户的OpenID。这通常涉及到微信OAuth2.0授权机制。 在uni-app项目中，可以通过调用微信提供的JS-SDK方法`wx.login()`来启动登录过程并得到临时code[^4]。此code可以被发送至服务器端换取session_key以及用户唯一标识openid。 ```javascript // 调用微信登录接口 wx.login({ success (res) { if (res.code) { // 将 code 发送到后台交换 openid 和 session_key uni.request({ url: 'your_server_url', // 后台服务地址 method: 'POST', data: { js_code: res.code }, success(res) { console.log('成功获取到openid:', res.data.openid); } }); } else { console.error('登录失败！' + res.errMsg); } } }); ``` 需要注意的是，上述代码适用于小程序环境下的操作；对于H5页面，则应采用不同的方式——即利用微信网页授权接口完成相同目的。具体来说就是重定向用户访问链接附加参数state和scope等信息构建而成的URL，从而触发授权流程[^2]。 #### 后端逻辑设计 当接收到从前端传递过来的临时code之后，后端需向微信官方API发起请求以验证该code的有效性，并据此返回对应的access_token与openid组合。以下是基于ThinkPHP框架的一个简单示例： ```php <?php namespace app\controller; use think\Controller; use GuzzleHttp\Client; class Wechat extends Controller { public function get_openid($js_code){ $url = "https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code={$js_code}&grant_type=authorization_code"; try{ $client = new Client(); $response = $client->request('GET',$url)->getBody()->getContents(); $data = json_decode($response,true); if(isset($data['openid'])){ echo json_encode(['status'=>true,'message'=>'success','data'=>$data]); }else{ throw new \Exception("Error Processing Request", 1); } }catch(\Throwable $th){ echo json_encode(['status'=>false,'message'=>$th->getMessage()]); } } } ?> ``` 在此过程中，请记得替换掉模板中的`APPID`,`SECRET`为实际应用所拥有的凭证密钥。

### UniApp H5 实现微信授权登录 #### 准备工作 为了实现在UniApp H5项目中的微信授权登录功能，开发者需拥有一个已注册并审核通过的微信公众平台账号，并完成如下设置： - 获取应用唯一标识（`APPID`） - 配置合法回调域名，在公众平台后台的安全中心进行配置[^3] #### 前端实现过程 ##### 1. 用户同意授权页面跳转 当用户访问带有特定参数链接时，浏览器会重定向到微信服务器请求认证。此URL结构通常为： ```plaintext https://open.weixin.qq.com/connect/oauth2/authorize?appid=YOUR_APP_ID&redirect_uri=REDIRECT_URI&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect ``` 其中： - `YOUR_APP_ID`: 替换为自己公众号的应用程序ID； - `REDIRECT_URI`: 授权后重定向地址，需要经过URLEncode编码处理； - `snsapi_userinfo`: 表明此次授权是为了获取用户的个人信息。 ##### 2. 处理返回的数据 一旦用户成功授权，则会被重定向回指定的`redirect_uri`，并且附带一个临时票据`code`作为查询字符串的一部分。此时可以在前端利用JavaScript捕获该参数用于后续操作。 ```javascript function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; } var code = getQueryString('code'); if(code){ console.log("获得的CODE:", code); // 输出得到的code值 } ``` #### 后端逻辑编写 接收到前端传递过来的`code`之后，服务端应向微信接口发送HTTPS POST请求换取access_token及openid: ```http POST https://api.weixin.qq.com/sns/oauth2/access_token?appid=YOUR_APP_ID&secret=SECRET_KEY&code=AUTHORIZATION_CODE&grant_type=authorization_code HTTP/1.1 Host: api.weixin.qq.com Content-Type: application/x-www-form-urlencoded;charset=UTF-8 ``` 响应数据中包含了`access_token`, `expires_in`, 和最重要的`openid`字段，后者即为目标用户的唯一身份识别码。 最后一步是从微信API获取用户基本信息，同样采用HTTPS GET方式调用： ```http GET https://api.weixin.qq.com/sns/userinfo?access_token=TOKEN&openid=OPENID&lang=zh_CN HTTP/1.1 Host: api.weixin.qq.com Accept: */* ``` 这样就完成了整个H5环境下的微信授权登录流程[^2]。 #### 完整示例代码片段 下面给出一段简化版本的前后端交互伪代码供参考： ```html <!-- index.html --> <button id="loginBtn">点击这里使用微信登录</button> <script type="text/javascript"> document.getElementById('loginBtn').onclick = function() { location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?' + 'appid=wx9b7f0c4a6dxxxxxx' + // 替换成自己的appId '&redirect_uri=' + encodeURIComponent(location.origin + '/callback') + '&response_type=code' + '&scope=snsapi_userinfo'+ '&state=test#wechat_redirect'; }; </script> ``` ```php <?php // callback.php $code = $_GET['code']; $appId = 'wx9b7f0c4a6dxxxxxx'; // 替换成自己的appId $appSecret = 'your_app_secret_key'; $response = file_get_contents("https://api.weixin.qq.com/sns/oauth2/access_token?" . http_build_query([ 'appid' => $appId, 'secret' => $appSecret, 'code' => $code, 'grant_type' => 'authorization_code' ]) ); $data = json_decode($response, true); $accessToken = $data['access_token']; $openId = $data['openid']; $userInfoResponse = file_get_contents("https://api.weixin.qq.com/sns/userinfo?" . http_build_query([ 'access_token' => $accessToken, 'openid' => $openId, 'lang' => 'zh_CN' ]) ); echo "<pre>", htmlspecialchars(print_r(json_decode($userInfoResponse), true)), "</pre>"; ?> ```