背景技术
网页浏览器是用来显示网页服务器或者档案***内的文件,并让用户与这些文件产生互动的一种软件。其中,网页显示的内容包括文字、影像或资讯信息。在实际应用中,如果浏览器需要在加载网页之后显示自定义的内容,需要工作人员另外制作界面来显示自定义的内容。此外,如果需要修改界面的内容则必须修改客户端应用程序的代码和资源。
图1示出了传统客户端修改界面代码至用户得到新界面程序的流程。
如图1所示,客户端修改界面代码至用户得到新界面的过程包括:
S110:对需要自定义的界面进行修改,此处对需要自定义的界面进行修改是通过修改客户端的代码来实现的;
S120:客户端开发人员修改对应的客户端代码,并准备相应的图片、样式等资源;
S130:测试后按流程提交上线,对修改之后的客户端应用程序的代码和资源进行测试,并按流程提交上线;
S140:通知用户更新应用。
其中,步骤S130测试后按流程提交上线的过程,一般会耗费很长时间,修改客户端的代码需要的测试会更多,在客户端出现问题的情况下,还必须重新修改代码上线,由此带来的问题就是改动大、耗费成本高。
图2示出了传统显示网页自定义内容的方法在客户端实现的流程。
如图2所示,传统显示网页自定义内容的方法在客户端实现包括:
S210:启动移动浏览器,向服务器发出请求资源信号,服务器返回需要加载自定义界面的网址列表;
S220:用户地址栏输入网址,点击加载,启动移动浏览器之后,用户在用户地址栏输入想要浏览的网址并点击进行加载;
S230:端判断当前网页是否需要加载自定义界面;
S240:加载用户输入的网页,当用户输入网址对应的网页需要加载自定义界面时,加载用户输入的网页;
S250:客户端弹出阻塞式的界面,在加载用户输入的网页之后,对含有自定义内容的界面进行显示;
S260:当用户输入的网址对应的网页不需要加载自定义界面时,走正常加载网页的流程,显示原有网页界面。
其中,使用客户端实现对自定义网页的显示,客户端原生界面阻挡用户进行网页浏览操作,自定义界面与原生网页风格不协调,网页修改客户端也需要进行修改,操作复杂。
利用传统方法***自定义内容时页面时的页面示意图如图9所示,页面左部打X的区域用户不可控,只有页面右部区域可以操作,制作的界面与原页面内容不协调。
综上所述,一般浏览器如果需要在加载网页后显示自定义的内容,需要修改界面则必须修改客户端应用程序的代码和资源,修改客户代码和界面的代价和耗费比较大;同时,需要另外制作界面来显示,这样制作的界面很难与原页面内容相协调,会在一定程度上阻碍用户对该网页的操作,用户体验差。
发明内容
鉴于上述问题,本发明的目的是提供一种显示网页自定义内容的方法及***,以解决目前显示网页自定义内容的方法中需要修改客户端的代码和资源,改动大、耗费成本高、自定义页面与原页面不协调的问题。
根据本发明的一个方面,提供了一种显示网页自定义内容的方法,包括:
当待访问的网页需要***自定义网页界面时,获取待访问的网页的网页源码,并停止对待访问的网页的渲染;
在获取的网页源码中查找需要***自定义网页界面的网页结点的位置;
根据所查找到的需要***自定义网页界面的网页结点的位置,将自定义网页界面的网页结点代码段***到所述网页源码中;
将***有自定义网页界面的网页结点代码段的网页源码进行网页渲染,并将渲染后的网页显示。
其中,根据自定义网页界面代码资源,在网页源码中查找需要***自定义网页界面的网页结点的位置;其中,自定义网页界面代码资源包括:需要***自定义网页界面的网页的网址、自定义网页界面的网页结点的***位置以及自定义网页界面的网页结点代码段。
其中,还包括:获取需***自定义网页界面的网址列表和所述自定义网页界面的代码资源;根据所述需***自定义网页界面的网址列表判断待访问的网页是否需要***自定义网页界面;当待访问的网页需要***自定义网页界面时,获取待访问的网页的网页源码,停止对所述待访问的网页的渲染;当待访问的网页不需要***自定义网页界面时,继续浏览网页的流程,正常显示原有网页。
其中,通过动态脚本将显示自定义网页界面的网页结点代码段***到网页源码中。
其中,动态脚本为JavaScript、jquery或者php。
另一方面,本发明还提供一种显示网页自定义内容的***,包括:
网页源码获取单元,用于在待访问的网页需要***自定义网页界面时,获取待访问的网页的网页源码,并停止对待访问的网页的渲染;
位置查找单元,用于在获取待访问的网页的网页源码之后,根据自定义网页界面代码资源获取需要***自定义网页界面的网页结点的位置;
网页结点***单元,用于根据所查找到的需要***自定义网页界面的网页结点的位置,将自定义网页界面的网页结点的内容***到网页源码中;
网页显示单元,用于将***有自定义网页界面的网页结点的内容的网页源码进行网页渲染,并将渲染后的网页呈现给用户。
其中,在位置查找单元中,自定义网页界面代码资源包括:需要***自定义网页界面的网页的网址、自定义网页界面的网页结点的***位置以及自定义网页界面的网页结点代码段。
其中,在网页源码获取单元中,进一步包括:网址判断单元,用于获取需***自定义网页界面的网址列表和自定义网页界面的代码资源,并根据需***自定义网页界面的网址列表判断待访问的网页是否需要***自定义网页界面;当待访问的网页需要***自定义网页界面时,获取待访问的网页的网页源码,通知网页显示单元停止对待访问的网页的渲染;当待访问的网页不需要***自定义网页界面时,通知网页显示单元继续浏览网页的流程,正常显示原有网页。
其中,在网页结点***单元中,是通过动态脚本将显示自定义网页界面的网页结点代码段***到网页源码中。
其中,动态脚本为JavaScript、jquery或者php。
利用上述根据本发明的显示网页自定义内容的方法及***,可以在不修改移动客户端的情况下,通过服务器下发网址列表和自定义网页内容资源,实现用户打开网页后,显示添加自定义内容后的网页,避免显示自定义内容需要修改客户端代码和界面的情况发生,减轻了人力和资源的耗费,并且不需要额外生成界面显示自定义页面,不会阻碍用户的操作,提高用户的浏览体验。
为了实现上述以及相关目的,本发明的一个或多个方面包括后面将详细说明并在权利要求中特别指出的特征。下面的说明以及附图详细说明了本发明的某些示例性方面。然而,这些方面指示的仅仅是可使用本发明的原理的各种方式中的一些方式。此外,本发明旨在包括所有这些方面以及它们的等同物。
具体实施方式
以下将结合附图对本发明的具体实施例进行详细描述。
出于说明的目的,在下面对本发明具体实施方式的表述中,“移动浏览器”和“客户端”为同一概念,也可以将“移动浏览器”理解为“客户端”的一种但不是唯一的一种具体表现形式。
图3示出了根据本发明实施例的显示网页自定义内容的方法的流程。
如图3所示,本发明提供的显示网页自定义内容的方法包括:
S310:待访问的网页需要***自定义网页界面时,获取待访问的网页的网页源码,并停止对待访问的网页的渲染。
其中,在用户向移动浏览器输入要访问的网址之前,启动移动浏览器,在启动移动浏览器的同时会发出请求自定义网页的网页源码资源的信息。在移动浏览器向服务器发起请求时,还包括获取***自定义网页界面的网址列表和与网址列表中的网址相对应的自定义界面的代码资源。对于***自定义网页界面的网址列表和与网址列表中的网址相对应的自定义界面的代码资源的获取可以通过服务器下发到客户端,也可以预置在客户端中。
此外,在该步骤中当用户输入的网址不在需要***自定义网页界面的网址列表中时,继续浏览网页的流程,正常显示原有网页。
S320:在获取的网页源码中查找需要***自定义网页界面的网页结点的位置。
该步骤中,根据自定义网页界面代码资源,在网页源码中查找需要***自定义网页界面的网页结点的位置,其中,
自定义网页界面代码资源包括:需要***自定义网页界面的网页的网址、自定义网页界面的网页结点的***位置以及自定义网页界面的网页结点代码段。
S330:根据所查找到的需要***自定义网页界面的网页结点的位置,将自定义网页界面的网页结点代码段***到所述网页源码中,其中,
在根据所查找到的需要***显示自定义网页界面的网页结点的位置,通过动态脚本将显示自定义网页界面的网页结点的内容***到网页源码中,其中的动态脚本为JavaScript、jquery或者php。其中,Jquery是轻量级的JavaScript库;PHP(Hypertext Preprocessor,超文本预处理器)。
S340:将***有显示自定义网页界面的网页结点的内容的网页源码进行网页渲染,并将渲染后的网页呈现给用户。
在该步骤中将渲染后的含有自定义内容的网页界面显示给用户之后,显示的含有自定义网页界面的网页还可以进行操作,不会对用户造成阻塞,自定义界面使用嵌入网页结点的方式实现,确保与原网页融为一体。
需要说明的是,本发明提供的显示网页自定义内容的方法还包括:获取需***自定义网页界面的网址列表和自定义网页界面代码资源。根据需***自定义网页界面的网址列表判断待访问的网页是否需要***自定义网页界面;当待访问的网页需要***自定义网页界面时,获取待访问的网页的网页源码,停止对待访问的网页的渲染;当待访问的网页不需要***自定义网页界面时,继续浏览网页的流程,正常显示原有网页。
其中,需***自定义网页界面的网址列表和自定义网页界面代码资源可以通过服务器下发到客户端,也可以预置在客户端中。
其中,在用户打开网页时会请求对应的网页服务器网页源码的资源,之后网页服务器返回网页源码的信息,例如,访问www.xx.com,则向该网页服务器发起http请求,获取到网页源码后停止网页渲染描绘的流程,根据对应的下发的自定义界面代码资源,遍历网页源码,查找到需要添加自定义网页结点代码的网页结点的位置。
本发明的显示网页自定义内容的方法,这样可以在不修改移动客户端的情况下,通过服务器下发网址列表和自定义网页内容资源,实现用户打开网页后,显示添加自定义内容后的网页,避免显示自定义内容需要修改客户端代码和界面的情况发生,减轻了人力和资源的耗费,并且不需要额外生成界面显示自定义页面,不会阻碍用户的操作,提高用户体验。
本发明的显示网页自定义内容的方法主要是通过增加网页结点来实现的,图4示出了根据本发明实施例的显示网页自定义内容的方法在需要修改界面时的流程。
如图4所示,显示网页自定义内容的方法在需要修改界面时的流程包括:
S410:对需要自定义的界面进行修改,此时的修改是通过增加网页结点的方法来实现的。
S420:客户端开发人员修改自定义网页的代码,并准备图片、样式等资源。
在这一步骤中采用增加网页结点来显示网页自定义内容,通过更新自定义网页的代码实现对自定义界面内容的更新,避免通过反复修改客户端的代码实现对自定义界面的修改。
S430:将修改测试后的自定义界面的代码和资源部署到服务器。
其中,自定义界面的代码修改测试后马上部署到服务器,用户可以立刻获取到最新的自定义界面,在出现问题之后,可以通过对自定义网页的代码进行修改来实现对自定义界面的修改,不需要花费很长时间对客户端代码进行修改。
S440:用户不需要更新应用,启动移动浏览器即可获得最新的自定义界面。本发明的显示网页自定义内容的方法通过增加网页结点来实现,可以在不修改移动客户端的情况下,通过服务器下发网址列表和自定义网页内容资源,实现用户打开网页后,显示添加自定义内容后的网页,避免显示自定义内容需要修改客户端代码和界面的情况发生,减轻了人力和资源的耗费。
具体地,图5示出了根据本发明实施例的显示网页自定义内容的方法详细流程。
如图5所示,显示网页自定义内容的方法想详细流程包括:
S510:启动移动浏览器,通过用户启动移动浏览器,客户端向服务器发出请求资源的信号,同时服务器下发客户端需要***自定义网页界面的网址列表和对应的自定义界面代码资源。
其中,客户端获取一套需要***自定义网页界面的网址列表和对应的自定义界面代码资源的过程中,需要***自定义网页界面的网址列表和对应的自定义界面代码资源可以通过服务器下发到客户端,也可以预置在客户端中。一个自定义界面代码对应同一域名下的子域名的网页,同一个域名下的网页的写法一般是类似的,可以通过同一套代码适配。
具体地,需要***自定义网页界面的网址列表用于判断当前页面的网页源码是否需要加入自定义界面,当当前页面(即用户输入的网址所对应的网页页面)所对应的网址在需要***自定义网页界面的网址列表中时,需要***网页结点的位置以及显示自定义网页界面的网页结点的内容可以在自定义界面代码资源中找到。其中,自定义界面代码资源的数据结构如表1所示:
表1
S520:用户输入网址,并点击加载。
具体地,用户向启动的移动浏览器的用户地址栏中输入需要访问的网址并进行加载,于此同时,客户端发起对自定义网页源码的资源的请求。
S530:判断网址是否在需要***自定义网页界面的网址列表中,当输入网址在需要***自定义网页界面的网址列表中时,进入步骤S540,否则进入步骤S580。
具体地,通过客户端来判断用户输入的网址是否在需要***自定义网页界面的网址列表中,并根据判断结果执行下一步内容,如果用户输入的网址不在需要***自定义网页界面的网址列表中,则继续浏览网页的流程,正常显示原有网页。
S540:获取网页源码。
当用户输入的网址在需要***自定义网页界面的网址列表中时,停止网页渲染的流程,并向该网页服务器发起http请求,获取对应网页源码的信息。
S550:查找需要***网页结点的位置。
其中,***网页结点的位置通过服务器下发,获得服务器下发的***结点位置后,通过动态脚本在网页源码中找到相应的***位置,并进行自定义界面的***。在查找需要***网页结点的位置的过程中,根据自定义界面代码资源,遍历网页源码,确定添加自定义网页界面需要添加的网页结点的位置。其中,在本发明的一个具体实施方式中使用JavaScript提供的***网页结点的方法appendChild在网页源码中***显示自定义网页界面的网页结点,在客户端不需要添加额外的界面层代码的情况下,实现在网页上添加自定义的内容界面,丰富显示的内容。
S560:网页结点的***。
通过动态脚本在网页源码中***显示自定义网页界面的网页结点的内容。其中,通过脚本在网页源码***自定义的网页结点中,自定义网页界面使用嵌入网页结点的方式实现。而嵌入的脚本本质上是一段文本,支持下发,***结点的操作也是通用的。只需要保证***自定义界面结点后的网页可以显示正常,就可以实现不修改客户端的情况下,在不同的网页中***任意的界面。在通过动态脚本将显示自定义网页界面的网页结点的内容***到网页源码的过程中,该动态脚本为JavaScript、jquery或者php。
S570:网页显示。
将***有显示自定网页界面的网页结点的新的网页提交浏览内核渲染,并将含有自定义网页界面的网页进行显示。出现需要显示是界面之后,用户还可以对网页进行操作,不会对用户造成阻塞,自定义界面使用嵌入网页结点方式实现,与原网页融为一体。
S580:正常显示原有网页。
具体地,当用户输入的网址网址不在需要***自定义网页界面的网址列表中时,则继续浏览网页的流程,正常显示原有网页。
本发明显示网页自定义内容的方法实施例中使用了一种网页动态脚本语言JavaScript来进行网页结点的遍历和***,在客户端不需要添加额外的界面层代码的情况下,在网页上添加自定义的内容界面,丰富显示内容。
综上所述,本发明的显示网页自定义内容的方法在用户向地址栏内填入网址并进行网页访问后,如果当前访问的网页需要加载自定义界面,则中断对于网页结点的渲染操作,并截取用户访问的网址的服务器返回的网页源码,在需要***网页结点的位置新建网页结点,***自定义界面到网页,然后再进行网页结点渲染显示的操作。而***的自定义界面对于应用程序来说是外部的一个资源文件,可以支持服务器动态更新下发,客户端只需要再下发新的自定义网页界面资源之后更新数据则可,不需要修改客户端的代码和资源,通过服务器下发网址列表和自定义网页内容资源,实现用户打开网页后,显示添加自定义内容后的网页。
在ipad***平台上,UC浏览器和资源下发服务器实现了本发明的显示自定义网页内容的方法。
下述具体实例将对本发明的显示自定义网页内容的方法进行再次说明。
1、启动浏览器,之后浏览器会请求后台资源下发服务器,获取需要***自定义网页界面的网址列表和对应的自定义界面代码资源。
图8示出了根据本发明实施例的显示网页自定义内容的方法中自定义结点对应的网页显示图。
例如,若用户想要访问的网址www.jd.com在需要***自定义网页界面的网址列表中,则对应网站的服务器下发的自定义结点对应的网页显示如图8所示,其中显示的内容会根据网站网页的不同而显示不同的比价信息。
2、用户使用浏览器打开网页,在对网页服务器发起网页请求前,服务器判断需访问的网页的域名是否在需要***自定义网页界面的网址列表,如果不在域名列表中,例如此时访问www.***.com,则走正常的网页浏览流程。
3、如果当前的域名在需要***自定义网页界面的网址列表中的时,例如访问www.XX.com,则向该网页服务器发起http请求,获取到网页源码后停止网页渲染描绘的流程,根据对应的下发的自定义界面代码资源,遍历网页源码,查找到需要添加自定义网页结点代码的网页结点位置。
4、查找到需要***网页代码资源的网页结点位置后,使用JavaScript的***网页结点的方法,***步骤1中服务器下发的自定义的网页结点代码。
5、将***的自定义的网页结点代码后的网页源码提交浏览器内核进行网页渲染和描绘,显示给用户添加了自定义界面的网页。
图7示出了本发明实施例的显示网页自定义内容的方法中添加自定义界面之后的网页显示图。
如图7所示,通过本发明的显示网页自定义内容的方法添加的自定义界面就是图7中左下方大方框内的界面,显示出比价的信息,且网页界面为一体,不会阻碍用户对网页的操作。
与上述方法相对应,本发明还提供了一种显示网页自定义内容的***,图6示出了根据本发明实施例的显示网页自定义内容的***逻辑结构。
如图6所示,本发明提供的显示网页自定义内容的***600包括网页源码获取单元610、位置查找单元620、网页结点***单元630、网页显示单元640。
其中,网页源码获取单元610用于在待访问的网页需要***自定义网页界面时,获取待访问的网页的网页源码,并停止对待访问的网页的渲染;位置查找单元620用于在获取待访问的网页的网页源码之后,根据自定义网页界面代码资源获取需要***自定义网页界面的网页结点的位置;网页结点***单元630用于根据所查找到的需要***自定义网页界面的网页结点的位置,将自定义网页界面的网页结点的内容***到所述网页源码中;网页显示单元640用于将***有自定义网页界面的网页结点的内容的网页源码进行网页渲染,并将渲染后的网页呈现给用户。
其中,网页源码获取单元610进一步包括:网址判断单元(图中未示出),用于根据需***自定义网页界面的网址列表判断待访问的网页是否需要***自定义网页界面,即移动浏览器根据用户输入的网址向服务器发起访问请求时,移动浏览器判断用户输入的网址是否在需要***自定义网页界面的网址列表中,当待访问的网页需要***自定义网页界面时,获取待访问的网页的网页源码,通知网页显示单元640停止对待访问的网页的渲染,当待访问的网页不需要***自定义网页界面时,通知网页显示单元640继续浏览网页的流程,正常显示原有网页。
其中,在位置查找单元620中,自定义网页界面代码资源包括:需要***自定义网页界面的网页的网址、自定义网页界面的网页结点的***位置以及自定义网页界面的网页结点代码段。
其中,在网页结点***单元630中,通过动态脚本将显示自定义网页界面的网页结点的内容***到网页源码中,***节点位置通过服务器下发,获取到服务器下发的***节点位置后,由动态脚本在网页源码中找到相应的位置并***新建网页结点。
需要说明的是,在网页结点***单元630中,动态脚本为JavaScript、jquery或者php等。
通过本发明的显示网页自定义内容的方法及***,解决了显示自定义内容时客户端代码和界面需要修改的情况,减轻了人力和资源的耗费,操作方式灵活,同时也可以提供用户丰富的浏览体验。
如上参照附图以示例的方式描述根据本发明的显示网页自定义内容的方法及***。但是,本领域技术人员应当理解,对于上述本发明所提出的显示网页自定义内容的方法及***,还可以在不脱离本发明内容的基础上做出各种改进。因此,本发明的保护范围应当由所附的权利要求书的内容确定。