网页适配的方法和系统的制作方法
【专利摘要】本发明公开了一种网页适配的方法和系统，所述方法包括：根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型；获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板；根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面；响应所述访问请求，在所述访问终端显示所述访问页面。实施本发明的方法和系统，可快速从传统的PC站点建立移动站点，为多种访问终端分配与其屏幕类型、系统类型和浏览器类型匹配的访问页面，而且对多个站点的管理便捷，方便后续扩展。
【专利说明】网页适配的方法和系统
【技术领域】
[0001]本发明涉及网络通讯【技术领域】，特别是涉及一种网页适配的方法和系统。
【背景技术】
[0002]随着全球智能手机和移动网络的高速增长，3G和WIFI也越来也普及，互联网中可用于显示的终端种类越来越多，不同的终端安装的操作系统不同，不同浏览器的屏幕大小也不一样，有些浏览器不支持JS (JavaScript)脚本，有些不支持gif动画，有些不支持html5，为了适应每种设备，使不同设备能正常查看页面，现有技术设置了电脑版本和手机版本这两套对应的站点系统，网络服务器根据发出访问请求的UserAgent信息判断该终端是来自电脑还是来自手机，并依据判断的结果，定向到电脑版本或手机版本，最后将正确的界面效果呈现给访问终端。
[0003]但是，上述适配技术需要两套系统，一套系统管理电脑版，一套系统管理手机版，对多个子站点的管理操作繁琐、效率低，而且编辑管理系统要同时维护两套系统，不方便后续扩展。
【发明内容】
[0004]基于此，有必要针对上述适配技术需要两套系统，对多个子站点的管理操作繁琐、效率低，而且编辑管理系统要同时维护两套系统，不方便后续扩展的问题，提供一种网页适配的方法和系统。
[0005]一种网页适配的方法，包括以下步骤:
[0006]根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型；
[0007]获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板；
[0008]根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面；
[0009]响应所述访问请求，在所述访问终端显示所述访问页面。
[0010]一种网页适配的系统，包括:
[0011 ] 获取模块，用于根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型；
[0012]模板模块，用于获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板；
[0013]定向模块，用于根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面；
[0014]显示模块，用于响应所述访问请求，在所述访问终端显示所述访问页面。
[0015]以上所述的网页适配的方法和系统，根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型，再获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板，进而根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面，最终响应所述访问请求，在所述访问终端显示所述访问页面，可快速从传统的PC站点建立移动站点，为多种访问终端分配与其屏幕类型、系统类型和浏览器类型匹配的访问页面，仅一套系统即可对多个站点进行便捷管理，方便后续扩展。
【专利附图】
【附图说明】
[0016]图1是本发明网页适配的方法第一实施方式的流程示意图；
[0017]图2是本发明网页适配的方法第二实施方式的流程示意图；
[0018]图3是本发明网页适配的方法第三实施方式的流程示意图；
[0019]图4是本发明网页适配的系统第一实施方式的结构示意图。
【具体实施方式】
[0020]请参阅图1，图1是本发明网页适配的方法第一实施方式的流程示意图。
[0021]本实施方式的所述网页适配的方法包括以下步骤:
[0022]步骤101，根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型。
[0023]步骤102，获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板。
[0024]步骤103，根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面。
[0025]步骤104,响应所述访问请求,在所述访问终端显示所述访问页面。
[0026]本实施方式所述的网页适配的方法，根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型，再获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板，进而根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面，最终响应所述访问请求，在所述访问终端显示所述访问页面，可快速从传统的PC站点建立移动站点，为多种访问终端分配与其屏幕类型、系统类型和浏览器类型匹配的访问页面，仅一套系统即可对多个站点进行便捷管理，方便后续扩展。
[0027]其中，对于步骤101，所述访问终端包括各种型号的手机、台式电脑、和平板电脑中的至少一个，所述访问请求优选地包括UserAgent信息和/或所述访问终端身份标识。
[0028]在一个实施例中，所述根据访问终端的访问请求，获取所述访问终端的屏幕尺寸、系统类型和浏览器类型的步骤包括以下步骤:
[0029]通过服务器接收所述访问终端发送的所述访问请求，并提取出所述访问请求的头
部信息。
[0030]根据所述头部信息内的x-wap-profile，从屏幕特征库中匹配出所述访问终端的
屏幕类型。
[0031]根据所述头部信息内的UserAgent，从浏览器特征库和操作系统特征库中匹配出所述访问终端的系统类型和浏览器类型。[0032]其中，所述屏幕特征库、浏览器特征库和操作系统特征库为提前统计多种访问终端的屏幕、操作系统、浏览器，归纳总结后建立的。
[0033]优选地，在所述提取出所述访问请求的头部信息的步骤之后，还包括以下步骤:
[0034]遍历所述头部信息的各字段，判断所述头部信息是否已存储在已知头部数据库中。
[0035]若是，则根据所述头部信息内的x-wap-profile,从屏幕特征库中匹配出所述访问终端的屏幕类型，根据所述头部信息内的UserAgent，从浏览器特征库和操作系统特征库中匹配出所述访问终端的系统类型和浏览器类型。
[0036]若否，则把所述访问终端的头部信息写入到未知头部信息库。
[0037]其中，所述已知头部数据库可包括用于区分不同的屏幕类型的x-wap-profile，和用于区分不同的系统类型和浏览器类型的UserAgent信息。对于未知头部信息库，后期可通过人工或机器干预的方式进行该未知头部信息的适配。
[0038]在另一个实施例中，在所述根据访问终端的访问请求，获取所述访问终端的屏幕尺寸、系统类型和浏览器类型的步骤之后，还包括以下步骤:
[0039]将所述屏幕类型、所述系统类型和所述浏览器类型写入所述访问终端的Cookie。
[0040]本实施例所述的网页适配的方法，在所述访问终端下次进行访问时，可直接通过读取Cookie信息获取所述访问终端的屏幕尺寸、系统类型和浏览器类型。
[0041]对于步骤102，可以预先建立与各种浏览器类型、系统类型和屏幕类型匹配的终端模板库，所述浏览器类型可包括IE、UC、safari或本领域技术人员惯用的其他浏览器中的至少一种，所述系统类型可包括windows、Android、iOS或本领域技术人员惯用的其他系统中的至少一种，所述屏幕类型包括各种尺寸的台式电脑的屏幕、各种尺寸的平板电脑的屏幕、各种尺寸的手机的屏幕或本领域技术人员惯用的各种尺寸的其他访问终端的屏幕中的至少一种。
[0042]在一个实施例中，当屏幕类型为9.7英寸的平板电脑屏幕，若系统类型为windows、浏览器类型为IE时,终端模板为适于9.7英寸的PC版,若系统类型为Android,浏览器类型为适于9.7英寸的UC时，终端模板为智能机版，若系统类型为iOS、浏览器类型为safari，终端模板为适于9.7英寸的智能机版。
[0043]对于步骤103,所述URL为统一资源定位符(Uniform Resource Locator),是互联网上标准资源的地址，互联网上的每个文件都有一个唯一的URL，它包含的信息指出文件的位置以及浏览器应该怎么处理它。
[0044]在一个实施例中，所述根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面的步骤包括以下步骤:
[0045]根据所述屏幕类型、所述系统类型和所述浏览器类型，所述访问终端运行JS脚本进行URL重定向，定向到与所述终端模板匹配的访问页面。
[0046]或，
[0047]根据所述屏幕类型、所述系统类型和所述浏览器类型，服务器进行内部的URL重定向，定向到与所述终端模板匹配的访问页面。
[0048]或，
[0049]根据所述屏幕类型、所述系统类型和所述浏览器类型，服务器进行外部的URL重定向，定向到与所述终端模板匹配的访问页面。
[0050]其中，在所述定向到与所述终端模板匹配的访问页面的步骤之前，包括以下步骤:
[0051]根据各种终端模板，将待访问的数据内容预先生成或实时动态生成与各终端模板匹配的访问页面。
[0052]优选地，在所述定向到与所述终端模板匹配的访问页面的步骤之前，可包括以下步骤
[0053]判断是否已将所述终端待访问的数据内容生成与所述终端模板匹配的所述访问页面。
[0054]若否，则根据所述终端模板，将所述数据内容实时动态生成与所述终端模板匹配的所述访问页面。
[0055]对于步骤104，优选地，基于重定向后的URL，可通过服务器向所述访问终端返回所述访问页面，进行显示。
[0056]请参阅图2，图2是本发明网页适配的方法第二实施方式的流程示意图。
[0057]本实施方式的网页适配的方法与第一实施方式的区别在于:所述根据访问终端的访问请求，获取所述访问终端的屏幕尺寸、系统类型和浏览器类型的步骤包括以下步骤:
[0058]步骤201，分析所述访问终端运行JS脚本获取的所述访问请求的头部信息。
[0059]步骤202,根据所述头部信息内的x-wap-profile,从屏幕特征库中匹配出所述访问终端的屏.类型。
[0060]步骤203，根据所述头部信息内的UserAgent，从浏览器特征库和操作系统特征库中匹配出所述访问终端的系统类型和浏览器类型。
[0061]本实施方式的所述网页适配的方法，还可以通过分析所述访问终端运行JS脚本获取的所述头部信息内，再根据所述头部信息内的x-wap-profile和UserAgent,从屏幕特征库、浏览器特征库和操作系统特征库中匹配出所述访问终端的屏幕类型、系统类型和浏览器类型。
[0062]请参阅图3，图3是本发明网页适配的方法第三实施方式的流程示意图。
[0063]本实施方式的网页适配的方法与第一实施方式的区别在于:所述获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板的步骤还包括以下步骤:
[0064]步骤301，判断所述访问终端是否支持JS脚本、和/或html5、和/或预设的流媒体格式、和/或预设的流媒体播放协议。
[0065]步骤302，若是，则获取与所述屏幕类型、所述系统类型、所述浏览器类型和JS脚本、和/或html5、和/或预设的流媒体格式、和/或预设的流媒体播放协议对应的终端模板。
[0066]本实施方式所述的网页适配的方法，进一步判断所述访问终端是否支持JS、和/或html5、和/或预设的流媒体格式、和/或预设的流媒体播放协议，可提高访问页面与访问终端的匹配度。
[0067]请参阅图4，图4是本发明网页适配的刺痛第一实施方式的结构示意图。
[0068]本实施方式的所述网页适配的系统包括获取模块100、模板模块200、定向模块300和显示模块400，其中:[0069]获取模块100，用于根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型。
[0070]模板模块200，用于获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板。
[0071]定向模块300，用于根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面。
[0072]显示模块400，用于响应所述访问请求，在所述访问终端显示所述访问页面。
[0073]本实施方式所述的网页适配的系统，根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型，再获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板，进而根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面，最终响应所述访问请求，在所述访问终端显示所述访问页面，可快速从传统的PC站点建立移动站点，为多种访问终端分配与其屏幕类型、系统类型和浏览器类型匹配的访问页面，仅一套系统即可对多个站点进行便捷管理，方便后续扩展。
[0074]其中，对于获取模块100，所述访问终端包括各种型号的手机、台式电脑、和平板电脑中的至少一个，所述访问请求优选地包括USERAGENT信息和/或所述访问终端身份标识。
[0075]在一个实施例中，获取模块100可用于:
[0076]通过服务器接收所述访问终端发送的所述访问请求，并提取出所述访问请求的头
部信息。
[0077]根据所述头部信息内的x-wap-profile，从屏幕特征库中匹配出所述访问终端的
屏幕类型。
[0078]根据所述头部信息内的UserAgent，从浏览器特征库和操作系统特征库中匹配出所述访问终端的系统类型和浏览器类型。
[0079]其中，在提取出所述访问请求的头部信息后，获取模块100还可用于:
[0080]遍历所述头部信息的各字段，判断所述头部信息是否已存储在已知头部数据库中。
[0081]若是,则根据所述头部信息内的x-wap-profile,从屏幕特征库中匹配出所述访问终端的屏幕类型，根据所述头部信息内的UserAgent，从浏览器特征库和操作系统特征库中匹配出所述访问终端的系统类型和浏览器类型。
[0082]若否，则把所述访问终端的头部信息写入到未知头部信息库。
[0083]对于未知头部信息库，后期通过人工或机器干预的方式进行该未知头部信息的适配。
[0084]在另一个实施例中，获取模块100，还可进一步用于将所述屏幕类型、所述系统类型和所述浏览器类型写入所述访问终端的Cookie。
[0085]本实施例所述的网页适配的系统，在所述访问终端下次进行访问时，可直接通过读取Cookie信息获取所述访问终端的屏幕尺寸、系统类型和浏览器类型。
[0086]对于模板模块200，可以预先建立与各种浏览器类型、系统类型和屏幕类型匹配的终端模板库，所述浏览器类型可包括IE、UC、safari或本领域技术人员惯用的其他浏览器中的至少一种，所述系统类型可包括windows、Android、iOS或本领域技术人员惯用的其他系统中的至少一种，所述屏幕类型包括各种尺寸的台式电脑的屏幕、各种尺寸的平板电脑的屏幕、各种尺寸的手机的屏幕或本领域技术人员惯用的各种尺寸的其他访问终端的屏幕中的至少一种。
[0087]在一个实施例中，当屏幕类型为9.7英寸的平板电脑屏幕，若系统类型为windows、浏览器类型为IE时,终端模板为适于9.7英寸的PC版,若系统类型为Android,浏览器类型为适于9.7英寸的UC时，终端模板为智能机版，若系统类型为iOS、浏览器类型为safari，终端模板为适于9.7英寸的智能机版。
[0088]对于定向模块300,所述URL为统一资源定位符(Uniform Resource Locator),是互联网上标准资源的地址，互联网上的每个文件都有一个唯一的URL，它包含的信息指出文件的位置以及浏览器应该怎么处理它。
[0089]在一个实施例中，定向模块300可用于:
[0090]根据所述屏幕类型、所述系统类型和所述浏览器类型，所述访问终端运行JS脚本进行URL重定向，定向到与所述终端模板匹配的访问页面。
[0091]或，
[0092]根据所述屏幕类型、所述系统类型和所述浏览器类型，服务器进行内部的进行URL重定向，定向到与所述终端模板匹配的访问页面。
[0093]或，
[0094]根据所述屏幕类型、所述系统类型和所述浏览器类型，服务器进行外部的进行URL重定向，定向到与所述终端模板匹配的访问页面。
[0095]其中，定向模块300在定向到与所述终端模板匹配的访问页面的步骤之前，可根据各种终端模板，将待访问的数据内容生成与各终端模板匹配的访问页面。
[0096]优选地，定向模块300在定向到与所述终端模板匹配的访问页面之前，还可:
[0097]判断是否已将所述终端待访问的数据内容生成与所述终端模板匹配的所述访问页面。
[0098]若否，则根据所述终端模板，将所述数据内容生成与所述终端模板匹配的所述访问页面。
[0099]对于显示模块，优选地，基于重定向后的URL，可通过服务器向所述访问终端返回所述访问页面，进行显示。
[0100]以下所述是本发明网页适配的系统第二实施方式。
[0101]本实施方式的网页适配的系统与第一实施方式的区别在于:获取模块100还可用于:
[0102]分析所述访问终端运行JS脚本获取的所述访问请求的头部信息。
[0103]根据所述头部信息内的x-wap-profile，从屏幕特征库中匹配出所述访问终端的
屏幕类型。
[0104]根据所述头部信息内的UserAgent，从浏览器特征库和操作系统特征库中匹配出所述访问终端的系统类型和浏览器类型。
[0105]本实施方式的所述网页适配的系统，还可以通过分析所述访问终端运行JS脚本获取的所述头部信息内，再根据所述头部信息内的x-wap-profile和UserAgent,从屏幕特征库、浏览器特征库和操作系统特征库中匹配出所述访问终端的屏幕类型、系统类型和浏览器类型。
[0106]以下所述是本发明网页适配的系统第三实施方式。
[0107]本实施方式的网页适配的系统与第一实施方式的区别在于:模板模块200还可用于:
[0108]判断所述访问终端是否支持JS脚本、和/或html5、和/或预设的流媒体格式、和/或预设的流媒体播放协议。
[0109]若是，则获取与所述屏幕类型、所述系统类型、所述浏览器类型和JS脚本、和/或html5、和/或预设的流媒体格式、和/或预设的流媒体播放协议对应的终端模板。
[0110]本实施方式所述的网页适配的系统，进一步判断所述访问终端是否支持JS脚本、和/或html5、和/或预设的流媒体格式、和/或预设的流媒体播放协议，可提高访问页面与访问终端的匹配度。
[0111]以上所述实施例仅表达了本发明的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对本发明专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本发明构思的前提下，还可以做出若干变形和改进，这些都属于本发明的保护范围。因此，本发明专利的保护范围应以所附权利要求为准。
【权利要求】
1.一种网页适配的方法，其特征在于，包括以下步骤: 根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型； 获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板； 根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面； 响应所述访问请求，在所述访问终端显示所述访问页面。
2.根据权利要求1所述的网页适配的方法，其特征在于，所述根据访问终端的访问请求，获取所述访问终端的屏幕尺寸、系统类型和浏览器类型的步骤包括以下步骤: 通过服务器接收所述访问终端发送的所述访问请求，并提取出所述访问请求的头部信息； 根据所述头部信息内的x-wap-profile，从屏幕特征库中匹配出所述访问终端的屏幕类型； 根据所述头部信息内的UserAgent，从浏览器特征库和操作系统特征库中匹配出所述访问终端的系统类型和浏览器类型。
3.根据权利要求1所述的网页适配的方法，其特征在于，所述根据访问终端的访问请求，获取所述访问终端的屏幕尺寸、系统类型和浏览器类型的步骤包括以下步骤: 分析所述访问终端运行JS脚本获取的所述访问请求的头部信息； 根据所述头部信息内的x-wap-profile，从屏幕特征库中匹配出所述访问终端的屏幕类型；` 根据所述头部信息内的UserAgent，从浏览器特征库和操作系统特征库中匹配出所述访问终端的系统类型和浏览器类型。
4.根据权利要求2所述的网页适配的方法，其特征在于，在所述提取出所述访问请求的头部信息的步骤之后，还包括以下步骤: 遍历所述头部信息的各字段，判断所述头部信息是否已存储在已知头部数据库中；若是，则根据所述头部信息内的x-wap-profile,从屏幕特征库中匹配出所述访问终端的屏幕类型，根据所述头部信息内的UserAgent，从浏览器特征库和操作系统特征库中匹配出所述访问终端的系统类型和浏览器类型； 若否，则把所述访问终端的头部信息写入到未知头部信息库。
5.根据权利要求1所述的网页适配的方法，其特征在于，在所述根据访问终端的访问请求，获取所述访问终端的屏幕尺寸、系统类型和浏览器类型的步骤之后，还包括以下步骤: 将所述屏幕类型、所述系统类型和所述浏览器类型写入所述访问终端的Cookie。
6.根据权利要求1所述的网页适配的方法，其特征在于，所述根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面的步骤包括以下步骤: 根据所述屏幕类型、所述系统类型和所述浏览器类型，所述访问终端运行JS脚本进行URL重定向，定向到与所述终端模板匹配的访问页面； 或， 根据所述屏幕类型、所述系统类型和所述浏览器类型，服务器进行内部的URL重定向，定向到与所述终端模板匹配的访问页面； 或， 根据所述屏幕类型、所述系统类型和所述浏览器类型，服务器进行外部的URL重定向，定向到与所述终端模板匹配的访问页面。
7.根据权利要求6所述的网页适配的方法，其特征在于，在所述定向到与所述终端模板匹配的访问页面的步骤之前，包括以下步骤: 根据各种终端模板，将待访问的数据内容生成与各终端模板匹配的访问页面。
8.根据权利要求6所述的网页适配的方法，其特征在于，在所述定向到与所述终端模板匹配的访问页面的步骤之前，包括以下步骤: 判断是否已将所述终端待访问的数据内容生成与所述终端模板匹配的所述访问页面； 若否，则根据所述终端模板，将所述数据内容生成与所述终端模板匹配的所述访问页面。
9.根据权利要求1至8中任意一项所述的网页适配的方法，其特征在于，所述获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板的步骤还包括以下步骤: 判断所述访问终端是否支持JS脚本、和/或html5、和/或预设的流媒体格式、和/或预设的流媒体播放协议； 若是，则获取与所述屏幕类型、所述系统类型、所述浏览器类型和JS脚本、和/或html5、和/或预设的流媒体格式、和/或预设的流媒体播放协议对应的终端模板。
10.一种网页适配的系统，其特征在于，包括: 获取模块，用于根据访问终端的访问请求，获取所述访问终端的屏幕类型、系统类型和浏览器类型； 模板模块，用于获取与所述屏幕类型、所述系统类型和所述浏览器类型匹配的终端模板； 定向模块，用于根据所述屏幕类型、所述系统类型和所述浏览器类型，进行URL重定向，定向到与所述终端模板匹配的访问页面； 显示模块，用于响应所述访问请求，在所述访问终端显示所述访问页面。
【文档编号】G06F17/30GK103744985SQ201410021189
【公开日】2014年4月23日 申请日期:2014年1月16日 优先权日:2014年1月16日
【发明者】周国盛, 张颖, 刘涛, 陈剑恒, 香伟健, 黄柑波, 马幸晖, 潘浩 申请人:世纪龙信息网络有限责任公司