我也想来谈谈HTTPS,传敏感数据

视频播放–踩坑小计

2018/06/09 · JavaScript
· 视频

原文出处:
chenjsh36   

 

随着流量时代的到来和硬件技术的提升,越来越多的网站希望能在PC端或移动端播放自己的视频,而
<video>的兼容性的逐渐完善,使得开发者更愿意使用它来实现视频播放场景。

本篇文章主要罗列__视频播放的通用场景及各场景下踩过的坑__,希望能__帮助开发者在遇到需求开发时能更快地选择合适的技术方案同时减少采坑的次数__。

即使用了 https 也不要通过 query strings 传敏感数据

2017/10/16 · 基础技术 ·
HTTPS

本文由 伯乐在线 –
xiaoheike
翻译,艾凌风
校稿。未经许可,禁止转载!
英文出处:HttpWatch。欢迎加入翻译组。

服务器端的 log 将明文记下完整 url;浏览器上的访问历史也会明文记下完整
url;Referrer headers 里也忠实记下完整 url,然后在别人家的 Google
Analytics 上显示。

我们经常听到的一个常见问题是:“URL
中的参数是否可以安全地传递到安全网站?”这个问题常常出现在客户看了
HttpWatch 捕获的 HTTPS 请求后,想知道还有谁可以看到这些数据。

 

例如,假设在一个查询中,使用如下安全的 URL 传递密码字符串:

HttpWatch 能够显示安全请求的内容,因为它与浏览器集成,因此它能够在
HTTPS 请求的 SSL
连接对数据加密之前查看数据。betway必威亚洲官网 1

如果你使用网络嗅探器查看,例如
Network Monitor,对于同一个请求,你只能够查阅加密之后的数据。在数据包跟踪中没有可见的网址,标题或内容:

betway必威亚洲官网 2

您可以信任 HTTPS 请求是安全的,只要:

  • 未忽略任何SSL证书警告
  • Web 服务器用于启动 SSL 连接的私钥在 Web 服务器本身之外不可用。

因此,在网络层面,URL 参数是安全的,但是还有一些其他基于 URL
泄漏数据的方法:

  1. URL 存储在 Web 服务器日志中–通常每个请求的完整 URL
    都被存放在服务器日志中。这意味着 URL
    中的任何敏感数据(例如密码)会以明文形式保存在服务器上。以下是使用查询字符串通过
    HTTPSbetway必威亚洲官网, 发送密码时存储在 httpwatch.com 服务器日志中的条目:
    **2009-02-20 10:18:27 W3SVC4326 WWW 208.101.31.210 GET
    /Default.htm password=mypassword 443 …
    通常认为即使是在服务器上,存储明文密码从来都不是好想法
    2.URLs are stored in the browser history – browsers save URL
    parameters in their history even if the secure pages themselves are
    not cached. Here’s the IE history displaying the URL parameter:
  2. URL 存储在浏览器历史记录中–即使安全网页本身未缓存,浏览器也会将
    URL 参数保存在其历史记录中。以下是 IE 的历史记录,显示了 URL
    的请求参数:betway必威亚洲官网 3

如果用户创建书签,查询字符串参数也将被存储。

  1. URLReferrer 请求头中被传递–如果一个安全网页使用资源,例如
    javascript,图片或者分析服务,URL 将通过 Referrer
    请求头传递到每一个嵌入对象。有时,查询字符串参数可能被传递并存放在第三方站点。在
    HttpWatch 中,你可以看到我们的密码字符串正被发送到
    Google Analyticsbetway必威亚洲官网 4

结论

解决这个问题需要两步:

  • 只有在绝对必要的情况下传递敏感数据。一旦用户被认证,最好使用具有有限生命周期的会话
    ID 来标识它们。

使用会话层级的 cookies 传递信息的优点是:

  • 它们不会存储在浏览器历史记录中或磁盘上
  • 它们通常不存储在服务器日志中
  • 它们不会传递到嵌入式资源,例如图片或 JavaScript
  • 它们仅适用于请求它们的域和路径

以下是我们的在线商店中,用于识别用户的 ASP.NET 会话 cookie 示例:

betway必威亚洲官网 5

请注意,cookie 被限制在域
store.httpwatch.com,并且在浏览器会话结束时过期(即不会存储到磁盘)。

你当然可以通过 HTTPS
传递查询字符串,但是不要在可能出现安全问题的场景下使用。例如,你可以安全的使用它们显示部分数字或者类型,像
accountview 或者
printpage,但是不要使用它们传递密码,信用卡号码或者其他不应该公开的信息。

1 赞 收藏
评论

我也想来谈谈HTTPS

2016/11/04 · 基础技术 ·
HTTPS

