微信公众号开发——微信JSSDK使用

自媒体运营教程 2023-04-27 301 0

微信JSSDK介绍

官方文档地址：

因为微信公众号的开通对于大部分开发人员来说还是一个稍高的门槛，所以，微信搞了一个微信测试号，开发人员使用微信扫一下就可以获取。测试号貌似是全接口调用的哦！不用担心没有权限调用。
申请入口：

相关影片资源迅雷下载推荐
小白如何用自己电脑搭建微信号公众号的服务器？
有python半年的编程经验，接触过mysql数据库，想做公众号又不想花钱买服务器，所以想自己搭建一个，谢谢大佬给教程
公众号开发,小白如何用自己电脑搭建微信号公众号的服务器？

开发配置

所有配置参考下图配置即可

在配置时，需要注意几点

接口配置信息中，要配合系统后台，我的系统是thinkPHP5，下面是我的代码

// 下面代码放在controller中，token是你的访问入口
// 例：https://www.whongbin.cn/wechat/index/token
public function token()
{
$echoStr = $_GET["echostr"];
if ($this->checkSignature()){
echo $echoStr;
exit;
}
}

/**
* 用于验证是否是微信服务器发来的消息
* @return bool
*/
private function checkSignature()
{
$signature = $_GET["signature"];
$timestamp = $_GET["timestamp"];
$nonce = $_GET["nonce"];

$token = 'whongbin';
$tmpArr = array($token, $timestamp, $nonce);
sort($tmpArr);
$tmpStr = implode($tmpArr);
$tmpStr = sha1($tmpStr);

if ($tmpStr == $signature){
return true;
}else {
return false;
}
}

配置JS接口安全域名时，注意是 域名 不需要填写http/https，如果填写的话，在代码执行wx.config()时，会报 config:fail,Error: invalid url domain 错误，正确示例：www.whongbin.cn

微信JSSDK使用

在需要调用JS接口的页面引入如下JS文件，（支持https）：http://res.wx.qq.com/open/js/jweixin-1.4.0.js
jssdk的签名权限,这个权限是由后台提供的,前端只需要把签名权限注入到wx.config中就可以了,这里也提供下jssdk的下载地址http://demo.open.weixin.qq.com/jssdk/sample.zip，SDK中有demo

wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
APPId: '', // 必填，公众号的唯一标识
timestamp: , // 必填，生成签名的时间戳
nonceStr: '', // 必填，生成签名的随机串
signature: '',// 必填，签名
jsApiList: ['openLocation'] // 必填，需要使用的JS接口列表这里填写需要用到的微信api openlocation为使用微信内置地图查看位置接口
});原文链接：https://www.whongbin.com/archives/313.html原文链接：https://www.whongbin.com/archives/313.html
wx.ready(function () {
wx.checkJsApi({
jsApiList: ['checkJsApi','openLocation'],
success: function (res) {}
});
});
wx.error(function(res){
console.log(res);
});

这里需要注意的地方debug在上线后要改为false,jsApiList里要填你要使用的接口,不然没有作用

给导航按钮注册点击事件,调用wx.openLocation方法，注意：因为这块是需要用户触发的，所以不必放在wx.ready()方法中，若需要页面加载时就执行的话，如分享接口，就必须放在wx.ready()方法中执行

$('.btn2').click(function () {
wx.openLocation({
latitude: 22.545538, // 纬度，浮点数，范围为90 ~ -90。如果是动态获取的数据，使用parseFloat()处理数据
longitude: 114.054565, // 经度，浮点数，范围为180 ~ -180。如果是动态获取的数据，使用parseFloat()处理数据；
name: '这里填写位置名', // 位置名
address: '位置名的详情说明', // 地址详情说明
scale: 10, // 地图缩放级别,整形值,范围从1~28。默认为最大
});
})

原文链接：简书

相关影片资源迅雷下载推荐
云开发山楂岛树洞留言小程序进阶版带审核机制编写教程及源码 ...
山楂岛留言小程序之前也是火了一段时间，经常在抖音上出现，吸引流量无数，但是人红是非多，小程序也是很快被举报用户攻陷，惨遭下架。博主对这款小程序也是慕名已久，虽然本身在运营着一款树洞留言小程序，但是热度 ...
小程序开发,云开发山楂岛树洞留言小程序进阶版带审核机制编写教程及源码 ...

企业网站建设与开发最低只要299元起，包含域名服务器，需要的联系QQ345424724，电话15516990022,18530226930

标签：公众号开发微信公众号开发——微信JSSDK使用