• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > 基于HTML5的Web跨设备超声波通信方案详解

基于HTML5的Web跨设备超声波通信方案详解

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含HTML5,Web,超声波等相关知识,匿名希望在学习及工作中可以帮助到您
基于HTML5的Web跨设备超声波通信方案详解:

前言:Chirp在iPhone上掀起了有声传输文件的序幕,我们再也不需要彩信、蓝牙配对、IM来传送数据。它通过“叽叽喳喳”的小鸟叫声来分享数据,简单有趣,而且可以快速的实现一对多的分享。

此外支付宝曾经试推过“声波支付”,利用手机发送超声波至终端作为交易密码进一步完成交易。然而支付宝的技术目前只是使用在了支付上,而需要可接受声波支付的特定售货机方可使用。

《Advanced Sound for Games and Interactive Apps - WebAudio API》的作者Boris Smus用HTML5的Web Audio API实现了一个基于Web的超声波互联方案,通过这种方式不需要安装任何客户端,也不需要蓝牙或者NFC的支持,就能够将两台用浏览器上网的设备连接到一起并传递图片、音乐、视频等文件。这个idea很酷,帮助我们在Web的功能和应用层面迈进了一大步(这种想法也许你都想所未想,闻所未闻),下面我们就一起来看看具体的原理和实现过程。

……………………………………?……………………………………华丽的分隔线

你口袋里的手机是一个酷炫的、美观的、有很多功能的工具。但是当它想要和其它设备对话时,例如电视或者笔记本,用户体验就大幅下降。Bill Buxton关于这个主题有一个极富感染力的演讲,描述了高科技演化的三个阶段:

1、设备工作:功能的完整性和稳定性

2、 设备流畅:良好的用户体验

3、 许多设备在一起工作

我们已经随着iPhone的发布,正式的进入了第2个阶段,但是连接设备是一件让人痛苦的事情。有许多方法来实现这一点:蓝牙、蓝牙LE、WiFi直连、通过本地WiFi网络发现等等。这篇文章通过一个完全让人意想不到的角度来解决这个问题:利用超声波来广播和在相邻设备间发送数据。最重要的是,这种方法采用Web Audio API,使得纯Web应用的连接成为可能。


演示视频

设备的通天塔

Airplay 和 Chromecast是解决同一生态系统(例如苹果或谷歌)内设备连接问题的伟大方法 ,但是普遍问题仍然难以得到解决。

因为有许多可能的技术途径,所以可能碰巧你要连接的设备间没有共同的方法。即便两个设备都有蓝牙,其中一个或许需要配置,但是另外一个却不支持,或者是支持不同版本的标准。现在这对于蓝牙来说尤其普遍,许多设备硬件上支持蓝牙4.0(又名BTLE),但是很多设备却因为各种原因不支持这个最新的协议。

在Web上这种情况甚至更糟,因为低级别设备的连接API因为安全沙盒方面的原因并没有提供。而由于Web的发展非常慢,所以很难想像这种情况能够在短时间内得到解决。

通过有趣的方式传输数据

Electric Imp提供的Blinkup是一种跨端通信的有趣方式。它使用了一系列闪光来在智能手机和Imp – 一种形似小型SD卡并带有光线传感器的设备间传输数据。

拨号调制解调器做了类似的事情。它们在模拟电话线上编码和解码数字数据。还记得那些烦人的连接噪音吗?拨号调制解调器会打开扬声器来让用户了解正在进行握手。如果你忘记了这些,可以在这儿复习一下。即使在今天的模拟电话里,你在键盘上按下数字键时听到的声音也相当于电话系统用于模拟数字转换的频率。这个转换使用了双音多频信号(DTMF)。

你的手机和周围的其它很多设备都有扬声器和麦克风。这两种硬件可以用声音来发送和接收数据,类似于调制解调器在电话线路上所做的事情。更妙的是,如果操作系统支持发送和接收的频率足够高,我们可以创建一个无声的数据通道。

用声音传输数据

我应该注意到通过声音编码数据并不新颖。音频水印的创意就是把签名编码到音乐中,听众通过人类的方式并无法识别,但是却能够被另外一台设备所理解。这是一种防止盗版的聪明方式。

大多数普通的扬声器能够产生44.1KHz采样率的声音(这导致最高的频率为

您可能想查找下面的文章:

  • HTML5知识点总结
  • HTML5的本地存储
  • HTML5本地存储之IndexedDB
  • Html5实现文件异步上传功能
  • Html5新标签datalist实现输入框与后台数据库数据的动态匹配
  • 详解HTML5 window.postMessage与跨域
  • HTML5拖放API实现拖放排序的实例代码
  • 解决html5中video标签无法播放mp4问题的办法
  • HTML5新特性 多线程(Worker SharedWorker)
  • Html5新增标签有哪些

相关文章

  • 2018-12-03如何解决table标签和col标签的一系列问题?
  • 2018-12-03使用JavaScript和canvas实现图片的裁剪
  • 2018-12-03JS中捕获console.log()输出的方法
  • 2018-12-03在HTML5中如何提高网站前端性能的示例代码分析
  • 2018-12-03HTML5中音频的详细解析
  • 2017-08-06HTML5的video标签的浏览器兼容性增强方案分享
  • 2018-12-03如何用HTML5在页面中插入可自动播放的视频
  • 2017-08-06HTML5实现经典坦克大战坦克乱走还能发出一个子弹
  • 2018-12-03JS每日一题-小demo之JS实现通过键盘方向键操作图片上下左右无缝切换
  • 2017-08-06HTML5 video 视频标签使用介绍

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • Web页面跳转并取值的方法指导
    • html5 Canvas画图教程(4)—未闭合的路径及渐变色的填充方法_html5教程技巧
    • 避免常见的六种HTML5错误用法 (5-6)
    • 做为一名在校学生而言,从其职业发展的角度出发,在学习 Web 前端开发的时候有必要花时间兼容 IE6、IE7 这些浏览器吗?
    • Html5中内容安全策略(CSP)
    • 在上海培训前端,达内,火星,传智,千锋综合考虑哪家好一点?有知道的大神吗?谢谢
    • HTML5表单属性教程实例
    • 如何在一个月之内从零基础成为初级CSS前端开发工程师?
    • html5如何及时更新缓存文件(js、css或图片)
    • 基于html5实现的图片墙效果

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有