本文作者: 伯乐在线 –
ThoughtWorks
。未经作者许可,禁止转载!
欢迎加入伯乐在线 专栏作者。

场景一:自动播放

autoPlay 布尔属性;指定后,视频会马上自动开始播放,不会停下来等着数据载入结束。

视频自动播放可以在页面打开且资源加载足够的情况下让视频自动播放,减少一次用户点击的交互,同时可以应用在动效背景、H5仿视频通话的功能。不过由于各种原因,自动播放无论在PC端还是移动端都有不同程度的限制。

关于作者:xiaoheike

betway必威亚洲官网 6

简介还没来得及写 :)
个人主页 ·
我的文章 ·
10 ·
     

betway必威亚洲官网 7

安全越来越被重视

2014年8月份Google在官博上发表《 HTTPS as a ranking
signal 》。表示调整其搜索引擎算法,采用HTTPS加密的网站在搜索结果中的排名将会更高,鼓励全球网站采用安全度更高的HTTPS以保证访客安全。

同一年(2014年),百度开始对外开放了HTTPS的访问,并于3月初正式对全网用户进行了HTTPS跳转。对百度自身来说,HTTPS能够保护用户体验,降低劫持/隐私泄露对用户的伤害。

而2015年,百度开放收录HTTPS站点公告。全面支持HTTPS页面直接收录;百度搜索引擎认为在权值相同的站点中,采用HTTPS协议的页面更加安全,排名上会优先对待。

移动端

“HTTP = 不安全”,为什么说HTTP不安全?

HTTP报文是由一行行简单字符串组成的,是纯文本,可以很方便地对其进行读写。一个简单事务所使用的报文:

betway必威亚洲官网 8

HTTP传输的内容是明文的,你上网浏览过、提交过的内容,所有在后台工作的实体,比如路由器的所有者、网线途径路线的不明意图者、省市运营商、运营商骨干网、跨运营商网关等都能够查看。举个不安全的例子:

一个简单非HTTPS的登录采用POST方法提交包含用户名和密码的表单,会发生什么?

betway必威亚洲官网 9

POST表单发出去的信息,没有做任何的安全性信息置乱(加密编码),直接编码为下一层协议(TCP层)需要的内容,所有用户名和密码信息一览无余,任何拦截到报文信息的人都可以获取到你的用户名和密码,是不是想想都觉得恐怖?

那么问题来了,怎么样才是安全的呢?

IOS

早期必须要有用户手势(user
gesture)video标签才可以播放; 从版本10开始修改了video的规则,苹果放宽了inline和autoplay,策略如下(仅适用于Safari浏览器):

  • <video> elements will be allowed to autoplay without a user
    gesture if their source media contains no audio tracks.(无音频源的
    video 元素 允许自动播放)
  • <video muted> elements will also be allowed to autoplay without a
    user gesture.(禁音的 video 元素允许自动播放)
  • If a <video> element gains an audio track or becomes un-muted
    without a user gesture, playback will pause.(如果 video
    元素在没有用户手势下有了音频源或者变成非禁音,会暂停播放)
  • <video autoplay> elements will only begin playing when visible
    on-screen such as when they are scrolled into the viewport, made
    visible through CSS, and inserted into the DOM.(video
    元素屏幕可见才开始播放)
  • <video autoplay> elements will pause if they become non-visible,
    such as by being scrolled out of the
    viewport.(video元素不可见后停止播放)

对于包含用户敏感信息的网站需要进行怎样的安全防护?

对于一个包含用户敏感信息的网站(从实际角度出发),我们期望实现HTTP安全技术能够满足至少以下需求:

  • 服务器认证(客户端知道它们是在与真正的而不是伪造的服务器通话)
  • 客户端认证(服务器知道它们是在与真正的而不是伪造的客户端通话)
  • 完整性(客户端和服务器的数据不会被修改)
  • 加密(客户端和服务器的对话是私密的,无需担心被窃听)
  • 效率(一个运行的足够快的算法,以便低端的客户端和服务器使用)
  • 普适性(基本上所有的客户端和服务器都支持这个协议)
  • 管理的可扩展性(在任何地方的任何人都可以立即进行安全通信)
  • 适应性(能够支持当前最知名的安全方法)
  • 在社会上的可行性(满足社会的政治文化需要)

安卓

__早期__同样需要用户手势才可以播放; 安卓的 chrome 53
放宽了自动播放策略,策略不同于IOS的Safari,需要同时对
video 设置 autoplay 和 muted(是否禁音),才允许自动播放;
__安卓的 FireFox 和 UC 浏览器__支持任何情况下的自动播放;
安卓的其他浏览器暂时不清楚情况;

HTTPS协议来解决安全性的问题:HTTPS和HTTP的不同 – TLS安全层(会话层)

