微信公众号开发之如何使用JSSDK

JavaScript023

微信公众号开发之如何使用JSSDK,第1张

微信开发交流群:148540125

欢迎留言、转发、打赏

系列文章参考地址 极速开发微信公众号

项目源码参考地址 点我点我--欢迎Start

服务号、订阅号可以通过登录 微信公众平台 查看 开发>接口权限

使用JSSDK主要包括

1、判断当前客户端版本是否支持指定JS接口、

2、分享接口(微信认证)

3、图像接口

4、音频接口

5、智能接口(识别语音并返回结果)

6、设备信息(获取网络状态)

7、地理位置

8、界面操作

9、微信扫一扫

10、微信小店(服务号必须通过微信认证)

11、微信卡券 (微信认证)

12、微信支付(服务号必须通过微信认证)

官方参考文档

步骤一:绑定域名

先登录微信公众平台进入 公众号设置 的 功能设置 里填写 JS接口安全域名 。

步骤二:引入JS文件

在需要调用JS接口的页面引入如下JS文件,(支持https): http://res.wx.qq.com/open/js/jweixin-1.0.0.js

如需使用摇一摇周边功能,请引入 http://res.wx.qq.com/open/js/jweixin-1.1.0.js

备注:支持使用 AMD/CMD 标准模块加载方法加载

步骤三:通过config接口注入权限验证配置

签名算法生成规则

请 官方参考文档

下面具体来讲讲 开源项目 weixin_guide 中的封装。

使用的时候只要在Controller方法上添加一个拦截器 JSSDKInterceptor 来实现签名验证再将 wx.config 需要的参数设置对应的属性在页面上进行获取。

拦截器实现如下:

在Controller中使用

JSP页面上面使用

测试结果

在AppConfig 中添加路由 me.add("/jssdk", JSSDKController.class,"/view")手机中访问 http://域名[/项目名称]/jssdk ,如果设置了 debug= true 成功了就会弹出

如果出现 {"errorMsg":"config:invalid url domian"} 请检查 步骤一:绑定域名 与你访问的域名是否在安全域名列表当中

步骤四:通过ready接口处理成功验证

步骤五:通过error接口处理失败验证

步骤六:接口调用

拦截器具体实现 参考地址 点这里

js 接口调用参考地址 点这里

以上就是JSSDK使用的介绍。

欢迎留言、转发、打赏项目

源码参考地址 点我点我--欢迎Start

微信二次开发首先要说的是,微信开发者工具,它不是我们写代码的IDE,它的作用只是一个调试工具,供我们调试,查看,我们程序中调用微信本身提供的js-sdk时候产生的信息或者错误提示。

如何把代码放到微信开发工具中查看。有两种方式,第一种是本地起一个服务,产生一个localhost:xxx的地址,我们把这个地址直接扔在微信开发工具上访问就可以调试了,这个如果我们使用angular,react,vue这些前端框架写的话,一般会用到webpack,或者gulp,grent都会产生一个本地运行环境。这个我们不用管,如果我们是用纯html+jquery写的,可以单独再使用gulp或者webpack,启动一个本地服务.第二种是,直接部署服务器,使用部署之后的地址。

开发微信公众号步骤如下:

1、注册公众号,并进行微信认证。

2、配置相关的操作,点击左侧公众号设置菜单,点击主页面的功能设置,配置业务域名,JS接口安全域名,网页授权域名配置到自己的应用所在网址,点击左侧的基本配置,把自己的服务器IP加入到白名单。

3、开始开发,具体开发需要一些原型设计、ui设计、程序员开发测试等流程。