开发自动连接wifi的小程序

场景：很多公共场所，如酒店，书店都会提供免费的wifi，但又不可能把wifi密码告诉你，通过小程序扫码连接wifi是个很不错的体验。

一、注册小程序
在微信公众号平台（https://mp.weixin.qq.com）注册一个小程序。
注册小程序需要个人身份认证或者企业认证。

二、下载开发工具
在微信官网（https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html）下载开发者工具。
有很多版本可供选择，我一般会选择最近的稳定版本。安装完成后打开“微信web开发者工具”。

用你的微信扫码登录。

选择小程序项目

填写你注册的小程序参数，确实并创建项目。

三、编写代码
小程序的网页由html模板（.wxml），样式（.wxss）、功能（.js）、数据（.json）等组成。默认首页是index.
我们在index.wxml里添加一个按钮用来触发扫码事件

<!--index.wxml-->
<view class="container">
<view class="usermotto">
  <button bindtap="connectWifi">扫码连接联华Wifi</button>
</view>
</view>

在index.js里添加扫码并连接wifi的功能

//index.js
//获取应用实例
const app = getApp()
var param_ssid="";
var param_pwd="";
var _this;

Page({
  onLoad:function(){
    _this = this;
  },
  //事件处理函数
  bindViewTap: function() {
    wx.navigateTo({
      url: '../logs/logs'
    })
  },
  connectWifi:function(){
    wx.scanCode({ //扫码，识别出SSID和Password
      onlyFromCamera: true, 
      scanType: 'qrCode',
      success:function(res){
        param_ssid=res.result.toString().split('|')[0];
        param_pwd = res.result.toString().split('|')[1];
        wx.startWifi({ //启动wifi
          success:function(res2){
            _this.connect();
          }
        });
      }
    });
  },
  connect:function(){
    wx.connectWifi({
      SSID: param_ssid,
      BSSID: param_ssid,
      password: param_pwd,
      success: function () {
        wx.showToast({
          title: '连接成功！',
          duration: 3000
        });
      },
      fail: function () {
        wx.showToast({
          title: '连接失败！',
          duration: 3000
        });
      }
    });        
  }
})

上面的ssid和pwd被我制作成了一个二维码，通过小程序扫码能够获取。程序自动填入这些参数，连接wifi。

四、发布小程序
做好的小程序，需要上传发布，审核通过了才能正常使用。点击菜单的“工具”-> “上传”。

填写版本号和备注信息，点击上传。
打开微信公众平台｜小程序，进入版本管理，可以看到刚才上传的版本，此时是“开发版”。点击“提交审核”，审核通过后，才能成为“线上版本”。如下所示：

五、注意事项
小程序相对于原生的app来说，缺点还是很明显的。因为小程序是基于微信平台的，也就是天生就有个框架限制。比如上面的打开wifi这个功能，返回结果是成功的，但实际手机上的wifi并没有打开，这应该是权限的问题。需要人工开启wifi，然后扫码连接。

源码下载

开发自动连接wifi的小程序

发表评论