使用H5页面基于WebSockets访问MQTT

        这里使用mosquitto来搭建mqtt服务，并提供websockets能力，另外使用nginx代理，支持http、https通过域名访问mqtt，访问mqtt的客户端使用h5开发，可在浏览器运行。

可参考 MQTT：用Mosquitto搭建轻量级的设备接入网关_活力行动的博客-CSDN博客 搭建支持websockets的MQTT服务

配置Nginx

Nginx的配置如下，特别的注意location的配置，

map $http_upgrade $connection_upgrade{
    default upgrade;
    '' close;
}

server
{
        listen 80;
        listen 443 ssl;

        ssl_certificate /etc/nginx/conf.d/www.domain.com/server.crt;
        ssl_certificate_key /etc/nginx/conf.d/www.domain.com/server.key;
        ssl_password_file /etc/nginx/conf.d/www.domain.com/pwd.txt;

        server_name www.domain.com;

        location /mqtt {
            proxy_pass http://172.16.0.12:9001/mqtt/;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection $connection_upgrade;
        }

}

测试通讯

用手机打开这里的测试页面，然后再用电脑打开这里的测试页面，将client修改下，看两者可否进行通讯。特别的在http下注意取消ssl的选择