CN109828815A - 基于混合模式的屏幕适配方法、装置、设备及存储介质 - Google Patents
基于混合模式的屏幕适配方法、装置、设备及存储介质 Download PDFInfo
- Publication number
- CN109828815A CN109828815A CN201910048325.XA CN201910048325A CN109828815A CN 109828815 A CN109828815 A CN 109828815A CN 201910048325 A CN201910048325 A CN 201910048325A CN 109828815 A CN109828815 A CN 109828815A
- Authority
- CN
- China
- Prior art keywords
- client
- web page
- equipment information
- hardware equipment
- mixed mode
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 54
- 230000006978 adaptation Effects 0.000 title claims abstract description 48
- 238000003860 storage Methods 0.000 title claims abstract description 22
- 230000004044 response Effects 0.000 claims abstract description 28
- 230000005540 biological transmission Effects 0.000 claims abstract description 11
- 230000003044 adaptive effect Effects 0.000 claims description 20
- 238000004590 computer program Methods 0.000 claims description 20
- 238000005538 encapsulation Methods 0.000 claims description 6
- 238000004458 analytical method Methods 0.000 claims description 2
- 238000011160 research Methods 0.000 abstract description 2
- 230000006870 function Effects 0.000 description 13
- 238000013461 design Methods 0.000 description 7
- 238000011161 development Methods 0.000 description 7
- 230000008569 process Effects 0.000 description 6
- 238000010586 diagram Methods 0.000 description 5
- 230000000694 effects Effects 0.000 description 3
- 238000012827 research and development Methods 0.000 description 3
- 230000009471 action Effects 0.000 description 2
- 239000008186 active pharmaceutical agent Substances 0.000 description 2
- 239000003795 chemical substances by application Substances 0.000 description 2
- 238000004891 communication Methods 0.000 description 2
- 238000009826 distribution Methods 0.000 description 2
- 238000013507 mapping Methods 0.000 description 2
- 239000000203 mixture Substances 0.000 description 2
- 238000012545 processing Methods 0.000 description 2
- 238000009877 rendering Methods 0.000 description 2
- 230000001960 triggered effect Effects 0.000 description 2
- 244000062793 Sorghum vulgare Species 0.000 description 1
- 230000002159 abnormal effect Effects 0.000 description 1
- 238000004364 calculation method Methods 0.000 description 1
- 239000002775 capsule Substances 0.000 description 1
- 230000010485 coping Effects 0.000 description 1
- 230000002708 enhancing effect Effects 0.000 description 1
- 238000000605 extraction Methods 0.000 description 1
- PCHJSUWPFVWCPO-UHFFFAOYSA-N gold Chemical compound [Au] PCHJSUWPFVWCPO-UHFFFAOYSA-N 0.000 description 1
- 239000010931 gold Substances 0.000 description 1
- 229910052737 gold Inorganic materials 0.000 description 1
- 230000010365 information processing Effects 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 238000004519 manufacturing process Methods 0.000 description 1
- 235000019713 millet Nutrition 0.000 description 1
- 238000002360 preparation method Methods 0.000 description 1
- 230000003068 static effect Effects 0.000 description 1
- 230000001360 synchronised effect Effects 0.000 description 1
Landscapes
- Information Transfer Between Computers (AREA)
Abstract
本发明公开了一种基于混合模式的屏幕适配方法、装置、设备及存储介质，所述方法包括：客户端通过客户端的本地软件开发套件获取客户端的硬件设备信息，并在初始化本地Web界面时，将硬件设备信息封装到浏览器对象中，以Web页面请求的形式发送到服务端；服务端接收到客户端发送的Web页面请求后，对其中的浏览器对象进行解析，得到硬件设备信息，并生成与客户端匹配的目标Web页面，将目标Web页面中的数据作为响应数据返回给客户端。本发明的技术方案解决了智能终端设备的屏幕分辨率与UI界面不能准确适配，以及因其带来的研发成本高的问题。
Description
技术领域
本发明涉及信息处理领域，尤其涉及基于混合模式的屏幕适配方法、装置、设备及存储介质。
背景技术
智能手机的屏幕适配问题一直伴随着智能手机的发展。由于智能手机的硬件制造商、以及如苹果、谷歌、华为、三星公司等行业巨头没有制定统一的规范和标准，手机APP的开发者们不得不为不同的硬件分辨率分别设计UI布局，才能使得APP能在不同智能手机上完美显示。这增加了开发者们的工作量，同时也提高了研发成本。
通常解决智能手机的屏幕适配问题，都是通过在网络服务端查询当前设备的分辨率，然后进行适配。然而，随着新产品的不断出现，各种“另类”的设计或不常见的分辨率使得原本就不十分准确的适配方式更加不能满足现实的需要。
例如，苹果公司的新一代机型iphoneX作为首款“全屏幕”手机，采用了双曲面OLED苹果显示屏，屏幕尺寸达到5.8英寸，支持最大分辨率为1125*2436；但iPhoneX有特殊的“安全区域”设计，除去其上下两端的安全区域，其实际可用的逻辑分辨率却为375*812，因此，即使是专门为375*812分辨率设计的UI也需要区分iPhoneX机型和非iPhoneX机型，才能正常显示，即若遇到分辨率相同的iPhoneX设备和非设备就不能准确的适配。
发明内容
本发明实施例提供一种基于混合模式的屏幕适配方法、装置、设备及存储介质，以解决智能终端设备的屏幕分辨率与UI界面不能准确适配，以及因其带来的研发成本高的问题。
一种基于混合模式的屏幕适配方法，应用于客户端，包括：
通过所述客户端的本地软件开发套件获取所述客户端的硬件设备信息；
在初始化本地Web界面时，将所述硬件设备信息封装到浏览器对象中，并将包含所述浏览器对象的Web页面请求发送到服务端；
接收所述服务端发送的根据所述硬件设备信息适配的响应数据，并根据所述响应数据更新所述本地Web界面。
一种基于混合模式的屏幕适配方法，应用于服务端，包括：
接收客户端发送的Web页面请求；
从所述Web页面请求中获取浏览器对象，对所述浏览器对象进行解析，得到所述客户端的硬件设备信息；
根据所述硬件设备信息，生成与所述客户端相匹配的目标Web页面；
将所述目标Web页面中的数据作为所述Web页面请求的响应数据，并返回给所述客户端。
一种基于混合模式的屏幕适配装置，应用于客户端，包括：
信息获取模块，用于通过所述客户端的本地软件开发套件获取所述客户端的硬件设备信息；
第一封装发送模块，用于在初始化本地Web界面时，将所述硬件设备信息封装到浏览器对象中，并将包含所述浏览器对象的Web页面请求发送到服务端；
显示模块，用于接收所述服务端发送的根据所述硬件设备信息适配的响应数据，并根据所述响应数据更新所述本地Web界面。
一种基于混合模式的屏幕适配装置，应用于服务端，包括：
第一接收模块，用于接收客户端发送的Web页面请求；
第一解析模块，用于从所述Web页面请求中获取浏览器对象，对所述浏览器对象进行解析，得到所述客户端的硬件设备信息；
页面生成模块，用于根据所述硬件设备信息，生成与所述客户端相匹配的目标Web页面；
响应模块，用于将所述目标Web页面中的数据作为所述Web页面请求的响应数据，并返回给所述客户端。
一种计算机设备，包括存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现上述基于混合模式的屏幕适配方法。
一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序被处理器执行时实现上述基于混合模式的屏幕适配方法。
上述基于混合模式的屏幕适配方法、装置、设备及存储介质，在客户端，利用了客户端本地软件开发套件获取硬件设备信息的准确性，通过客户端的本地软件开发套件获取客户端的硬件设备信息，并在初始化本地Web界面时，将硬件设备信息封装到浏览器对象中，以Web页面请求的形式发送到服务端；在服务端，接收到客户端发送的Web页面请求后，对其中的浏览器对象进行解析，得到硬件设备信息，并生成与客户端匹配的目标Web页面，将目标Web页面中的数据作为响应数据返回给客户端，使得服务端可以根据硬件设备信息生成适用于客户端的Web页面，实现了一种基于混合模式的适配方式，从而让UI界面能在不同屏幕分辨率的智能终端设备上进行准确适配，并降低了研发成本。
附图说明
为了更清楚地说明本发明实施例的技术方案，下面将对本发明实施例的描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。
图1是本发明一实施例中基于混合模式的屏幕适配方法的一应用环境示意图；
图2是本发明一实施例中基于混合模式的屏幕适配方法的一流程图；
图3是本发明一实施例中基于混合模式的屏幕适配方法的另一流程图；
图4是本发明一实施例中基于混合模式的屏幕适配方法中服务端根据硬件设备信息，生成与客户端相匹配的目标Web页面的一流程图；
图5是本发明一实施例中基于混合模式的屏幕适配装置的一示意图；
图6是本发明一实施例中基于混合模式的屏幕适配装置的另一示意图；
图7是本发明一实施例中计算机设备的一示意图；
图8是本发明一实施例中计算机设备的另一示意图。
具体实施方式
下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
本发明提供的基于混合模式的屏幕适配方法，可应用在如图1的应用环境中，其中，客户端是需要进行屏幕适配的智能终端设备，包括但不限于基于Android或iOS系统的智能手机、平板电脑、穿戴设备、智能车载设备等；服务端是向客户端提供UI界面的计算机设备，服务端可以是服务器或服务器集群；客户端与服务端之间通过网络连接，网络可以是有限网络或无线网络。本发明实施例提供的基于混合模式的屏幕适配方法有赖于客户端和服务端的共同协作完成。
在一实施例中，如图2所示，提供了一种基于混合模式的屏幕适配方法，其具体实现流程包括如下步骤：
S10：客户端通过客户端的本地软件开发套件获取客户端的硬件设备信息。
本地软件开发套件即客户端本地的SDK(软件开发套件，Software DevelopmentKit)库。SDK库是设备制造商或软件服务商提供的开发接口。SDK库中包括很多API(Application Programming Interface,应用程序编程接口)接口，即一些预先定义的函数，通过这些API接口可以访问硬件信息，或者提供给开发人员做二次开发。例如，Google公司在提供的Android开源项目中就有SDK库，像华为、小米等其他智能设备制造商的开发人员可以通过SDK库进行二次开发，做出一些定制应用软件；苹果公司同样也为开发人员提供SDK库，让其在运行iOS系统的智能手机、Mac机或iPad上开发APP。
硬件设备信息是客户端的基本硬件信息，硬件设备信息包括但不限于客户端的屏幕尺寸，支持的分辨率，设备制造商名称，设备型号，CPU、内存、GPS、蓝牙、G-sensor，P-sensor等硬件模块信息，以及所使用的操作系统、版本号等信息。
不同的设备制造商或软件服务商提供的SDK库不同。例如，Google公司提供的Android SDK库与苹果公司提供的iOS SDK库不能通用，因此在Android设备和iOS设备上获取硬件设备信息的方法有所不同，需要调用不同的API去实现获取客户端的硬件设备信息的功能。
具体地，客户端在安装了服务端提供的APP之后，客户端可以通过调用本地软件开发套件获取客户端的硬件设备信息。
举例来说，若要获取客户端的分辨率，则对于Android设备，客户端可以在Activity中调用getResources().getDisplayMetrics()函数获取屏幕对象，从而得到Android设备宽高所对应的分辨率，如获得的分辨率为720*1280px，其中，px是像素单位。对于iOS设备，客户端可以调用UIScreenmainScreen类的方法获取屏幕对象，从而得到iOS设备宽高所对应的分辨率，如获得的分辨率为375*812pt，其中，pt即point，单位是点，是iOS开发中用到的单位。此外，针对于Android设备，客户端可以通过Android的SDK库函数android.os.Build.MODEL()获取客户端的设备型号，通过Android的SDK库函数android.os.Build.MANUFACTURER()获取设备的制造商名。与之类似，对于iOS设备，客户端也可以通过UIDevice类的systemVersion()方法获取当前系统版本。
S11：客户端在初始化本地Web界面时，将硬件设备信息封装到浏览器对象中，并将包含浏览器对象的Web页面请求发送到服务端。
本地Web界面是在客户端用以显示服务端提供的Web页面的数据容器。
具体地，Web界面可以是控件，例如Webview控件。Webview是一个基于webkit引擎、展现web页面的控件，是一个APP客户端开发中常用到的一个控件，Android的SDK和iOS的SDK均支持这个控件。WebView控件功能强大，除了具有一般View的属性和设置外，还可以对url请求、页面加载、渲染、页面交互进行强大的处理。其中，webkit引擎是一个遵循Http协议的浏览器引擎。基于webkit的Webview相当于浏览器。在客户端，Webview可以用来显示Web页面。
浏览器对象，即Navigator对象，是在Web前端开发中经常用到的一个数据结构，它包含了有关浏览器的信息。通过Navigator对象，Web服务端可以获取浏览器的基本信息，并以此作为信息交互的基础。
Navigator对象的属性包括浏览器的名称appName，浏览器的平台和版本信息appVersion，浏览器的CPU等级cpuClass，浏览器的操作系统平台platform，返回由客户端发送服务端的user-agent头部的值userAgent等。其中，userAgent声明了浏览器用于HTTP请求的用户代理头的值。通过userAgent，服务端能够识别客户端使用的操作系统版本、CPU类型、浏览器版本、浏览器渲染引擎、浏览器语言、浏览器插件等信息。同时，客户端也可以添加一些自定义的字串信息在里面，以达到传递额外信息给Web服务端的目的。
Web页面请求是客户端向服务端发起的HTTP或HTTPS数据请求。Web页面请求具体可以通过客户端的浏览器发送，也可以通过客户端上APP中的自定义的套接字(socket)发送。服务端将根据Web页面请求返回数据。
具体地，客户端在启动Webview时，可以将硬件设备信息按照预设的格式添加到浏览器对象中。例如，将字符串数组{“Android”，“5.1”，“720*1280”，“HUAWEITIT-AL00”...}插入到Navigator对象的userAgent参数中。其中，字符串数组中的元素按照预设的格式排列，字串数组中的第一个元素为客户端的操作系统，第二个元素为操作系统的版本号，第三个元素为分辨率，第四个元素为厂家型号等等。
以Android设备为例，客户端在启动Webview后，通过调用setUserAgentString()设置userAgent的值，将字符串数组插入到原始userAgent信息之后。
S12：服务端接收客户端发送的Web页面请求。
服务端上部署有Web服务器，可以接收来自客户端的Web页面请求，并将客户端请求的数据返回给客户端。
具体地，服务端上可以部署的Web服务器包括但不限于IIS，Apache等。其中，IIS是由微软公司提供的基于运行Microsoft Windows系统的Web服务器；Apache是Apache软件基金会的一个开放源码的网页服务器。
S13：服务端从Web页面请求中获取浏览器对象，对浏览器对象进行解析，得到客户端的硬件设备信息。
服务端接收到Web页面请求后，从中获取并解析浏览器对象，得到客户端的硬件设备信息。
具体地，当服务端收到一个HTTP/HTTPS请求时，服务端的Web容器将HTTP/HTTPS请求中的信息解析并封装成两个对象，与请求数据对应的HttpServletRequest对象和与响应对应的HttpServletResponse对象。其中，Web容器是用于响应浏览器请求的通信实体，HttpServletRequest对象代表客户端的请求，客户端通过HTTP/HTTPS协议访问服务端时，HTTP/HTTPS请求中所有消息都封装在这个对象中，也包括了浏览器对象。通过这个HttpServletRequest对象自带的方法，服务端就可以获取并解析浏览器对象，从而得到客户端的硬件设备信息。例如，服务端可以通过获取HttpServletRequest对象中navigator对象下的userAgent字段里包括的字符信息，从而得到客户端封装的关于硬件设备信息的字串数组。
S14：服务端根据硬件设备信息，生成与客户端相匹配的目标Web页面。
与客户端相匹配的目标Web页面，即目标Web页面的UI布局适用于客户端的分配率，使得在客户端看到的Web页面能够完整显示。例如，因为iPhoneX的屏幕有特殊的“安全区域”设计，则同样是375*812分辨率的设备，与iPhoneX匹配的目标Web页面不同于与非iPhoneX匹配的目标Web页面。因此，需要根据硬件设备信息生成与客户端精确匹配的目标Web页面。
目标Web页面即部署在服务端的HTML文件。其中，HTML文件也可以是基于HTML5标准的HTML文件。HTML5简称H5，是新一代的HTML标准，它的设计目的是为了在移动设备上支持多媒体。
具体地，若当前硬件设备信息显示客户端是一个iPhoneX设备，其分辨率是375*812，则服务端可以将HTML文件中head标签下的字体设置为12号；若当前硬件设备信息显示客户端是一个iPhone8设备，其分辨率为375*667，则服务端可以将HTML文件中head标签下的字体设置为10号；这是因为虽然iPhoneX与iPhone8的宽度一样，但iPhoneX要更高，HTML页面中标题字体在iPhoneX中可以更大一些，这样浏览器呈现出的页面才和UI设计时一样。
S15：服务端将目标Web页面中的数据作为Web页面请求的响应数据，并返回给客户端。
Web页面请求的响应数据即客户端向服务端请求的Web页面中的内容信息。
目标Web页面中的数据即HTML文件中各标签内的值，这些值将被返回到客户端的浏览器中显示。例如，HTML文件中body标签内的字符将返回到客户端的浏览器中，并显示在客户端屏幕上。
具体地，服务端的Web服务器如IIS，Apache等可以将目标Web页面中的数据返回给客户端的浏览器中，并由客户端显示出来。
S16：接收服务端发送的根据硬件设备信息适配的响应数据，并根据响应数据更新本地Web界面。
其中，根据硬件设备信息适配的响应数据即目标Web页面中的数据。客户端接收到响应数据后，将响应数据代入到浏览器中，对初始化后的Web界面进行重新赋值，即可得到适配后的页面。
在本实施例中，在客户端，利用了客户端本地软件开发套件获取硬件设备信息的准确性，通过客户端的本地软件开发套件获取客户端的硬件设备信息，并在初始化本地Web界面时，将硬件设备信息封装到浏览器对象中，以Web页面请求的形式发送到服务端；在服务端，接收到客户端发送的Web页面请求后，对其中的浏览器对象进行解析，得到硬件设备信息，并生成与客户端匹配的目标Web页面，将目标Web页面中的数据作为响应数据返回给客户端，使得服务端可以根据硬件设备信息生成适用于客户端的Web页面，实现了一种基于混合模式的适配方式，从而让UI界面能在不同屏幕分辨率的智能终端设备上进行准确适配，并降低了研发成本。
进一步地，在一实施例中，如图3所示，在步骤S10之后，并且在步骤S15之前，即在客户端通过客户端的本地软件开发套件获取客户端的硬件设备信息之后，并且在服务端将目标Web页面中的数据作为Web页面请求的响应数据，并返回给客户端之前，基于混合模式的屏幕适配方法的具体实现流程还包括如下步骤：
S21：客户端在预设的时间，将硬件设备信息发送到服务端。
预设的时间可以是客户端在安装了服务端提供的APP之后，并且在初始化本地Web界面之前的任何时间。
客户端可以通过套接字(socket)通讯的方式，将硬件设备信息发送到服务端。
具体地，客户端可以在预设的时间点，建立发送套接字，并将硬件设备信息以字符的形式添加到发送套接字中，发送套接字用于与服务端进行套接字通讯。其中，发送套接字中包括的信息除了有硬件设备信息之外，还包括要发送的硬件设备信息的字节数，服务端的IP地址或其他URL(Uniform Resource Location，统一资源定位符)地址等；与发送套接字相对应的，服务端有接收套接字，用于接收硬件设备信息。
S22：服务端接收客户端发送的硬件设备信息。
与步骤S21中的发送套接字相对应的，服务端有用于接收硬件设备信息的接收套接字。
具体地，服务端的接收套接字以监听模式，随时接收来自客户端发送的硬件信息。
S23：服务端根据硬件设备信息，生成与客户端相匹配的目标Web页面。
具体地，服务端在接收到客户端通过套接字发送的硬件设备信息后，根据硬件设备信息，生成与客户端相匹配的目标Web页面。其中，根据硬件设备信息，生成与客户端相匹配的目标Web页面的具体实现过程与步骤S14相同，此处不再赘述。
S24：服务端将硬件设备信息与目标Web页面对应保存在预设的数据库中。
预设的数据库用于存储硬件设备信息与目标Web页面之间的映射关系，即将不同分辨率、不同屏幕尺寸、不同设备型号等设备和与设备像匹配的目标Web页面进行对应保存。数据库可以部署在服务端本地，也可以通过网络与服务端相连，具体地，数据库包括但不限于各种关系型或非关系型数据库，如MS-SQL、Oracle、MySQL、Sybase、DB2、Redis、MongodDB、Hbase等。
例如，可以根据分辨率将目标Web页面分类，如分辨率为375*812的设备，对应的目标Web页面为服务端中路径A下面的HTML文件；分辨率为375*667的设备，对应的目标Web页面为服务端中路径B下面的HTML文件；其中，路径A下面的HTML文件和路径B下面的HTML文件分别是与分辨率375*812和分辨率375*667的设备相匹配的目标Web页面。进一步地，针对375*812的设备，还可以分为iPhone X设备和非iPhone X设备，则服务端中路径A也可以分为路径A1和路径A2，路径A1下面的HTML文件和路径A2下面的HTML文件分别是与iPhone X设备和非iPhone X设备相匹配的目标Web页面。
具体地，服务端可以使用预设的设备id(identification，身份标识)号来区分不同的设备，从而使得不同的硬件设备信息对应不同的设备id号，相同的硬件设备信息对应同一个设备id号；服务端将设备id号与目标Web页面的存储路径关联存储到数据库中。例如，iPhone X设备的设备id号可以表示为字符串“iPhone X”，其他和iPhone X分辨率相同的非iPhone X设备的设备id号可以表示为字符串“unknown_375x812”。
S25：客户端若检测到用户对Web页面的访问操作，则将包含硬件设备信息的Web页面请求发送到服务端。
用户对Web页面的访问操作是用户在客户端中触发的，访问服务端的操作事件，包括但不限于点击APP中的图标、滑动界面、输入数据等等。Web页面的访问操作被触发后，客户端将向服务端发送Web页面请求。客户端可以在Web页面的访问操作被触发之后，并且在发送Web页面请求之前，将硬件设备信息添加到Web页面请求上，从而实现随Web页面请求一同发送到服务端。
具体地，客户端可以建立自定义的发送套接字，将硬件设备信息作为发送套接字的内容，此外，发送套接字还包括服务端的IP地址或URL地址等。或者，客户端可以将硬件设备信息添加到浏览器对象中，随浏览器发起的Web页面请求一同发送到服务端。
S26：服务端从Web页面请求中获取硬件设备信息。
具体地，服务端可以根据客户端发送硬件设备信息的方式，采用不同的接收方式获取硬件设备信息。例如，针对套接字发送方式，服务端和客户端事先约定好套接字的收发格式，如套接字的字节流中，每个字节代表的意义需事先约定好；针对浏览器发送方式，服务端通过获取浏览器对象中自定义字段的内容，可以直接获取硬件设备信息的字符信息。
S27：服务端从预设的数据库中获取与硬件设备信息对应的目标Web页面。
在步骤S24中，已将硬件设备信息和与之对应的目标Web页面关联存储到预设的数据库中。因此，可以根据设备id号找到对应的目标Web页面的存储路径，从而得到与设备相匹配的目标Web页面。
具体地，服务端先以步骤S26获取到的硬件设备信息为查询条件，从预设的数据库中找到与之硬件设备信息相同的设备id号；然后以设备id号为查询条件，找到与之相对应的目标Web页面的存储路径，从而实现了从预设的数据库中获取与硬件设备信息对应的目标Web页面。其中，若服务端的运行环境为Java，则服务端具体可以通过JDBC对预设的数据库进行查询匹配操作。JDBC(Java DataBase Connectivity，Java数据库连接)是一种用于执行SQL语句的Java API，可以为多种关系数据库提供统一访问，它由一组用Java语言编写的类和接口组成。JDBC提供了一种基准，据此可以构建更高级的工具和接口，使数据库开发人员能够编写数据库应用程序。数据库开发人员通过JDBC编写的接口程序能适用于不同的数据库，而不再需要为不同的数据库分别编写接口程序，极大提高了开发效率。
在本实施例中，客户端可以在预设的时间内收集硬件设备信息，并发送到服务端进行目标Web页面的匹配；服务端将匹配结果保存到数据库中，即提前收集设备类型信息，并保存与之匹配的目标Web页面之间的映射关系；待有客户端发起Web页面请求时，服务端可以从数据库中查询，获取与客户端的设备类型相匹配的目标Web页面。本实施例采用了提前匹配的方式，使得在接收到客户端的Web页面请求后，可以更快的进行屏幕适配，减少适配时间，提高用户体验。
进一步地，在一实施例中，如图4所示，步骤S14和步骤S23，即服务端根据硬件设备信息，生成与客户端相匹配的目标Web页面，具体可以包括如下步骤：
S41：服务端从预设页面模板中选取与硬件设备信息相对应的Web页面。
预设页面模板是由HTML文件、CSS文件、JS(JavaScript)文件或XML文件组成的Web页面。预设页面模板与硬件设备信息相对应，即特定的分辨率或特定的设备型号与特定的预设页面模板对应。例如，分辨率为375*667的设备对应预设页面模板A；iPhone X设备对应预设页面模板B，等等。预设页面模板具体可以为部署在服务端上的一个文件目录路径，该目录下包括HTML文件、CSS文件、JS(JavaScript)文件或XML文件，这些文件即构成与硬件设备信息相对应的Web页面。
具体地，预设页面模板与硬件设备信息的对应关系可以表现为一个保存有设备id号和预设页面模板的文件目录名对应关系的文本配置文件。服务端可以根据设备id号找到与之相对应的预设页面模板的文件目录路径。例如，设备id号为“iPhone X”的设备，其对应的预设页面模板文件目录路径可以为“/host/template/iphoneX”，设备id号为“unknown_375x812”的设备，其对应的预设页面模板文件目录路径可以为“/host/template/unknown_375x812”。服务端提取预设页面模板的文件目录路径下包括的所有文件即可得到与硬件设备信息相对应的Web页面。
S42：服务端将Web页面中的预设标签的值更新为与客户端的屏幕分辨率匹配的值，得到目标Web页面。
Web页面中的预设标签是构成Web页面内容的组成部分，预设标签是在UI布局中受到客户端屏幕分辨率影响的标签，即预设标签的取值将影响Web页面的显示效果。例如，HTML文件中的title标签用于显示Web页面中标题部分，title标签中对字体大小的设置需要根据客户端的屏幕分辨率灵活设置，若在HTML文件中将title标签的值设置为固定值，则不同屏幕分辨率的客户端看到的显示效果不同，影响用户体验。
预设标签包括HTML文件、CSS文件或XML文件中的标签，例如，HTML文件中的title标题标签，table表格标签；CSS文件中的font-size字体大小标签，等。
预设标签的值需要与客户端的屏幕分辨率相匹配，以保证客户端能完整正确的显示Web页面。例如，显示同一Web页面，在iPhone X设备上，HTML文件中的head标签下的字体大小需要设置为12号；在iPhone8设备是，HTML文件中的head标签下的字体大小需要设置为10号。因此，服务端对HTML文件、CSS文件或XML文件中的预设标签的值进行重新赋值，即可得到与客户端的屏幕分辨率相匹配的目标Web页面。
在本实施例中，服务端利用了预设页面模板，对与硬件设备信息匹配的Web页面进行分类，然后只需要更新Web页面中的预设标签的值，即可得到目标Web页面，进一步节省了服务端进行屏幕适配的时间，提高了处理效率。
应理解，上述实施例中各步骤的序号的大小并不意味着执行顺序的先后，各过程的执行顺序应以其功能和内在逻辑确定，而不应对本发明实施例的实施过程构成任何限定。
在一实施例中，提供一种基于混合模式的屏幕适配装置，如图5所示，该基于混合模式的屏幕适配装置包括信息获取模块51，第一封装发送模块52和显示模块53。各功能模块详细说明如下：
信息获取模块51，用于通过客户端的本地软件开发套件获取客户端的硬件设备信息；
第一封装发送模块52，用于在初始化本地Web界面时，将硬件设备信息封装到浏览器对象中，并将包含浏览器对象的Web页面请求发送到服务端；
显示模块53，用于接收服务端发送的根据硬件设备信息适配的响应数据，并根据响应数据更新本地Web界面。
进一步地，基于混合模式的屏幕适配装置，还包括：
定期采集模块54，用于在预设的时间，将硬件设备信息发送到服务端；
第二封装发送模块55，用于若检测到用户对Web页面的访问操作，则将包含硬件设备信息的Web页面请求发送到服务端。
在一实施例中，提供一种基于混合模式的屏幕适配装置，如图6所示，该基于混合模式的屏幕适配装置包括第一接收模块61、第一解析模块62、页面生成模块63和响应模块64。各功能模块详细说明如下：
第一接收模块61，用于接收客户端发送的Web页面请求；
第一解析模块62，用于从Web页面请求中获取浏览器对象，对浏览器对象进行解析，得到客户端的硬件设备信息；
页面生成模块63，用于根据硬件设备信息，生成与客户端相匹配的目标Web页面；
响应模块64，用于将目标Web页面中的数据作为Web页面请求的响应数据，并返回给客户端。
进一步地，基于混合模式的屏幕适配装置，还包括：
第二接收模块65，用于接收客户端发送的硬件设备信息；
存储模块66，用于将硬件设备信息与目标Web页面对应保存在预设的数据库中；
第二解析模块67，用于从Web页面请求中获取硬件设备信息；
页面获取模块68，用于从预设的数据库中获取与硬件设备信息对应的目标Web页面。
进一步地，页面生成模块63，包括：
模板选取子模块631，用于从预设页面模板中选取与硬件设备信息相对应的Web页面；
屏幕适配子模块632，用于将Web页面中的预设标签的值更新为与客户端的屏幕分辨率匹配的值，得到目标Web页面。
关于基于混合模式的屏幕适配装置的具体限定可以参见上文中对于基于混合模式的屏幕适配方法的限定，在此不再赘述。上述基于混合模式的屏幕适配装置中的各个模块可全部或部分通过软件、硬件及其组合来实现。上述各模块可以硬件形式内嵌于或独立于计算机设备中的处理器中，也可以以软件形式存储于计算机设备中的存储器中，以便于处理器调用执行以上各个模块对应的操作。
在一个实施例中，提供了一种计算机设备，该计算机设备可以是服务器，其内部结构图可以如图7所示。该计算机设备包括通过系统总线连接的处理器、存储器、网络接口和数据库。其中，该计算机设备的处理器用于提供计算和控制能力。该计算机设备的存储器包括非易失性存储介质、内存储器。该非易失性存储介质存储有操作系统、计算机程序和数据库。该内存储器为非易失性存储介质中的操作系统和计算机程序的运行提供环境。该计算机设备的网络接口用于与外部的终端通过网络连接通信。该计算机程序被处理器执行时以实现一种基于混合模式的屏幕适配方法中服务端的步骤。
在一个实施例中，提供了一种计算机设备，该计算机设备可以是终端，其内部结构图可以如图8所示。该计算机设备包括通过系统总线连接的处理器、存储器、网络接口、显示屏和输入装置。其中，该计算机设备的处理器用于提供计算和控制能力。该计算机设备的存储器包括非易失性存储介质、内存储器。该非易失性存储介质存储有操作系统和计算机程序。该内存储器为非易失性存储介质中的操作系统和计算机程序的运行提供环境。该计算机设备的网络接口用于与外部服务器通过网络连接通信。该计算机程序被处理器执行时以实现一种基于混合模式的屏幕适配方法中客户端的步骤。
在一个实施例中，提供了一种计算机设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，处理器执行计算机程序时实现上述实施例中基于混合模式的屏幕适配方法中客户端或者服务端的步骤，例如图2所示的步骤S10至步骤S16中客户端执行的步骤，或者图3所示的步骤S21至步骤S27中服务端执行的步骤。或者，处理器执行计算机程序时实现上述实施例中基于混合模式的屏幕适配装置的各模块/单元的功能，例如图5所示模块51至模块53的功能，以及图6所示模块61至模块64的功能。为避免重复，这里不再赘述。
在一实施例中，提供一计算机可读存储介质，其上存储有计算机程序，计算机程序被处理器执行时实现上述方法实施例中基于混合模式的屏幕适配方法，或者，该计算机程序被处理器执行时实现上述装置实施例中基于混合模式的屏幕适配装置中各模块/单元的功能。为避免重复，这里不再赘述。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的计算机程序可存储于一非易失性计算机可读取存储介质中，该计算机程序在执行时，可包括如上述各方法的实施例的流程。其中，本发明所提供的各实施例中所使用的对存储器、存储、数据库或其它介质的任何引用，均可包括非易失性和/或易失性存储器。非易失性存储器可包括只读存储器(ROM)、可编程ROM(PROM)、电可编程ROM(EPROM)、电可擦除可编程ROM(EEPROM)或闪存。易失性存储器可包括随机存取存储器(RAM)或者外部高速缓冲存储器。作为说明而非局限，RAM以多种形式可得，诸如静态RAM(SRAM)、动态RAM(DRAM)、同步DRAM(SDRAM)、双数据率SDRAM(DDRSDRAM)、增强型SDRAM(ESDRAM)、同步链路(Synchlink)DRAM(SLDRAM)、存储器总线(Rambus)直接RAM(RDRAM)、直接存储器总线动态RAM(DRDRAM)、以及存储器总线动态RAM(RDRAM)等。
所属领域的技术人员可以清楚地了解到，为了描述的方便和简洁，仅以上述各功能单元、模块的划分进行举例说明，实际应用中，可以根据需要而将上述功能分配由不同的功能单元、模块完成，即将所述装置的内部结构划分成不同的功能单元或模块，以完成以上描述的全部或者部分功能。
以上所述实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围，均应包含在本发明的保护范围之内。
Claims (10)
1.一种基于混合模式的屏幕适配方法，应用于客户端，其特征在于，所述基于混合模式的屏幕适配方法包括：
通过所述客户端的本地软件开发套件获取所述客户端的硬件设备信息；
在初始化本地Web界面时，将所述硬件设备信息封装到浏览器对象中，并将包含所述浏览器对象的Web页面请求发送到服务端；
接收所述服务端发送的根据所述硬件设备信息适配的响应数据，并根据所述响应数据更新所述本地Web界面。
2.如权利要求1所述的基于混合模式的屏幕适配方法，其特征在于，所述通过所述客户端的本地软件开发套件获取所述客户端的硬件设备信息之后，所述基于混合模式的屏幕适配方法还包括：
在预设的时间，将所述硬件设备信息发送到所述服务端；
若检测到用户对Web页面的访问操作，则将包含所述硬件设备信息的Web页面请求发送到所述服务端。
3.一种基于混合模式的屏幕适配方法，应用于服务端，其特征在于，所述基于混合模式的屏幕适配方法包括：
接收客户端发送的Web页面请求；
从所述Web页面请求中获取浏览器对象，对所述浏览器对象进行解析，得到所述客户端的硬件设备信息；
根据所述硬件设备信息，生成与所述客户端相匹配的目标Web页面；
将所述目标Web页面中的数据作为所述Web页面请求的响应数据，并返回给所述客户端。
4.如权利要求3所述的基于混合模式的屏幕适配方法，其特征在于，在所述接收客户端发送的Web页面请求之前，所述基于混合模式的屏幕适配方法还包括：
接收所述客户端发送的所述硬件设备信息；
根据所述硬件设备信息，生成与所述客户端相匹配的目标Web页面；
将所述硬件设备信息与所述目标Web页面对应保存在预设的数据库中；
在所述接收客户端发送的Web页面请求之后，并且在所述将所述目标Web页面中的数据作为所述Web页面请求的响应数据，并返回给所述客户端之前，所述基于混合模式的屏幕适配方法还包括：
从所述Web页面请求中获取所述硬件设备信息；
从所述预设的数据库中获取与所述硬件设备信息对应的所述目标Web页面。
5.如权利要求3或4所述的基于混合模式的屏幕适配方法，其特征在于，所述根据所述硬件设备信息，生成与所述客户端相匹配的目标Web页面，包括：
从预设页面模板中选取与所述硬件设备信息相对应的Web页面；
将所述Web页面中的预设标签的值更新为与所述客户端的屏幕分辨率匹配的值，得到所述目标Web页面。
6.一种基于混合模式的屏幕适配装置，应用于客户端，其特征在于，所述基于混合模式的屏幕适配装置，包括：
信息获取模块，用于通过所述客户端的本地软件开发套件获取所述客户端的硬件设备信息；
第一封装发送模块，用于在初始化本地Web界面时，将所述硬件设备信息封装到浏览器对象中，并将包含所述浏览器对象的Web页面请求发送到服务端；
显示模块，用于接收所述服务端发送的根据所述硬件设备信息适配的响应数据，并根据所述响应数据更新所述本地Web界面。
7.一种基于混合模式的屏幕适配装置，应用于服务端，其特征在于，所述基于混合模式的屏幕适配装置，包括：
第一接收模块，用于接收客户端发送的Web页面请求；
第一解析模块，用于从所述Web页面请求中获取浏览器对象，对所述浏览器对象进行解析，得到所述客户端的硬件设备信息；
页面生成模块，用于根据所述硬件设备信息，生成与所述客户端相匹配的目标Web页面；
响应模块，用于将所述目标Web页面中的数据作为所述Web页面请求的响应数据，并返回给所述客户端。
8.如权利要求7所述的基于混合模式的屏幕适配装置，其特征在于，所述基于混合模式的屏幕适配装置，还包括：
第二接收模块，用于接收所述客户端发送的所述硬件设备信息；
存储模块，用于将所述硬件设备信息与所述目标Web页面对应保存在预设的数据库中；
第二解析模块，用于从所述Web页面请求中获取所述硬件设备信息；
页面获取模块，用于从所述预设的数据库中获取与所述硬件设备信息对应的所述目标Web页面。
9.一种计算机设备，包括存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时实现如权利要求1或2所述基于混合模式的屏幕适配方法，或者实现如权利要求3至5任一项所述基于混合模式的屏幕适配方法。
10.一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现如权利要求1或2所述基于混合模式的屏幕适配方法，或者实现如权利要求3至5任一项所述基于混合模式的屏幕适配方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910048325.XA CN109828815A (zh) | 2019-01-18 | 2019-01-18 | 基于混合模式的屏幕适配方法、装置、设备及存储介质 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910048325.XA CN109828815A (zh) | 2019-01-18 | 2019-01-18 | 基于混合模式的屏幕适配方法、装置、设备及存储介质 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN109828815A true CN109828815A (zh) | 2019-05-31 |
Family
ID=66861670
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201910048325.XA Pending CN109828815A (zh) | 2019-01-18 | 2019-01-18 | 基于混合模式的屏幕适配方法、装置、设备及存储介质 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN109828815A (zh) |
Cited By (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110456999A (zh) * | 2019-08-05 | 2019-11-15 | 深圳怡化电脑股份有限公司 | 节目创建方法、装置、电子设备及计算机可读存储介质 |
| CN110543265A (zh) * | 2019-07-22 | 2019-12-06 | 北京达佳互联信息技术有限公司 | 页面标题栏的生成方法、装置、电子设备及存储介质 |
| CN112905944A (zh) * | 2021-04-06 | 2021-06-04 | 成都新希望金融信息有限公司 | 页面在线动态生成方法、装置、电子设备和可读存储介质 |
| CN113377481A (zh) * | 2021-06-30 | 2021-09-10 | 深圳市华曦达科技股份有限公司 | 页面管理方法、系统及计算机可读存储介质 |
| CN113467776A (zh) * | 2021-06-28 | 2021-10-01 | 青岛海尔科技有限公司 | 设备的接入方法、装置、存储介质和电子装置 |
| CN113590101A (zh) * | 2021-08-20 | 2021-11-02 | 深圳市欧瑞博科技股份有限公司 | 智能设备功能页面配置方法、服务器及客户端 |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US6578068B1 (en) * | 1999-08-31 | 2003-06-10 | Accenture Llp | Load balancer in environment services patterns |
| CN102497420A (zh) * | 2011-12-12 | 2012-06-13 | 中国电信股份有限公司 | 内容适配方法与服务器 |
| CN102955694A (zh) * | 2011-08-31 | 2013-03-06 | 中国电信股份有限公司 | 基于WebKit 浏览器的客户端实现方法以及客户端 |
| CN103095839A (zh) * | 2013-01-21 | 2013-05-08 | 中国工商银行股份有限公司 | 一种客户端数据展现系统及方法 |
| CN203151553U (zh) * | 2013-01-21 | 2013-08-21 | 中国工商银行股份有限公司 | 一种客户端数据展现系统 |
| CN106331149A (zh) * | 2016-09-14 | 2017-01-11 | 北京知道未来信息技术有限公司 | 一种针对客户端环境的网页代码自适应方法 |
| CN108023918A (zh) * | 2016-11-02 | 2018-05-11 | 阿里巴巴集团控股有限公司 | 一种服务信息获取方法、装置及系统 |
| CN108628656A (zh) * | 2018-05-09 | 2018-10-09 | 平安普惠企业管理有限公司 | Ios设备上界面适配方法、装置、计算机设备及存储介质 |
-
2019
- 2019-01-18 CN CN201910048325.XA patent/CN109828815A/zh active Pending
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US6578068B1 (en) * | 1999-08-31 | 2003-06-10 | Accenture Llp | Load balancer in environment services patterns |
| CN102955694A (zh) * | 2011-08-31 | 2013-03-06 | 中国电信股份有限公司 | 基于WebKit 浏览器的客户端实现方法以及客户端 |
| CN102497420A (zh) * | 2011-12-12 | 2012-06-13 | 中国电信股份有限公司 | 内容适配方法与服务器 |
| CN103095839A (zh) * | 2013-01-21 | 2013-05-08 | 中国工商银行股份有限公司 | 一种客户端数据展现系统及方法 |
| CN203151553U (zh) * | 2013-01-21 | 2013-08-21 | 中国工商银行股份有限公司 | 一种客户端数据展现系统 |
| CN106331149A (zh) * | 2016-09-14 | 2017-01-11 | 北京知道未来信息技术有限公司 | 一种针对客户端环境的网页代码自适应方法 |
| CN108023918A (zh) * | 2016-11-02 | 2018-05-11 | 阿里巴巴集团控股有限公司 | 一种服务信息获取方法、装置及系统 |
| CN108628656A (zh) * | 2018-05-09 | 2018-10-09 | 平安普惠企业管理有限公司 | Ios设备上界面适配方法、装置、计算机设备及存储介质 |
Cited By (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110543265A (zh) * | 2019-07-22 | 2019-12-06 | 北京达佳互联信息技术有限公司 | 页面标题栏的生成方法、装置、电子设备及存储介质 |
| CN110456999A (zh) * | 2019-08-05 | 2019-11-15 | 深圳怡化电脑股份有限公司 | 节目创建方法、装置、电子设备及计算机可读存储介质 |
| CN112905944A (zh) * | 2021-04-06 | 2021-06-04 | 成都新希望金融信息有限公司 | 页面在线动态生成方法、装置、电子设备和可读存储介质 |
| CN113467776A (zh) * | 2021-06-28 | 2021-10-01 | 青岛海尔科技有限公司 | 设备的接入方法、装置、存储介质和电子装置 |
| CN113467776B (zh) * | 2021-06-28 | 2023-06-13 | 青岛海尔科技有限公司 | 设备的接入方法、装置、存储介质和电子装置 |
| CN113377481A (zh) * | 2021-06-30 | 2021-09-10 | 深圳市华曦达科技股份有限公司 | 页面管理方法、系统及计算机可读存储介质 |
| CN113590101A (zh) * | 2021-08-20 | 2021-11-02 | 深圳市欧瑞博科技股份有限公司 | 智能设备功能页面配置方法、服务器及客户端 |
| CN113590101B (zh) * | 2021-08-20 | 2024-04-09 | 深圳市欧瑞博科技股份有限公司 | 智能设备功能页面配置方法、服务器及客户端 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN109828815A (zh) | 基于混合模式的屏幕适配方法、装置、设备及存储介质 | |
| CN109582303B (zh) | 通用组件调用方法、装置、计算机设备及存储介质 | |
| JP6755954B2 (ja) | インターフェースデータの提示方法及び装置 | |
| CN106874174B (zh) | 接口测试及功能测试的实现方法和装置 | |
| CN107977351A (zh) | 电子报表生成方法、装置、计算机设备及存储介质 | |
| CN103645951A (zh) | 一种跨平台的移动数据管理系统及其方法 | |
| CN104731589A (zh) | 用户界面的自动生成方法及自动生成装置 | |
| CN110688598A (zh) | 业务参数采集方法、装置、计算机设备和存储介质 | |
| US9967370B2 (en) | OData enabled mobile software applications | |
| CN104821954A (zh) | 一种跨平台远程过程调用方法 | |
| CN109145235B (zh) | 用于解析网页的方法、装置及电子设备 | |
| CN103577568A (zh) | 一种跨平台的移动安全综合信息聚合系统及其方法 | |
| WO2017124692A1 (zh) | 查找表单页面和目标页面转化关系的方法和装置 | |
| CN103873918A (zh) | 图片处理方法、装置及终端 | |
| CN105630684A (zh) | 软件开发工具包识别方法和装置 | |
| CN110808868B (zh) | 测试数据获取方法、装置、计算机设备及存储介质 | |
| CN110597896A (zh) | 一种数据展示方法、数据展示装置及终端设备 | |
| CN113726770A (zh) | 数据拦截方法、装置、计算机设备及存储介质 | |
| CN109086147A (zh) | 应用程序的服务接口调用方法、装置及存储介质 | |
| CN103634396A (zh) | 一种访问内网Web页面服务数据的方法、网关设备及系统 | |
| CN108809896A (zh) | 一种信息校验方法、装置和电子设备 | |
| CN105094787B (zh) | 企业互联网应用的处理方法及装置 | |
| CN112491943B (zh) | 数据请求方法、装置、存储介质和电子设备 | |
| CN103365764B (zh) | 一种无线页面测试方法与设备 | |
| CN116738954A (zh) | 报表导出方法、报表模板的配置方法、装置、计算机设备 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| WD01 | Invention patent application deemed withdrawn after publication | ||
| WD01 | Invention patent application deemed withdrawn after publication |
Application publication date: 20190531 |