0.1 H5安全简介

H5是什么？H5会在什么场景应用？H5开发具体使用的是什么技术？在H5开发中可能会出现什么样的安全问题？了解这些问题背后的基本知识是进行H5安全开发的基础。

0.1.1 什么是H5

H5从最初的“惊艳亮相”到“井喷式爆发”只有短短几年的时间，活跃在包括微博、微信等在内的媒体中。H5的作品通常将内容、创意、设计、影视、音频、游戏、娱乐等融为一体，并具有较强的时效性。

如同JavaScript可以被简称为JS一样，在很多人眼里H5是HTML5（第5代 HTML标准）的简称。实际上H5不仅包括HTML5的技术，还包括CSS、JavaScript在内的诸多技术。H5并不是一项独立的技术，也不是一项独立的标准，而是用于实现网页互动效果的技术集合。

H5可以跨iOS、Android等多种操作系统，具有跨PC端、移动端等多种平台进行应用开发的优势，再加上其所具有的实时、自主、差量更新等特性，能够满足用户快速享受最新服务的需求，从而为用户提供良好的应用体验。

H5的应用范围很广，从应用场景角度来看，主要体现在以下两个方面。

1.融媒体

到目前为止，融媒体还没有一个统一的、人们公认的定义。但是，总体来讲，融媒体具有将线上、线下多种媒体形式进行整合，将资源、内容、宣传、利益等融合在一起的特点。融媒体在广告推广、市场营销、媒体宣传、新闻传播等诸多领域有广泛的应用，而H5则是支撑融媒体发展的主要技术。

2.信息系统

在基于浏览器/服务器（Browser/Server，B/S）架构的信息系统中，利用H5可以使图形、统计等的表现形式更加丰富，使用户操作更加便捷。此外，H5具有容易开发、实时更新、维护简单等诸多优点，使信息系统的开发和运维变得更加简单。

图0-1所示的是某企业的信息系统网站登录页面，该网站实质上是利用H5进行展示的响应式网站。

图0-1 某企业的信息系统网站登录页面

扩展阅读

响应式网站：响应式网站区别于传统的以静态页面为主的网站，它可以自动适应不同终端设备的访问，方便用户阅读、导航浏览及进行控制操作，从而提高了用户体验。

B/S架构：这是互联网兴起后的一种网络访问架构。B/S架构将所有系统实现的核心功能全部集中到服务器上，将浏览器作为客户端供用户进行访问和操作。

0.1.2 H5面临的安全威胁

当前，H5在应用过程中所暴露出的安全问题存在着“一多一少”的现象：基于H5开发的信息系统显露出的安全问题比较多；而基于H5开发的融媒体应用显露出的安全问题相对较少。实际上，无论是基于H5开发的信息系统还是融媒体应用都会产生安全问题，只不过融媒体应用具有较强的时效性，使别有用心者发现其安全问题并可加以利用的时间较短，因此极大地减小了产生危害的概率，但这并不意味着融媒体应用的安全防护可以被忽略。

基于H5开发的信息系统与融媒体应用采用的技术相同，因此，后文介绍的H5安全开发技术，将以信息系统为主要分析对象。有关融媒体应用开发的H5安全开发技术可参照相关内容进行。

1.H5安全问题的成因

H5的安全问题大部分是在开发中产生的。这些安全问题是由技术、人员、制度等多个层面的因素综合形成的。

（1）技术层面

H5作为融媒体应用和信息系统的开发框架^[1]，包含了HTML5、CSS、JavaScript等多种开发技术和工具，而这些技术和工具存在不同程度的安全隐患与漏洞^[2]，因此从技术的层面来看，H5面临安全问题的本质就是框架内各种技术存在的安全问题。

（2）人员层面

不少开发者对开发过程中的安全问题不够重视，并且安全开发意识不强，安全开发知识也有所欠缺，从而不能有效防范安全问题。此外，在人员培养阶段，如果对安全开发意识和安全开发知识的培养不足、不够深入，也会导致安全问题的产生。

（3）制度层面

从软件开发的现状来看，一方面开发者的注意力大多放在快速实现软件的功能上，对软件的安全方面不太重视；另一方面不少开发者对安全开发感到力不从心。在这种情况下，如果在软件开发过程中缺乏确保安全开发的制度要求，就很容易导致所开发的软件出现安全问题。

2.H5安全问题的主要表现

H5安全问题一般会出现在客户端、服务器及通信过程等3个环节，并且往往不会孤立地出现在某个环节，而是会同时出现在多个环节。典型的H5安全问题如下。

（1）管理控制台

