AIcainiao 发表于 2019-7-15 16:47:42

机智云小程序启蒙:WebSocket网页控制

概述
机智云Web版的JS远程控制设备,是调用了机智云开放的Open API和WebSocket API来实现的。这个是设计小程序最好的基础,也可以使无安卓设备的用户用网页远程控制设备。

详细
前言机智云Web版的JS远程控制设备,是调用了机智云开放的Open API和WebSocket API来实现的。这个是设计小程序最好的基础,也可以使无安卓设备的用户用网页远程控制设备。其中,Open API用到的接口有匿名登录用户、绑定设备和获取绑定设备列表。而WebSocket API上的用户登陆、设备上线下线通知、浏览器与云端的数据交互(数据透传)、心跳和非法消息通知。
具体的流程图如下:
http://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562816811046088616.png一、准备工作获取需要调用OPEN API匿名登录用户和绑定设备1.获取phone_idphone_id 可以是手机的唯一识别码,简单来说就是自己的注册名,自己随意取,支持英文大小写、数字、特殊符号,中文格式我没测试过。2.创建用户http://swagger.gizwits.com/doc/index/openapi_apps#/用户管理/post_app_users2.1.填写appidhttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817083604055785.jpg2.2.填写bodyhttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817101776094763.jpg2.3.登录匿名用户,获取tokenhttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817120685040984.jpg3.绑定设备POST请求链接:
http://swagger.gizwits.com/doc/index/openapi_apps#/绑定管理/post_app_bind_mac3.1.填写appidhttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817140963037794.jpg3.2.填写刚才自己命名的iphone_id登录回调的tokenhttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817179061047646.jpg3.3.填写Timestamp、Signature和bodyhttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817191990074357.jpg时间戳计算链接,http://tool.chinaz.com/Tools/unixtime.aspxhttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817224596079130.jpgMD5计算链接,http://tool.oschina.net/encrypt?type=2如下图:http://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817399113028959.jpg二、网页控制界面1.websocket API封装起来的sdk链接如下:
https://github.com/gizwits/gizwits-wechat-js-sdk2.运行index.htmlhttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817536509078999.jpg3.Websocket网页控制界面http://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562817592480091717.jpg下面使用的参数有:

参数说明数值
apiHost机智云OpenApi域名api.gizwits.com
commType标准数据点协议格式attrs_v4
wechatOpenId微信用户OpenID(就是手机的iPhone_id)String
gizwitsAppId机智云平台应用标识String
核心代码:
http://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562819389315036604.jpghttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562819400399058763.jpghttp://www.demodashi.com/ueditor/jsp/upload/image/20190711/1562819411329091041.jpg三、补充
[*]下载的文件包是我精心改良的网页版,机智云官网有原版:https://github.com/gizwits/gizwits-wechat-js-sdk
[*]本次测试是用了虚拟设备,mac为“virtual:site”
[*]重点:经过本人测试,网页版绑定实际设备,除了第一部安卓手机app绑定设备,获得主权限,不能立马分享给其他用户,需要先网页版自动绑定,然后才可以分享给其他有安卓手机app的用户,这就是app与网页版的用户绑定的顺序 不一样
源码:http://www.demodashi.com/demo/15679.html



Genius 发表于 2019-7-15 17:40:33

谢谢分享

AIcainiao 发表于 2019-7-16 15:11:26

Genius 发表于 2019-7-15 17:40
谢谢分享

:loveliness::loveliness::loveliness:

金刚无敌 发表于 2019-7-31 21:21:17

请问下机智云设备配网 能不能通过H5配置呢

AIcainiao 发表于 2020-12-15 16:40:34

本帖最后由 AIcainiao 于 2020-12-15 16:48 编辑

金刚无敌 发表于 2019-7-31 21:21
请问下机智云设备配网 能不能通过H5配置呢
网页配网,做内置就可以的
页: [1]
查看完整版本: 机智云小程序启蒙:WebSocket网页控制