PHP 微信公众号自定义分享内容实现方法

青禾
青禾
发布时间:2026-10-14| 3人浏览过
原创

本文详细介绍在微信公众平台中,如何利用 PHP 后端生成签名,配合前端 JavaScript SDK 实现微信页面的自定义分享功能(包括标题、描述、链接及缩略图),包含完整的代码逻辑与安全注意事项。

结果或目标

在用户通过微信内置浏览器访问你的网站时,点击右上角菜单的“转发”按钮,能够展示自定义的标题、摘要、图片和链接,而不是默认抓取网页第一张图片或使用空白默认值。

准备条件

  1. 公众号凭证:你需要拥有一个已认证的公众号,并获取到 AppID(应用 ID)和 AppSecret(应用密钥)。
  2. 服务器环境:一个支持 PHP 的 Web 服务器,确保开启了 cURL 扩展。
  3. 域名管理:用于承载分享页面的域名需已备案,并能正常 HTTP/HTTPS 访问。

第1步:绑定 JS 接口安全域名

目的:确保只有你授权的域名才能调用微信 JS API。

操作入口:登录微信公众平台 → 设置 → 公众号设置 → 功能设置 → JS接口安全域名。

步骤:填写你的主域名(例如 www.example.com),下载微信提供的校验文件并将其放在该域名根目录下完成验证。注意这里只需要填写顶级域名,无需带路径。

真实操作顺序

第2步:生成 JSSDK 签名 (PHP 后端)

目的:根据微信规定的算法生成签名 signature、时间戳 timestamp 和随机串 nonceStr。