大多数利用H5开发的应用会存在一个默认管理控制台，而管理控制台往往会依靠某种框架运行。只要别有用心者能够收集足够多的与管理控制台相关的信息，就可能从中发现安全漏洞，然后利用漏洞对管理控制台的接口发起攻击。因此，最稳妥的方法是将H5应用的管理控制台接口与服务隔离，以避免运行过程中的安全隐患。

（2）身份验证和访问控制

许多H5应用是通过Web方式进行身份验证和访问控制的，然而这种方式会带来一些安全隐患。对于身份验证和访问控制，用户既希望身份认证和访问控制具备可靠性、严密性及隐秘性，又希望身份认证和访问控制的过程不复杂，不影响使用的舒适性和便捷性。因此，开发者根据实际情况平衡好上述两方面的关系非常重要。在实际应用中，通常的做法是在用户所能容忍的复杂度的范围内，为用户提供可靠的身份验证和安全的访问控制。

（3）输入参数验证

在H5应用中，通常会通过参数验证来实现身份验证。由于这种验证是通过识别代码规则进行的，而发现这些规则的缺陷往往是别有用心者乐于追逐的目标，因此通过一个安全机制来传递所输入的参数（如身份信息）是非常必要的。输入参数验证所面临的一些常见的安全威胁如下。

·目录遍历攻击

目录遍历是H5应用的服务器或H5应用所执行的程序对用户输入的文件名称的安全性验证不充分而导致的一种安全漏洞，使别有用心者可以利用一些特殊字符达到绕过服务器的安全限制访问任意文件（不局限于Web根目录中的文件），甚至执行系统命令的目的。防范目录遍历漏洞的方法中，最有效的是进行权限控制。

·XSS攻击

跨站点脚本^[3]（Cross Site Scripting，XSS)漏洞是Web程序中最常见的漏洞之一。XSS攻击是指攻击者向合法的Web页面插入恶意的脚本代码（通常用的是HTML代码和JavaScript代码），当用户浏览Web页面时，插入的恶意脚本代码就会被运行，从而实施恶意攻击。

·CSRF攻击

跨站点请求伪造（Cross Site Request Forgery，CSRF）攻击是发生在客户端（用户）的攻击，指在用户通过浏览器登录网站后（如网站A），并对该网站进行访问时，该用户又使用同一浏览器登录另一个网站（如网站B），如图0-2所示，如果网站B存在攻击性代码，那么网站B中的攻击性代码就会在用户毫无所知的情况下通过浏览器利用用户在网站A的合法身份向网站A发出请求。由于网站A无法判断出该请求不是由用户发起的，因此网站A会根据用户的身份信息依照合理权限请求，从而导致网站B的恶意代码被运行，如图0-3所示。如果此时用户登录的网站A是用户网银的网站，那么网站B的恶意代码运行后就可能在用户未授权的情况下对用户网银中的资金进行操作，这个操作也将被记录为用户的合法操作。

图0-2 用户登录网站A和网站B

图0-3 用户受到CSRF攻击

提示

XSS攻击和CSRF攻击都是跨站点攻击，它们的相同点是不攻击服务器，攻击的都是正常进行网站信息访问的用户。XSS攻击属于实现CSRF攻击的诸多途径之一。

·SQL注入攻击

SQL注入攻击是指通过现有的程序，将不属于程序本身的SQL语句注入后台数据库并对数据库进行攻击的行为。SQL注入攻击的目的是非法获取网站的控制权，因此表单提交、URL提交、cookie参数提交等程序模块往往是SQL注入的主要对象。

此外，H5常见的安全问题还包括会话管理、敏感信息泄露等，这里就不再逐一讲述。

0.1.3 H5开发中常见的安全问题

H5应用的安全问题主要来自需求分析、总体设计、代码编写等过程中存在的缺陷，这些缺陷是导致软件性能不高和出现安全问题的主要原因。另外，由于开发过程中使用开源代码、公用框架及模块，因此会有意或无意地引入一些已知或未知的安全威胁。

1.代码开发引入的安全问题

H5应用（融媒体应用、信息系统等）有可能出现的安全问题在前端、服务器端及通信过程中都存在。这些安全问题涉及范围广、种类繁多。出现在前端和服务器端的安全问题，如XSS攻击、iframe风险、网页劫持、内容推断错误、第三方共享代码、静态资源完整性校验缺失、HTTPS访问、本地存储数据泄露等，基本上都与代码开发有关，因此完备的代码开发可以在很大程度上避免这些安全问题的产生。对于通信过程中的安全隐患，则需要采用各种技术手段进行防范。

2.交互设计产生的安全问题

H5开发的安全问题还会因交互界面设计不合理而产生。这是因为交互界面设计不合理会使用户产生误解，当用户产生误解后，往往会导致误操作，从而产生安全问题。