微信小程序扫码连接wifi功能

一、需求

店铺出示二维码，用户扫码之后自动连接店铺wifi而后跳转至我们小程序首页

二、准备工作

1、小程序appid：
微信小程序的appid获取地址：https://mp.weixin.qq.com/wxamp/basicprofile/index，设置页面拉到最下面。
2、小程序appKey：
密钥获取地址：打开微信公众平台官网, 扫码登录，左侧菜单【开发 -> 开发管理】，点击tab【开发设置】。

三、开发

保存wifi信息

首先需要存储wifi的信息至数据库（信息包含：wifi账号、wifi密码）。

生成微信小程序二维码

注：为什么使用微信生成的二维码呢？由于我们需要连接二维码后跳转至我们的微信小程序中，普通的二维码写入路径后，也只能跳转到网页，不能跳转到小程序

1、主体方法

   public void getWeiXinQR() throws Exception {
        Map<String, Object> params = getParaJsonMap(1);
        try {
        	//存储wifi的信息表
            Record byId = Db.findById("of_shop_members_new_wifi_record", "member_id", params.get("member_id").toString());
            if(byId == null){
                rendFailedJson("用户未上传wifi信息");
            }
            //小程序id
            String appId = ToolUtils.getParam(100);
            //小程序密钥
            String appKey = ToolUtils.getParam(101);
            //接口调用凭证
            String accessToken = ToolUtils.postToken(appId, appKey);
            //本地生成二维码路径
            String filePath = ToolUtils.getParam(102)+params.get("member_id").toString()+".jpg";
            //当前小程序相对页面 必须是已经发布的小程序存在的页面（否则报错），例如 pages/index/index, 根路径前不要填加 /,不能携带参数（参数请放在scene字段里），如果不填写这个字段，默认跳主页面
            String page = ToolUtils.getParam(103);
            //最大32个可见字符，只支持数字，大小写英文以及部分特殊字符：!#$&'()*+,/:;=?@-._~，其它字符请自行编码为合法字符（因不支持%，中文无法使用 urlencode 处理，请使用其他编码方式）
            //二维码中存储wifi信息表的id，以供前端扫码获取信息
            String scene = byId.get("id").toString();
            //打开小程序版本：正式版为 "release"，体验版为 "trial"，开发版为 "develop"。默认是正式版。
            String env_version = ToolUtils.getParam(123);
            //wifi二维码
            String s = ToolUtils.generateQrCode(filePath, page, scene, accessToken, env_version);
            //将wifi的二维码路径存储到信息表中
            byId.set("wifi_url",s);
            Db.update("of_shop_members_new_wifi_record",byId);
        }catch (Exception e){
            e.printStackTrace();
        }
    }
            

2、接口调用凭证

    /**
     * 接口调用凭证 access_token
     */
    public static String postToken(String appId, String appKey) throws Exception {

        String requestUrl = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=" + appId + "&secret=" + appKey;
        URL url = new URL(requestUrl);
        // 打开和URL之间的连接
        HttpURLConnection connection = (HttpURLConnection) url.openConnection();
        connection.setRequestMethod("POST");
        // 设置通用的请求属性
        connection.setRequestProperty("Content-Type", "application/json");
        connection.setRequestProperty("Connection", "Keep-Alive");
        connection.setUseCaches(false);
        connection.setDoOutput(true);
        connection.setDoInput(true);

        // 得到请求的输出流对象
        DataOutputStream out = new DataOutputStream(connection.getOutputStream());
        out.writeBytes("");
        out.flush();
        out.close();

        // 建立实际的连接
        connection.connect();
        // 定义 BufferedReader输入流来读取URL的响应
        BufferedReader in;
        if (requestUrl.contains("nlp"))
            in = new BufferedReader(new InputStreamReader(connection.getInputStream(), "GBK"));
        else
            in = new BufferedReader(new InputStreamReader(connection.getInputStream(), "UTF-8"));
        StringBuilder result = new StringBuilder();
        String getLine;
        while ((getLine = in.readLine()) != null) {
            result.append(getLine);
        }
        in.close();
        JSONObject jsonObject = JSONObject.parseObject(result.toString());
        return jsonObject.getString("access_token");
    }

3、生成微信小程序二维码

