JAVA开发微信 AIRKISS 一键WIFI功能（测试账户）

最近使用JAVA开发微信的AIRKISS功能，因为没有经验参考了比较多的网站，其中受益比较多的除了微信官方网站外，特别感谢以下几位大神的经验分享。

https://blog.csdn.net/jrainbow/article/details/50509162

http://www.shaoguoji.cn/2017/01/28/ESP8266-wechat-onekey-config-2/

接下来进行步骤讲解：

目前发现微信的两种一键WIFI方式，一种是二维码扫码，扫码开发不需要平台代码，只需要在公众号进行设备注册即可，具体步骤参考下面（第三步）；第二种就是使用js-sdk的方式进行认证以及配置界面调用的方式。

一、java 关于 js-sdk开发需要的工具：eclipse、tomcat/jetty(我用的maven插件jetty)、ngrok(内网映射工具非常好用，微信公众号开发需要外网网址，下载地址：https://ngrok.com/download)、微信web开发者工具（用于测试传入参数等是否正常，手机测试日志查看不方便，下载地址，微信公众号登陆后，参考下面图片进行下载）

     

二、账户申请：

1、在微信账户申请一个公众号，主要用于公众测试平台下载，如果只是用于测试  公众号不需要认证。

2、申请微信测试账户，点击 微信测试账户申请网址  使用手机微信扫一扫即可获得测试账户。

三、 二维码扫码开发：

 1、首先需要有一个测试账户，打开测试账户页面，在下面的 体验接口权限表  中找到  “设备功能接口” 点击 “开启”，开启后如下图：

2、点击“设置”按钮进入 设备功能 页面，添加产品：

 

3、设备添加完成后，点击产品详情。

4、产品授权，设备授权官网参考地址为：设备授权官方网址    ，具体代码可以参考 博客 最后上传的代码中mas.tool.Tools 中的main方法，填写参数即可授权。

四、JS-SDK  开发流程（JAVA相关代码） ，开发之前也需要进行第三部，添加设备部分，如果之前已经存在测试设备，则不需要。 

1、使用eclipse开发JAVA相关代码，使用maven自带插件  jetty  启动，具体代码看第五步。

2、使用ngrok 进行外网映射，打开cmd窗口，输入ngrok http 8088  然后回车。 (注意：我的项目映射端口为8088)

映射地址：http://3cb397cd.ngrok.io/

4、在 微信测试账号 首页配置JS接口安全域名

5、添加测试微信公众号按钮，点击添加地址：  微信官方地址 ，首先需要获得token值，获取方法如下图1，然后通过token值，添加按钮方法如图2。

（一）获得token值：

（二）创建菜单：

{ "button": [ { "type": "view", "name": "测试", "url": "http://3cb397cd.ngrok.io/airkiss" } ] }

6、扫描关注 微信测试账号  首页的测试号二维码，即可看到按钮效果，点击按钮，即可跳转微信自带的一键WIFI页面。

属性配置调用成功后，进入AIRKISS页面。WiFi密码并确定，微信会把周围的硬件设备配置到同一网络。

五、功能代码：

首先需要多看  JS-SDK说明文档  ，JSAPI说明。

1、在需要调用JS接口的页面引入如下JS文件，（支持https）：http://res.wx.qq.com/open/js/jweixin-1.2.0.js

2、通过config接口注入权限验证配置,签名算法等参考 JS-SDK说明文档 附录部分  。

wx.config({
    beta : true, // 开启内测接口调用，注入wx.invoke方法
    debug: false, // 开启调试模式，关闭
    appId: '', // 必填，公众号的唯一标识
    timestamp: , // 必填，生成签名的时间戳
    nonceStr: '', // 必填，生成签名的随机串
    signature: '',// 必填，签名
    jsApiList:  [ 'configWXDeviceWiFi' ] // 需要使用的jsapi列表
});

3、检查浏览器是否支持configWXDeviceWiFi接口，并使用此接口。

wx.ready(function() {
     wx.checkJsApi({
	jsApiList : [ 'configWXDeviceWiFi' ],
	    success : function(res) {
		wx.invoke('configWXDeviceWiFi',{},
			function(res) {
				var err_msg = res.err_msg;
				if (err_msg == 'configWXDeviceWiFi:ok') {
				    $('#message').html("配置 WIFI成功 OK啦");
					return;
				    } else {
					 $('#message').html("配置 WIFI失败");
				    }
				});
			}
		});
});

4、config  需要的参数具体实现，需要后台进行传值，具体实现可查阅上传demo.

5、开发完毕后可以使用  微信web开发这工具进行测试，测试成功后即可在手机公众号进行测试，如下：

我的CSDN代码下载：https://download.csdn.net/download/maizang52/10334002