为了方便快捷的实现蓝牙 BLE 数据的收集,想到使用 web Bluetooth 来解决设备端的问题。安卓的高版本浏览器支持通过前端代码访问蓝牙设备,iOS 可以通过安装特定浏览器支持。Web Bluetooth 为了安全性考虑强制要求必须通过 HTTPS 协议加载,所以本地开发必须配置 HTTPS 证书。

Windows 系统下配置步骤如下:

  • 使用 choco 安装必备的工具

choco install -y nginx mkcert

  • 使用 admin 权限打开记事本

    • 编辑 c:\windows\system32\drivers\etc 目录下的 hosts 文件

新增 127.0.0.1 web-ble.local

- 编辑 c:\tools\nginx\conf\nginx.conf 文件

在 http .server 层级下新增服务


    # HTTPS server
    #
    server {
       listen       80;
       server_name  web-ble.local;

    #    ssl_certificate      cert.pem;
    #    ssl_certificate_key  cert.key;

    #    ssl_session_cache    shared:SSL:1m;
    #    ssl_session_timeout  5m;

    #    ssl_ciphers  HIGH:!aNULL:!MD5;
    #    ssl_prefer_server_ciphers  on;

       location / {
           root   web-ble;
           index  index.html index.htm;
       }
    }

同时在 nginx 目录下新建 web-ble 的目录。然后使用 nssm restart nginx 重启 nginx。打开浏览器使用 http://web-ble.local/ 即可访问目录下的代码。

  • 配置 https 证书

使用管理员权限的 powershell 窗口执行:

mkcert web-ble.local 127.0.0.1 ::1

得到两个文件,其中一个是 .key 后缀名。将这个两个文件放到 nginx 的 conf/certs 文件夹下。
编辑 conf/nginx.conf 文件,改成这样:


    # HTTPS server
    #
    server {
       listen       80;
       listen       443 ssl;
       server_name  web-ble.local;

       ssl_certificate_key      certs/web-ble.local+2-key.pem;
       ssl_certificate  certs/web-ble.local+2.pem;

       ssl_session_cache    shared:SSL:1m;
       ssl_session_timeout  5m;

       ssl_ciphers  HIGH:!aNULL:!MD5;
       ssl_prefer_server_ciphers  on;

       location / {
           root   web-ble;
           index  index.html index.htm;
       }
    }
  • 重启 nginx,用浏览器验证效果

nssm restart nginx


Airy
2.4k 声望69 粉丝

github.com/airylinus