微信浏览器内图片点击放大 获取微信JS-SDK 获取access_token access_token获取不到? 微信获取经纬度并格式化 H5页面微信授权登录 公众号静默授权 状态码 该微信用户未开启“公众号安全助手”的消息接收功能,请先开启后再绑定 模板消息推送 判断是否绑定公众号 initialize报错 - HBuilder使用微信开发者

获取微信JS-SDK

首页 > 前端开发 > 公众号/微信 更新日期:2021-06-19 10:41:11

封装获取access_token函数

// 引入缓存类
use think\facade\Cache;
function getTxToken () {
    # 秘钥
    $appid = '';
    $secret = '';
    /**
     * 如果access_token不存在,则获取token并存入,有效期为7000秒(微信token有效期为7200秒)
     * 有效期失效后,access_token会被清除,此时访问,将重新获取
     */
    if(Cache::get('access_token') == null){
        // 获取accessToken
        $accessTokenUrl = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=$appid&secret=$secret";
            
        //请求地址获取access_token
        $accessTokenJson = file_get_contents($accessTokenUrl);
        $accessTokenObj = json_decode($accessTokenJson);
        Cache::set('access_token', $accessTokenObj->access_token, 7000);
    }
    $token = Cache::get('access_token');
    return $token;
}

根据access_token生成JS-SDK

# 通过token获取微信JS-SDK
public function getJsSdk () {
    # 调用wxjs的网址,由前台传入
    $url = 'https://www.baidu.com';
    $access_token = getTxToken();
    // 获取jsapi_ticket
    $ticketUrl = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=$access_token&type=jsapi";
    $jsapiTicketJson = file_get_contents($ticketUrl);
    $jsapiTicketObj = json_decode($jsapiTicketJson);
    $jsapiTicket = $jsapiTicketObj->ticket;
    
    //随机生成16位字符
    $a = mt_rand(10000000,99999999);
    $b = mt_rand(10000000,99999999);
    $noncestr = $a.$b;
    //时间戳
    $time = time();
    //拼接string1
    $jsapiTicketNew = "jsapi_ticket=$jsapiTicket&noncestr=$noncestr×tamp=$time&url=$url";
    
    //对string1作sha1加密
    $signature = sha1($jsapiTicketNew);
    //存入数据
    $data = [
        'appid' => '',
        'timestamp' => $time,
        'nonceStr' => $noncestr,
        'signature' => $signature,
        'jsapiTicket' => $jsapiTicket,
        'url' => $url
    ];
    return json($data);
}

前端使用

// 引入js
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

Demo,调用微信扫码

$.ajax({
    type: "get",
    url: "/", //自己填写请求地址
    data: {
        url: window.location.href
    },
    success: function (result) {
    // alert(result)
        wx.config({
            // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
            debug: false,
            // 必填,公众号的唯一标识
            appId: result.appid,
            // 必填,生成签名的时间戳
            timestamp: "" + result.timestamp,
            // 必填,生成签名的随机串timestamp
            nonceStr: result.nonceStr,
            // 必填,签名,见附录1
            signature: result.signature,
            // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
            jsApiList: ['checkJsApi', 'scanQRCode']
        });
        wx.error(function (res) {
            //alert("出错了:" + res.errMsg); //这个地方的好处就是wx.config配置错误,会弹出窗口哪里错误,然后根据微信文档查询即可。
        });
        wx.checkJsApi({
            jsApiList: ['scanQRCode'],
            success: function (res) {
                //alert('是否支持'+res.checkResult.scanQRCode)
            }
        });
        //点击按钮扫描二维码
        $("#saoma").click(function () {
            //alert('开始扫码')
            wx.scanQRCode({
                needResult: 1, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
                scanType: ["qrCode"], // 可以指定扫二维码还是一维码,默认二者都有
                success: function (res) {
                    // 扫码结果
                    console.log(res)
                }
            });
        });
    }
})


标题导航