公众号H5分享（PHP版）

2025-03-31
dfer
6
php html5 微信H5分享 CSDN

很久没有开发公众号了，忘的差不多了，踩了个以前踩过的坑，特此留下记录避坑。

想要分享有效果必须使用卡片形式：开发工具完成后将访问链接生成二维码后扫码进行访问，否则分享将失效。

html端

<!DOCTYPE html>
<html lang="zh-CN">
<head></head>
<body>
<script type="application/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.6.2.js" charset="utf-8"></script>
<script>
    var response = JSON.parse('{$response|json_encode=###|raw}');//后端生成的分享config数据
    console.log(response);
    var shareData = {
        debug:true,
        shareTitle: '分享标题',
        shareDescContent: '分享内容',
        shareImgUrl: 'https://www.xxx.com/logo.jpg',//分享图片
        shareLink: location.href,//分享链接
    }
    let jsApiList = ['updateAppMessageShareData','updateTimelineShareData'];
    let shareClose = false;//为true是关闭分享和复制链接功能
    if ((typeof shareClose !== "undefined") && shareClose === true) {
        jsApiList = ['hideOptionMenu'];
    }
    wx.config({
        debug: false,//debug调试，开启后会显示调试信息
        appId: response.appId,
        timestamp: response.timestamp,
        nonceStr: response.nonceStr,
        signature: response.signature,
        jsApiList: jsApiList
    })
    wx.ready(function () {
        if ((typeof shareClose !== "undefined") && shareClose === true) {
            wx.hideOptionMenu();
        } else {
            //分享好友
            wx.updateAppMessageShareData({
                title: shareData.shareTitle,
                desc: shareData.shareDescContent,
                link: shareData.shareLink,
                imgUrl: shareData.shareImgUrl,
                success:function(res){
                    console.log("updateAppMessageShareData2",res)
                },
                fail:function(res){
                    console.log("updateAppMessageShareData:fail2",res)
                },
            })
            //朋友圈
            wx.updateTimelineShareData({
                title: shareData.shareTitle,
                link: shareData.shareLink,
                imgUrl: shareData.shareImgUrl,
                success:function(res){
                    console.log("updateTimelineShareData2",res)
                },
                fail:function(res){
                    console.log("updateTimelineShareData2:fail",res)
                },
            })
        }
    })
</script>
</body>
</html>

PHP端使用的thinkPHP8框架

Auth为公共授权，所有需要走微信授权的类皆可继承

Jssdk的getSignPackage方法为获取微信H5接口调用config的配置信息，子类可以重写覆盖

namespace app\xxx\controller;
use tencent\jssdk\Jssdk;

class Auth extends \app\common\controller\Auth
{
    public function initialize()
    {
        parent::initialize();
        
        $appid = "xxx";
        $appSecret="xxxx";
        $bool = session('?auth');
        if (is_null($bool)) {
            Session::clear();
            $bool = session('?auth');
        }
        $authInfo = "";
        if (!$bool && !isset($_GET['code'])) {
            $param = http_build_query($_GET);
            $url = request()->baseUrl(true).($param?"?".$param:"");
            $url = urlencode($url);
            $waInfo = WechatAccounts::where(["id" => 1])->find();
            $_redirect_uri = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=appid &redirect_uri=$url&response_type=code&scope=snsapi_userinfo#wechat_redirect";
            Header("Location:$_redirect_uri");
            exit();
        } else if (!$bool && isset($_GET['code'])) {
            $waInfo = WechatAccounts::where(["id" => 1])->find();
            $url = "https://api.weixin.qq.com/sns/oauth2/access_token?appid=$appid&secret=$appSecret&code=" . $_GET['code'] . "&grant_type=authorization_code";
            $json = json_decode(file_get_contents($url), true);
            if (!isset($json['access_token'])) {//说明code是错误的，重新请求进行回调
                unset($_GET['code']);
                unset($_GET['state']);
                $param = http_build_query($_GET);
                $url = request()->baseUrl(true).($param?"?".$param:"");
                $url = urlencode($url);
                $_redirect_uri = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=$appid&redirect_uri=$url&response_type=code&scope=snsapi_userinfo#wechat_redirect";
                Header("Location:$_redirect_uri");
                exit();
            }
            $userIndo_url = "https://api.weixin.qq.com/sns/userinfo?access_token=" . $json['access_token'] . "&openid=" . $json['openid'] . "&lang=zh_CN";
            $userInfo = json_decode(file_get_contents($userIndo_url), true);
            $userInfo = array_merge($userInfo,$json);
            //自行进行存储
            session('auth', $userInfo);
        } else {//存在session不必再次授权
            $userInfo= session('auth');
        }

        View::assign([
            'response' => (new Jssdk($waInfo->appid, $waInfo->appsecret))->getSignPackage(),//H5分享config参数获取，可以传入需要分享的url,不传视为当前url
            'url' => request()->baseUrl(true),//当前url
            "userInfo" => $userInfo//信息渲染页面
        ]);
    }
}

Jssdk文件内容

<?php
namespace tencent\jssdk;

class Jssdk
{
    private $appId;
    private $appSecret;
    public function __construct($appId, $appSecret) {
        $this->appId = $appId;
        $this->appSecret = $appSecret;
    }
    public function getSignPackage($url='') {
        $jsapiTicket = $this->getJsApiTicket();
        $url = $url?:request()->url(true);//没传url使用当前url
        $timestamp = time();
        $nonceStr = random(16);
        // 这里参数的顺序要按照 key 值 ASCII 码升序排序
        $string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr&timestamp=$timestamp&url=$url";
        $signature = sha1($string);
        return ["appId"     => $this->appId,
            "nonceStr"  => $nonceStr,
            "timestamp" => $timestamp,
            "url"       => $url,
            "signature" => $signature,
            "rawString" => $string]
        ;
    }
    private function getJsApiTicket() {
        $path = __DIR__."/token/".$this->appId.".jsapi_ticket.json";
        $data = "";
        if(file_exists($path)){
            $data = json_decode(file_get_contents($path),true);
        }
        if(!$data||!$data['expire_time']||$data['expire_time'] < time()){
            $accessToken = $this->getAccessToken();
            $url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken";
            $res = json_decode(file_get_contents($url),true);
            if ($res['ticket']) {
                $data = ['jsapi_ticket'=>$res['ticket'],'expire_time'=>time() + 7000];
                file_put_contents($path,json_encode($data,JSON_UNESCAPED_UNICODE));
            }

        }
        return $data['jsapi_ticket'];
    }
    public function getAccessToken() {
        $path = __DIR__."/token/".$this->appId.".access_token.json";
        $data = "";
        if(file_exists($path)){
            $data = json_decode(file_get_contents($path),true);
        }
        if(!$data||!$data['expire_time']||$data['expire_time'] < time()){
            $url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=$this->appId&secret=$this->appSecret";
            $json = file_get_contents($url);
            $res = json_decode($json,true);
            if ($res['access_token']) {
                $data = ['access_token'=>$res['access_token'],'expire_time'=>time() + 7000];
                file_put_contents($path,json_encode($data,JSON_UNESCAPED_UNICODE));
            }
        }
        return $data['access_token'];
    }
}

上一篇：几秒钟就充满电！科学

下一篇：暂无数据