微信h5调用wx.config踩坑

最新推荐文章于 2025-05-19 16:50:30 发布

置顶小码家

最新推荐文章于 2025-05-19 16:50:30 发布

阅读量7.2k

点赞数 7

CC 4.0 BY-SA版权

分类专栏： h5微信服务号遇到的问题文章标签： html php

本文链接：https://blog.csdn.net/qq_35451130/article/details/111398257

遇到的问题同时被 2 个专栏收录

5 篇文章

订阅专栏

h5微信服务号

2 篇文章

订阅专栏

博主研究用ES和前端开发微信H5项目，验证时出现63002错误，前端调用后台接口给wx.config发的参数签名无效。最后通过配置easychat的config解决问题，还给出了代码实现，包括前端代码和后端PHP代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天没事研究了一下后台用es和前端开发一个和微信h5的一个it项目，在验证这块出了问题，老是报63002错误，在前端调用后台接口时候在调用成功函数里给wx.config发的参数赋值，但是签名无效，看过很多办法，，最后解决如下
一，配置easychat的config
`use EasyWeChat\Factory;

$config = [
‘app_id’ => ‘’,//微信appId
‘secret’ => ‘’,//微信秘钥

// 指定 API 调用返回结果的类型：array(default)/collection/object/raw/自定义类名
'response_type' => 'array',

//...

];

$a p p = F a c t o r y : : o f f i c i a l A c c o u n t ($ config);公众号
在此之前，需要安装easywechat

$ composer require overtrue/wechat:~4.0 -vvv

代码实现：
前端代码：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>分享按钮测试</title>
</head>
<body>
<div>
    <p>测试微信分享功能</p>
</div>
<script src="/kandian/js/jquery.1.8.3.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.5.0.js"></script>
<script>
    $(document).ready(function () {
        // alert(location.href.split('#')[0]);
        wx.config({
               debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
               appId: '<?php echo $jssdk['appId'];?>', // 必填，公众号的唯一标识
               timestamp:'<?php echo $jssdk['timestamp'];?>', // 必填，生成签名的时间戳
               nonceStr:'<?php echo $jssdk['nonceStr'];?>', // 必填，生成签名的随机串
               signature:'<?php echo $jssdk['signature'];?>',
               jsApiList:['checkJsApi', 'updateAppMessageShareData', 'updateTimelineShareData']
        });
        wx.ready(function () {
            wx.updateAppMessageShareData({
                title: '微信分享接口-分享标题',
                desc: '分享文案'  ,
                link: 'http://t6cws8.natappfree.cc/index/index/share',
                imgUrl:'http://t6cws8.natappfree.cc/uploads/20191128/5ddf8436c82388686.jpg' ,
                success: function () {
                }
            });
            wx.updateTimelineShareData({
                title: '微信分享接口-分享标题',
                desc: '分享文案'  ,
                link: 'http://t6cws8.natappfree.cc/index/index/share',
                imgUrl:'http://t6cws8.natappfree.cc/uploads/20191128/5ddf8436c82388686.jpg' ,
                type: 'link',
                dataUrl: '',
                success: function () {
                }
            });
        });
    })
</script>
</body>
</html>

后端php代码

use EasyWeChat\Factory;
 public function jssdk()
    {
        if (request()->isAjax()) {
            return true;
        }
        $config = config('account.easywechat2');
        $app = Factory::officialAccount($config);

        $jssdk = json_encode([]);

        try {
            $jssdk = $app->jssdk->buildConfig(array('updateAppMessageShareData', 'updateTimelineShareData', 'onMenuShareTimeline', 'onMenuShareAppMessage'), $debug = true, $beta = false, $json = false);
        } catch (\Exception $e) {

            var_dump($e->getMessage());die;
        }
        return $jssdk;
//        $this->assign('jssdk',$jssdk);
    }
     public function share()
    {
        $jssdk = $this->jssdk();
        $this->assign('jssdk',$jssdk);
        return $this->fetch('share');
    }