超文本传输安全协议(HTTPS,也被称为HTTP over TLS,HTTP over SSL或HTTP
Secure)是一种网络安全传输协议。

HTTPS开发的主要目的,是提供对网络服务器的认证,保证交换信息的机密性和完整性。

它和HTTP的差别在于,HTTPS经由超文本传输协议进行通信,但利用SSL/TLS來对包进行加密,即所有的HTTP请求和响应数据在发送到网络上之前,都要进行加密。如下图:
betway必威亚洲官网 10
安全操作,即数据编码(加密)和解码(解密)的工作是由SSL一层来完成,而其他的部分和HTTP协议没有太多的不同。更详细的TLS层协议图:
betway必威亚洲官网 11
SSL层是实现HTTPS的安全性的基石,它是如何做到的呢?我们需要了解SSL层背后基本原理和概念,由于涉及到信息安全和密码学的概念,我尽量用简单的语言和示意图来描述。

PC端

早期是__支持自动播放,但__近来
Safari、Chrome
 陆续修改了自动播放的策略……

SSL层背后基本原理和概念

介绍HTTPS背后的基本原理和概念,涉及到的概念:加密算法,数字证书,CA中心等。

加密算法
加密算法严格来说属于编码学(密码编码学),编码是信息从一种形式或格式转换为另一种形式的过程。解码,是编码的逆过程(对应密码学中的解密)。

betway必威亚洲官网 12

对称加密算法

加密算法主要分两类:对称和非对称加密算法。在对称加密算法中,使用的密钥只有一个,发收信双方都使用这个密钥对数据进行加密和解密,这就要求解密方事先必须知道加密密钥。
betway必威亚洲官网 13

但是对称加密算法有一个问题:一旦通信的实体多了,那么管理秘钥就会成为问题。

betway必威亚洲官网 14
非对称加密算法(加密和签名)

非对称加密算法需要两个密钥:公开密钥(public
key)
私有密钥(private
key)
。公开密钥与私有密钥是一对,如果用公开密钥对数据进行加密,只有用对应的私有密钥才能解密;如果用私有密钥对数据进行加密,那么只有用对应的公开密钥才能解密,这个反过来的过程叫作数字签名(因为私钥是非公开的,所以可以验证该实体的身份)。

他们就像是锁和钥匙的关系。Alice把打开的锁(公钥)发送给不同的实体(Bob,Tom),然后他们用这把锁把信息加密,Alice只需要一把钥匙(私钥)就能解开内容。

betway必威亚洲官网 15

那么,有一个很重要的问题:加密算法是如何保证数据传输的安全,即不被破解?有两点:

1.利用数学计算的困难性(比如:离散对数问题)
2.加密算法是公开的,关键在于秘钥,密码学中有柯克霍夫斯基原则,即加密算法的安全性依赖的是密钥的保密而不是算法的保密,因此,保证秘钥的定期更换是非常重要的。

数字证书,用来实现身份认证和秘钥交换

数字证书是一个经证书授权中心数字签名的包含公开密钥拥有者信息,使用的加密算法以及公开密钥的文件。

betway必威亚洲官网 16

以数字证书为核心的加密技术可以对网络上传输的信息进行加密和解密、数字签名和签名验证,确保网上传递信息的机密性、完整性及交易的不可抵赖性。使用了数字证书,即使您发送的信息在网上被他人截获,甚至您丢失了个人的账户、密码等信息,仍可以保证您的账户、资金安全。(比如,支付宝的一种安全手段就是在指定电脑上安装数字证书)

身份认证(我凭什么信任你)

身份认证是建立每一个TLS连接不可或缺的部分。比如,你有可能和任何一方建立一个加密的通道,包括攻击者,除非我们可以确定通信的服务端是我们可以信任的,否则,所有的加密(保密)工作都没有任何作用。

而身份认证的方式就是通过证书以数字方式签名的声明,它将公钥与持有相应私钥的主体(个人、设备和服务)身份绑定在一起。通过在证书上签名,CA可以核实与证书上公钥相应的私钥为证书所指定的主体所拥有。
betway必威亚洲官网 17

Safari 浏览器

__Safari
10 后__带音频的视频和音频默认禁止自动播放,更多信息可以参考这篇文章;

Chrome(旧版本) 下自动播放:

betway必威亚洲官网 18

Safari (10后)不自动播放:

betway必威亚洲官网 19

了解TLS协议

HTTPS的安全主要靠的是TLS协议层的操作。那么它到底做了什么,来建立一条安全的数据传输通道呢?

TLS握手:安全通道是如何建立的

betway必威亚洲官网 20

0 ms
TLS运行在一个可靠的TCP协议上,意味着我们必须首先完成TCP协议的三次握手。

