UBNT微信连Wi-Fi

来自深圳捷联讯通科技有限公司
跳转至: 导航搜索

前言

在手机上点选 SSID 后唤起 Portal 页,点击页面上“微信连 Wi-Fi ”按钮进入连接前页,展示公众号 LOGO 和名称,点击“立即连网”按钮后开始连WiFi,连接
成功后跳转到成功连接页,关注商家公众号。
本教程以及提供的源码中使用的是 PHP。
可到UBNT官方网站下载附件预览效果:
http://bbs.ubnt.com.cn/forum.php?mod=viewthread&tid=16148

前提配置

1. 安装 PHP,拥有一套可运行 CGI 的 Portal 服务器,不限于云端或本地。(用于搭建外部portal页面及通过微信API唤醒微信)
2. 安装好 UniFi 控制器,這里将控制器和 Portal 服务器安装在一起,也可以分开安装。(用于搭建无线网络)
3. 拥有或申请微信公众号(推荐服务号)。(用于获取微信API接口)

步骤

第一部分:微信公众平台设置
★条件:
1、拥有微信公众号
2、拥有线下经营场所
微信公众号平台: https://mp.weixin.qq.com/
1. 微信公众平台开通“微信连Wi-Fi”功能插件。
2. 请按照微信的提示,如图完整填写申请“微信连Wi-Fi”服务所需资料,并提交。
1.png
2.png
3. 申请成功之后,点击“+添加设备”按钮。
3.png
4. 选择设备所属门店。如果您已经新建过门店,直接选择对应门店即可。如未创建过门店,点击“新建门店”。
4.png
5. 请按照微信的提示,完整填写申请“创建新门店”所需资料,并提交。(如您已经创建过店铺,该步骤可省略。)
6. 返回“微信连 Wi-Fi”->“设备管理”, 选择设备所属门店,设备类型请选择“Portal 型设备”,接入方式请选择“设备改造后接入”,并填写您的路由器网络
名称(为保证门店下多台设备无缝漫游,设备必须使用相同的无线网络名称和密码),最后点击“添加”即可。
5.png
7. 请将第三方凭证信息保存,用于路由器设置。点击“下一步”,扫描二维码,绑定 Wi-Fi 管理员。设置完成后,可在移动端进行设置。
6.png
至此,微信公众平台设置已经完成。
第二部分:外部 Portal 服务器开发
Tips:外部 Portal 页面 index 必须放在路径为 /guest/s/{站点名}/ 的文件夹下
1.根据UBNT提供的源码demo修改config文件。
*config/unifi.php
7.png
*config/wechat.php
8.png
2. 可以根据需求对外部 Portal 页面进行改造开发。
Portal 页面改造的文件路径为:
9.png
下图是 UBNT 默认的 Portal 页面:
11.png
至此,外部Portal页面的开发已经完成。
第三部分:UniFi Cloud Key 的配置
条件: 使用最新版 Cloud Key 0.5.0 和 UniFi Controller 5.0.7
1. 登录 Cloud Key 配置成静态 IP:
9999.png
9998.png
2. 通过 ssh 工具进入到 Cloud Key,IP 地址即为刚才设置的静态 IP。
3. 修改 /etc/nginx/sites-available/cloudkey-webui 文件,把默认 80 端口修改为 Portal 使用:
9997.png
4. 新增一个 wechat.conf 文件在该目录 /etc/nginx/sites-available ,文件内容为:
9996.png
5. nginx 载入 wechat.conf 文件:
9995.png
6. 安装 php curl 包:
9994.png
7. 下载 wechat 代码并上传至目录 /var/www/ :
9993.png
“wechat” 文件夹在 /var/www 目录下,和 html 文件夹在同一级目录
8. 使 unifi_cookie 文件可写权限:
Ub1.png
至此,Cloud Key 部分已经完成。
第四部分:UniFi Controller 的设置
1. 进入 Controller 管理AP后打开设置选项 —> 设置来宾政策
—> 启用来宾 Portal
—> 外部 Portal 服务器
—> 填写 IP 地址(此处 IP 是第三部分中提到的外部 portal 服务器地址)。
Ub2.png
2. 新建 SSID,需注意此 SSID 与微信公众平台中设置的 SSID 一致。(用于门店多台设备下的无缝漫游)。
Ub3.png
加密方式:OPEN
来宾策略:勾选套用来宾策略
至此,UniFi Controller 设置已经完成,请进行外部 Portal 页面的开发。

最终效果:

Ub4.png