核心逻辑: 1. 使用 AppID 和 AppSecret 获取全局 access_token。 2. 使用 access_token 获取 jsapi_ticket。 3. 将 jsapi_ticket、当前网页完整 URL(不含 # 及其后部分)、随机字符串和时间戳拼接成字符串,进行 SHA1 加密得到签名。

<?php
// 封装 curl 请求函数
class WxHelper {
    public static function getCurlContent($url, $method = 'GET', $data = []) {
        $ch = curl_init();
        // 禁用证书验证(生产环境建议开启)
        curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        
        if ($method == 'POST') {
            curl_setopt($ch, CURLOPT_POST, 1);
            curl_setopt($ch, CURLOPT_POSTFIELDS, http_build_query($data));
        }
        curl_setopt($ch, CURLOPT_URL, $url);
        $result = curl_exec($ch);
        curl_close($ch);
        return $result;
    }

    // 获取 access_token
    public static function getToken($appid, $appsecret) {
        $token_url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid={$appid}&secret={$appsecret}";
        $res = json_decode(self::getCurlContent($token_url), true);
        // 实际项目中应将 token 存入 Redis 或数据库缓存,有效期7200秒
        return $res['access_token'];
    }

    // 获取 jsapi_ticket
    public static function getTicket($token) {
        $ticket_url = sprintf("https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=%s&type=jsapi", $token);
        $res = json_decode(self::getCurlContent($ticket_url), true);
        // 实际项目中应缓存 ticket,有效期7200秒
        return $res['ticket'];
    }

    // 生成签名数据
    public static function createSign($url) {
        $appid = 'YOUR_APP_ID'; // 替换为你的 AppID
        $appsecret = 'YOUR_APP_SECRET'; // 替换为你的 AppSecret
        
        $token = self::getToken($appid, $appsecret);
        $ticket = self::getTicket($token);
        
        $timestamp = time();
        $noncestr = md5(time() . mt_rand(0, 9999));
        
        // 必须截取当前页面完整URL,去除 hash 部分
        $currentUrl = parse_url($url, PHP_URL_SCHEME).'://'.parse_url($url, PHP_URL_HOST).parse_url($url, PHP_URL_PATH).($_SERVER['QUERY_STRING'] ? '?'.$_SERVER['QUERY_STRING'] : '');
        
        $string = sprintf('jsapi_ticket=%s&noncestr=%s&timestamp=%s&url=%s', $ticket, $noncestr, $timestamp, $currentUrl);
        $signature = sha1($string);
        
        return [
            'appId' => $appid,
            'timestamp' => $timestamp,
            'nonceStr' => $noncestr,
            'signature' => $signature
        ];
    }
}

// 在视图层调用:
$signData = WxHelper::createSign($_SERVER['REQUEST_URI']);
?>

第3步:前端初始化与权限配置 (JavaScript)

目的:将后端生成的签名注入到微信 JS SDK 中,并注册分享事件。

操作:在 HTML 页面引入官方 JS 库,并在 DOM 加载完成后执行 wx.config 和 wx.ready。

<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
wx.config({
    debug: false, // 调试时可设为 true
    appId: '',
    timestamp: '',
    nonceStr: '',
    signature: '',
    jsApiList: [
        'onMenuShareTimeline',          // 分享到朋友圈
        'onMenuShareAppMessage',        // 发送给好友
        'onMenuShareQQ',                // QQ好友
        'onMenuShareWeibo'              // 腾讯微博
    ]
});

wx.ready(function () {
    // 定义分享内容变量
    var shareConfig = {
        title: '文章标题',       // 分享标题
        desc: '这是一个精彩的描述文案', // 分享描述
        link: window.location.href.split('#')[0], // 分享链接
        imgUrl: 'http://example.com/logo.png'    // 分享图标,建议宽高比例 1:1
    };

    // 分享给朋友/群聊
    wx.onMenuShareAppMessage({
        title: shareConfig.title,
        desc: shareConfig.desc,
        link: shareConfig.link,
        imgUrl: shareConfig.imgUrl,
        type: 'link', // music, video or link
        dataUrl: '',    // 如果type是music或video,则必须提供数据链接,默认为空
        success: function () {
            // 用户确认分享后执行的回调函数
        },
        cancel: function () {
            // 用户取消分享后执行的回调函数
        }
    });

    // 分享到朋友圈
    wx.onMenuShareTimeline({
        title: shareConfig.title + ' - ' + shareConfig.desc, // 朋友圈通常显示长文本
        link: shareConfig.link,
        imgUrl: shareConfig.imgUrl,
        success: function () {},
        cancel: function () {}
    });
});
</script>

完成判断

当你在手机微信中打开该页面,点击右上角的三个点 ...,选择“转发给好友”或“分享到朋友圈”,预览窗口应显示你在 shareConfig 中设置的指定标题、描述、图片和链接。

原文有依据的排错

  • 签名失败 (invalid signature):最常见的原因是参与签名的 URL 不正确。务必确保 PHP 端计算的 URL 与 JS 端配置的 URL 完全一致(协议、域名、参数均需相同)。特别注意:jssdk签名所用的url必须是调用JS接口的页面的完整URL,且不能带有 # 及其后面的部分。
  • Token/Ticket 过期:微信接口对 Token 和 Ticket 都有有效期(通常为7200秒)。如果在高并发场景下每次请求都去微信服务器拉取,不仅速度慢还容易超限。强烈建议在 PHP 服务端加入 Redis 或数据库缓存机制,控制刷新频率。
  • 图片不显示或太小:分享的图片 URL 必须是公网可访问的绝对路径,且建议尺寸不小于 300px * 300px,否则可能无法正确渲染。

以上就是 PHP 微信公众号自定义分享内容接口的详细内容,更多关于 PHP 微信 JSAPI 开发的资料请关注本站其它相关文章!

免责声明:本文内容仅供参考,不代表本站观点。转载或引用请注明出处。

Python 相关产品和应用

全部下载
Selenium

Selenium

4.51.0 · Windows

用于浏览器自动化和 Web 测试的 Python 工具。

scikit-learn

scikit-learn

1.9.1 · Windows

常用 Python 机器学习算法与模型评估工具库。

Black

Black

26.10.1 · Windows

强调一致性的 Python 自动代码格式化工具。

Ruff

Ruff

0.17.1 · macOS

由 Rust 编写的高速 Python 代码检查和格式化工具。

pytest

pytest

9.1.1 · Windows

简洁而强大的 Python 自动化测试框架。

FastAPI

FastAPI

0.146.0 · Windows

高性能 Python API 框架,支持类型提示和自动接口文档。

Flask

Flask

3.1.3 · Windows

轻量灵活的 Python Web 应用框架。

Django

Django

6.1.2 · Windows

成熟的 Python Web 框架,适合构建内容站点和业务系统。

Spyder

Spyder

6.1.7 · Windows

面向科学计算与数据分析的 Python 集成开发环境。

SciPy

SciPy

1.18.1 · Windows

面向科学、工程和技术计算的 Python 算法库。