56 ms
在TCP连接建立完成之后,客户端会以明文的方式发送一系列说明,比如使用的TLS协议版本,客户端所支持的加密算法等。

84 ms
服务器端拿到TLS协议版本,根据客户端提供的加密算法列表选择一个合适的加密算法,然后将选择的算法连同服务器的证书一起发送到客户端。

112 ms
假设服务器和客户端协商后,得到一个共同的TLS版本和加密算法,客户端检测服务端的证书,非常满意,客户端就会要么使用RSA加密算法(公钥加密)或者DH秘钥交换协议,得到一个服务器和客户端公用的对称秘钥。

由于历史和商业原因,基于RSA的秘钥交换占据了TLS协议的大片江山:客户端生成一个对称秘钥,使用服务器端证书的公钥加密,然后发送给服务器端,服务器端利用私钥解密得到对称秘钥。

140 ms
服务器处理由客户端发送的秘钥交换参数,通过验证MAC(Message
Authentication
Code,消息认证码)来验证消息的完整性,返回一个加密过的“Finished”消息给客户端。

在密码学中,消息认证码(英语:Message Authentication
Code,缩写为MAC),又译为消息鉴别码、文件消息认证码、讯息鉴别码、信息认证码,是经过特定算法后产生的一小段信息,检查某段消息的完整性,以及作身份验证。它可以用来检查在消息传递过程中,其内容是否被更改过,不管更改的原因是来自意外或是蓄意攻击。同时可以作为消息来源的身份验证,确认消息的来源。

168 ms
客户端用协商得到的堆成秘钥解密“Finished”消息,验证MAC(消息完整性验证),如果一切ok,那么这个加密的通道就建立完成,可以开始数据传输了。

在这之后的通信,采用对称秘钥对数据加密传输,从而保证数据的机密性。

到此为止,我是想要介绍的基本原理的全部内容,但HTTPS得知识点不止如此,还有更多说,现在来点干货(实战)!!

Chrome 浏览器

禁音的视频依旧可以播放,�带声音的视频会根据__媒体参与指数__来决定能否自动播放,那什么是媒体参与指数?官方给了解释和相关的维度:

MEI
是一个评估用户对于当前站点的媒体参与程度的指数,它取决于下面几个维度:

  • 用户在媒体上停留时间超过了 7秒以上
  • 音频必须是展示出来,并且没有静音
  • 与 video 之间有过交互
  • 媒体的尺寸不小于 200×140.

看完后开发者的心里是这样的:

betway必威亚洲官网 21

betway必威亚洲官网 22

那么,教练,我想用HTTPS

betway必威亚洲官网 23

选择合适的证书,Let’s Encrypt(It’s free, automated, and
open.)是一种不错的选择

ThoughtWorks在2016年4月份发布的技术雷达中对Let’s Encrypt项目进行了介绍:

从2015年12月开始,Let’s
Encrypt项目从封闭测试阶段转向公开测试阶段,也就是说用户不再需要收到邀请才能使用它了。Let’s
Encrypt为那些寻求网站安全的用户提供了一种简单的方式获取和管理证书。Let’s
Encrypt也使得“安全和隐私”获得了更好的保障,而这一趋势已经随着ThoughtWorks和我们许多使用其进行证书认证的项目开始了。

据Let’s
Encrypt发布的数据来看,至今该项目已经颁发了超过300万份证书——300万这个数字是在5月8日-9日之间达成的。Let’s
Encrypt是为了让HTTP连接做得更加安全的一个项目,所以越多的网站加入,互联网就回变得越安全。

1 赞 1 收藏
评论

检测能否自动播放?

好在无论是 Safari 还是
Chrome,在限制了自动播放的同时,提供了检测视频是否能自动播放的机制,以便于开发者在发现无法自动播放时有备选方案:

var promise = document.querySelector(‘video’).play(); if (promise !==
undefined) { promise.catch(error => { // Auto-play was prevented //
Show a UI element to let the user manually start playback }).then(()
=> { // Auto-play started }); }

1
2
3
4
5
6
7
8
9
10
var promise = document.querySelector(‘video’).play();
 
if (promise !== undefined) {
    promise.catch(error => {
        // Auto-play was prevented
        // Show a UI element to let the user manually start playback
    }).then(() => {
        // Auto-play started
    });
}

关于作者:ThoughtWorks

betway必威亚洲官网 24

ThoughtWorks是一家全球IT咨询公司,追求卓越软件质量,致力于科技驱动商业变革。擅长构建定制化软件产品,帮助客户快速将概念转化为价值。同时为客户提供用户体验设计、技术战略咨询、组织转型等咨询服务。

个人主页 ·
我的文章 ·
84 ·
  

betway必威亚洲官网 7

发表评论

电子邮件地址不会被公开。 必填项已用*标注

标签:, ,
网站地图xml地图