微信小程序使用mqtt连接及配置nginx的wss

原生小程序开发中需求使用mqtt进行即使通讯，下面介绍小程序中使用mqttjs 进行网络通讯连接 在华为云中部署nginx使用https/wss方式连接Apache-activemq。

1、云服务域名

1、在云服务中部署项目首先要有个域名，domain 映射到云服务机子的ip,这样访问http://domaintest 才会访问到 部署服务的机子。

2、部署mqtt 服务

​ 官网下载地址：http://activemq.apache.org/activemq-5140-release.html

​ 下载 linux 版：apache-activemq-5.15.10-bin.tar.gz

2.1 部署mqtt 服务

​ 1、gz文件拷贝到linux目录

​ 2、解压启动

​ 解压 tar -zxvf apache-activemq-5.14.0-bin.tar.gz

​ 进入apache-activemq-5.15.10/bin 目录 启动服务 ./activemq start

​ 启动完成 打开管理界面 http://ip:8161/admin 默认用户名密码 admin/admin，在管理界面中可看到服务中有哪些topic/subscriber 相关信息。

​ 3.mqtt配置文件

​ 在conf 目录下的 activemq.xml 文件中可以 查看tcp/amqp/stomp/mqtt/ws等的mqtt 连接地址端口

<transportConnectors>
            <transportConnector name="openwire" uri="tcp://0.0.0.0:61616?maximumConnections=1000&wireFormat.maxFrameSize=104857600"/>
            <transportConnector name="amqp" uri="amqp://0.0.0.0:5672?maximumConnections=1000&wireFormat.maxFrameSize=104857600"/>
            <transportConnector name="stomp" uri="stomp://0.0.0.0:61613?maximumConnections=1000&wireFormat.maxFrameSize=104857600"/>
            <transportConnector name="mqtt" uri="mqtt://0.0.0.0:1883?maximumConnections=1000&wireFormat.maxFrameSize=104857600"/>
   <transportConnector name="ws" uri="ws://0.0.0.0:61614?		maximumConnections=1000&wireFormat.maxFrameSize=104857600"/>
transportConnectors>

​ 4.测试部署

这里使用node.js 进行测试。node server.js /client.js

连接mqtt的端口地址根据mqtt的配置文件选择

server端发布
var mqtt = require('mqtt')//nodejs 中导入mqtt包
var client  = mqtt.connect('mqtt://domaintest:1883')
client.publish('test1', '{"message":"message1"}')

client端接收messages
var mqtt = require('mqtt')
var client  = mqtt.connect('mqtt://domaintest:1883')
client.on('connect', function () {
	// 订阅发布的主题test1
  client.subscribe('test1', function (err) {
  })
})
client.on('message', function (topic, message) {
  // message is Buffer
  console.log(message.toString())
  client.end()
})

3.部署nginx 及配置https

3.1 nginx的部署

​ 1、ubuntu 下 命令安装 apt install nginx

​ 安装完成后位置 /etc/nginx

​ 2、启动命令 systemctl start nginx.service/systemctl start nginx

​ 设置开机自启动 systemctl enable nginx.service

​ 停止服务命令 systemctl stop nginx.service/nginx

3.2 nginx的配置

​ 这里配置主要配置为/etc/nginx/nginx.conf 文件

这里配置位置为
http{}中配置 server,这里可以配置多个server[http、https],一个server中也可以监听多个端口
http {
	#http server
	server { 
		listen 8080;   
    	server_name  domaintest;
	    location /mqtt {
	        proxy_set_header Host $http_host;
			proxy_pass http://localhost:61614;
		    proxy_http_version 1.1;
			proxy_read_timeout 300s; # 默认是60秒，可设置
	    }   
	}
    
    #https server 需要配置htts的证书 ，想强制跳转https，只监听443端口
	server {
		listen 443 ssl;#https默认监听443端口 
		ssl on;
	    ssl_certificate /etc/letsencrypt/live/domaintest/fullchain.pem;  #配置证书 
	    ssl_certificate_key /etc/letsencrypt/live/domaintest/privkey.pem; #配置证书
	    ssl_session_timeout 5m;
	    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
	    ssl_ciphers ECDH:AESGCM:HIGH:!RC4:!DH:!MD5:!aNULL:!eNULL;
	    ssl_prefer_server_ciphers on;	
	    
	    listen       61615;
    	server_name  domaintest; #配置服务域名
    	#访问地址对应http://domain:ip/mqtt
	    location /mqtt {
	        proxy_set_header Host $http_host;
			proxy_pass http://localhost:61614; #服务端部署的服务访问路径（mqtt中的配置路径）
		    proxy_http_version 1.1;
			proxy_set_header X-Client-IP $remote_addr;
			proxy_set_header Upgrade $http_upgrade;
			proxy_set_header Connection "upgrade";
			proxy_read_timeout 300s; # 默认是60秒，可设置
	    }   
	}
    
}

3.3 生成域名domaintest的证书

通过Certbot获取免费https证书，为网站配置https访问

安装
wget https://dl.eff.org/certbot-auto

授权
chmod a+x certbot-auto
    
为域名生成证书 主要这时将nginx服务停止
./certbot-auto certonly --standalone -d  domiantest   #domiantest为你想要配置https的域名
或./certbot-auto certonly --standalone --email xxxmail@qq.com --agree-tos -d domiantest
安装提示进行操作生成证书

生成后查看证书命令及证书位置
ls /etc/letsencrypt/live/ 将证书配置到https的server中
    
注意免费申请的证书时效只有90天，我们需要设置自动更新的功能，帮我们自动更新证书的时效。

crontab -e    #编辑crontab
添加脚本
30 2 * * 1 安装目录/certbot-auto renew --pre-hook "systemctl stop nginx" --post-hook "systemctl start nginx" >> /安装目录/le-renew.log 2>&1 &

4、原生微信小程序中配置mqtt连接

这里我们首先需要将mqtt.js文件下载保持到项目中。

https://unpkg.com/[email protected]/dist/mqtt.min.js 复制保存文件为mqtt2.18.8.min.js。

在项目中使用

var mqtt = require('../../utils/mqtt2.18.8.min.js')
/**小程序中只能用wxs://开头请求地址
* 在调试时可以在项目开发工具 中 详情->本地设置-> 勾选 不校验合法域名，这样可以方便调试。
* 当进行域名合法性校验时，下面domaintest域名必须是该小程序对应appID的账号下的开发中配置的域名，这样才不 * 会出现 不合法的域名不在服务中
*/
var client = mqtt.connect('wxs://domaintest/mqtt', {
  clientId: "clientUserId"
});
Page({
  data: {
    "exectors": []
  },
  initMqtt: function () {  
    client.on('connect', function () {
      console.log('连接成功');
      //订阅
      client.subscribe('test1');
    })
	// 接收消息
    client.on('message', function (topic, payload) {
      console.log(payload)
    })
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    this.initMqtt()
  },
  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    // 关闭连接
    client.end();
  },
  onPub:function(){
    client.publish("test2", "返回");
  } 
})

注意：
当进行域名合法性校验时，下面domaintest域名必须是该小程序对应appID的账号下的开发中配置的域名，这样才不会出现不合法的域名不在服务中的错误。