/**
     * 生成微信小程序二维码
     *
     * @param filePath
     *         本地生成二维码路径
     * @param page
     *         当前小程序相对页面 必须是已经发布的小程序存在的页面（否则报错），例如 pages/index/index, 根路径前不要填加 /,不能携带参数（参数请放在scene字段里），如果不填写这个字段，默认跳主页面
     * @param scene
     *         最大32个可见字符，只支持数字，大小写英文以及部分特殊字符：!#$&'()*+,/:;=?@-._~，其它字符请自行编码为合法字符（因不支持%，中文无法使用 urlencode 处理，请使用其他编码方式）
     * @param accessToken
     *         接口调用凭证
     */
    public static String generateQrCode(String filePath, String page, String scene, String accessToken,String env_version) throws Exception {

        try {

            //调用微信接口生成二维码
            URL url = new URL("https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=" + accessToken);
            HttpURLConnection httpURLConnection = (HttpURLConnection) url.openConnection();
            httpURLConnection.setRequestMethod("POST");// 提交模式
            // conn.setConnectTimeout(10000);//连接超时 单位毫秒
            // conn.setReadTimeout(2000);//读取超时 单位毫秒
            // 发送POST请求必须设置如下两行
            httpURLConnection.setDoOutput(true);
            httpURLConnection.setDoInput(true);
            // 获取URLConnection对象对应的输出流
            PrintWriter printWriter = new PrintWriter(httpURLConnection.getOutputStream());
            // 发送请求参数
            JSONObject paramJson = new JSONObject();
            //这就是你二维码里携带的参数 String型  名称不可变
            paramJson.put("scene", scene);
            //注意该接口传入的是page而不是path
            paramJson.put("page", page);
            //这是设置扫描二维码后跳转的页面
            paramJson.put("width", 200);
            paramJson.put("is_hyaline", true);
            paramJson.put("auto_color", true);

            paramJson.put("env_version", env_version);

            printWriter.write(paramJson.toString());
            // flush输出流的缓冲
            printWriter.flush();

            //开始获取数据
            BufferedInputStream bis = new BufferedInputStream(httpURLConnection.getInputStream());
            OutputStream os = new FileOutputStream(new File(filePath));
            int len;
            byte[] arr = new byte[1024];
            while ((len = bis.read(arr)) != -1) {
                os.write(arr, 0, len);
                os.flush();
            }
            os.close();
        } catch (Exception e) {
            e.printStackTrace();
        }
        String s = saveQrcode(filePath);
        System.out.println("打开地址查看生成的二维码：" + filePath);
        return saveQrcode(filePath);

    }

4、存储oss

    //保存oss
    public static String saveQrcode(String filePath) throws Exception {
        // Endpoint填写为https://oss-cn-chengdu.aliyuncs.com。
        String endpoint = "https://oss-cn-beijing.aliyuncs.com";
        // 阿里云账号AccessKey拥有所有API的访问权限，风险很高。强烈建议您创建并使用RAM用户进行API访问或日常运维，请登录RAM控制台创建RAM用户。
        String accessKeyId = "****";
        String accessKeySecret = "**********";
        // 创建OSSClient实例。
        OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret);
        //路径地址
        String objectname = "file/" + System.currentTimeMillis() + "/demo/";
        // 填写本地文件的完整路径。如果未指定本地路径，则默认从示例程序所属项目对应本地路径中上传文件流。
        InputStream inputStream = new FileInputStream(filePath);
        //调用oss实现上传第一个参数bucket名称  第二个参数文件名称  第三个参数输入流

        String url = objectname + "backiee-230432.jpg";
        //oss库名称
        ossClient.putObject("angel-shop", url, inputStream);
        // 关闭OSSClient。
        ossClient.shutdown();
        //返回组成的文件url
        String photoUrl = "https://" + "*******." + "oss-cn-beijing.aliyuncs.com" + "/" + url;
        System.out.println(photoUrl);
        return photoUrl;
    }

前端调用

1、根据扫码的结果，获取wifi的信息
2、初始化wifi模块
官方文档：
https://developers.weixin.qq.com/miniprogram/dev/api/device/wifi/wx.startWifi.html

startWifi(_this) {
	wx.startWifi({
	  success: function (res) {
		console.log("初始化成功，这里要写连接模块")
	  },
	  fail: function (res) {
		  console.log("wifi启动失败")
		_this.startError=res.errMsg;
	  }
	})
  }

3、连接wifi的代码实现
官方文档：https://developers.weixin.qq.com/miniprogram/dev/api/device/wifi/wx.connectWifi.html

connectWifi(_this){
	wx.connectWifi({
	  SSID: _this.SSID,
	  password: _this.password,
	  success (res) {
	    console.log("wifi连接成功")
	  },
	  fail: function (res) {
		console.log("wifi连接失败")
		_this.startError=res.errMsg;
	  }
	})
}