CN105045887B - The system and method for mixed mode cross-domain data interaction - Google Patents

Abstract

The present invention relates to a system and method for cross-domain data interaction in a mixed mode, including a Web server, a web page automatic adaptation module, a local cache manager, a browser container, and a cross-domain data interaction proxy module; the Web server organizes web page resources, compresses and packages them , the local cache manager downloads and decompresses the packaged files to form a local resource structure; the webpage automatic adaptation module judges the current working status, if it is an online working status, it uses Ajax to interact with the Web server, if it is a local cache working status, it uses The cross-domain data interaction agent module performs data communication; the browser container interface obtains the data submitted by the webpage automatic adaptation module, and according to the data interaction type, simulates the browser to initiate a data read and write request to the web server, and returns the data returned by the web server through a callback to call the web page. It solves the limitation of the same-origin policy, and realizes the data interaction between the client's local webpage resources and the server's data across domains.

Description

System and method for mixed-mode cross-domain data interaction

technical field

The invention relates to a mixed-mode cross-domain data interaction system and method thereof.

Background technique

With the rapid development of the mobile Internet, the iOS system developed by Apple and the Android system developed by Google occupy most of the operating systems of mobile terminals. Both mobile operating systems provide an SDK (Software Development Kit, Software Development Kit), and software companies can develop applications based on the system's SDK.

There are three modes of application development: the first, all SDK-based localization (Native) development; the second, mobile web pages developed based on HTML technology; the third, a combination of localization development and HTML Web development (Hybrid) mode, the hybrid mode can improve the efficiency of application development by using mature HTML Web development technology, and use the browser container to display and interact with the interface.

The implementation process of mobile application hybrid mode is: package and download webpage content to mobile devices (including mobile phones, tablet computers, handheld devices, etc.), run and render webpage content on mobile devices through mobile browser containers, and perform human-computer interaction. The problem caused by this general implementation method is that due to the restriction of the same-origin policy of the browser, the data cannot be directly submitted to the server. The so-called same-origin policy is a well-known security policy proposed by Netscape, and the same-origin policy is an important security metric for client-side scripts (referring to JavaScript). Originally from Netscape Navigator2.0, its purpose is to prevent a document or script from being loaded from multiple different sources. All browsers that support JavaScript now use this strategy. The so-called same origin refers to the same domain name, protocol, and port.

Contents of the invention

The purpose of the present invention is to overcome the deficiencies in the prior art, and provide a mixed-mode cross-domain data interaction system and method thereof, aiming to solve the limitation of "same origin policy" and realize cross-domain client and server data interaction.

The purpose of the present invention is achieved through the following technical solutions:

The mixed-mode cross-domain data interaction system is characterized by: including a Web server, a web page automatic adaptation module, a local cache manager, a browser container, and a cross-domain data interaction proxy module. The Web server provides browsers or clients with Web service, using HTTP to provide HTML web page output and respond to web page interaction requests;

The webpage automatic adaptation module includes a code module for automatically judging the running state of the webpage, and runs in the HTML webpage in the form of a JavaScript program, and the HTML webpage file containing the JavaScript program is transmitted from the Web server to the client through the network;

The local cache manager creates and manages the local cache, manages the cache content of the application program, downloads the web page resource file compression package on the Web server, decompresses it, establishes the local resource structure, forms a local cache environment, and regularly updates the local cache content ;

The browser container is embedded in the browser of the application program as a container running on the webpage; the browser container intercepts the specified interactive action in the browser, and makes an operation response in the local code;

The cross-domain data interaction proxy module runs on the application program code at the bottom of the browser container, interacts the data of the HTML webpage running in the browser container that is intercepted, submits it to the Web server through the cross-domain data interaction proxy module, and then obtains the Web The server's data response, through the cross-domain data interaction proxy module, avoids the restrictions of the browser's same-origin policy, so that the downloaded webpage code can perform data interaction.

Further, in the above mixed-mode cross-domain data interaction system, wherein the web server is a Microsoft IIS server or an Apache HTTP Server web server.

Furthermore, in the above mixed-mode cross-domain data interaction system, the web page automatic adaptation module is a code module that automatically determines the running state of the web page.

Furthermore, in the above mixed-mode cross-domain data interaction system, wherein, the browser container is a browser control built into the application program; the browser control is a functional component of the operating system, and the functional component has the function of browsing HTML web pages .

Furthermore, in the above mixed-mode cross-domain data interaction system, the browser is software that displays HTML files of the web server or file system on the mobile device or computer and provides users with interaction with the files.

Furthermore, in the above mixed-mode cross-domain data interaction system, wherein the automatic web page adaptation module detects the running state of the web page, and determines whether it is an online working state or a local cache working state.

The mixed-mode cross-domain data interaction method of the present invention includes the following steps:

First, the web server organizes, compresses and packages the web page resources, and the local cache manager downloads and decompresses the packaged files to form a local resource structure;

Then, the code in the webpage uses the document.url parameter, and the webpage automatic adaptation module judges the current working status. There are two current working statuses, one is the online working status with the protocol http://, and the other is the file:// The local cache working status, if it is online working status, use Ajax method to interact with the web server, if it is local cache working status, use cross-domain data interaction proxy module for data communication;

Then, use the browser container interface of the mobile operating system to obtain the data submitted by the webpage automatic adaptation module, and according to the interaction type of the data, that is, the Get class or the Post class, the cross-domain data interaction proxy module simulates the browser to initiate data reading and writing to the Web server Request, and return the data returned by the web server to the calling web page through the callback.

Still further, in the above mixed-mode cross-domain data interaction method, the local cache manager cleans up the directory, clears the local resources according to the instructions of the web server, and re-downloads and updates. The cross-domain data interaction proxy module realizes cross-domain data interaction, eliminating the restriction of the same-origin policy.

The outstanding substantive features and remarkable progress of the technical solution of the present invention are mainly reflected in:

①The present invention solves the limitation of same-origin policy and realizes cross-domain client and server data interaction; the webpage automatic adaptation module automatically judges whether the webpage is in the online working state or the local cache working state, which is different from the judgment method of general browsers in that , the local cache is controlled independently, not the default control of the system browser;

②The cross-domain data interaction agent module solves the "same-origin policy restriction" of the data interaction between the webpage downloaded by the mobile application hybrid development and the server, and combines with the webpage automatic adaptation module to automatically judge the operating environment and automatically select the data interaction mode;

③The local cache manager builds a webpage operating environment on the mobile device side by packaging and downloading the webpages of the website, and realizes interface display and interaction in the browser container provided by the operating system;

④Solve the cross-domain problem of mobile app development and the interaction between the mobile app and the server in the mixed mode state; the addition of ordinary web pages adopts the "adaptive web page structure", which can realize the connection between the browser container and the server data after the web page is downloaded interact.

Description of drawings

Below in conjunction with accompanying drawing, technical solution of the present invention will be further described:

Figure 1: a schematic diagram of the system architecture of the present invention;

Figure 2: Schematic flow chart of the present invention.

Detailed ways

As shown in Figure 1, the mixed-mode cross-domain data interaction system includes a Web server 1, a webpage automatic adaptation module 2, a local cache manager 3, a browser container 4 and a cross-domain data interaction proxy module 5;

Web server 1 provides web services for browsers or clients, uses HTTP to provide HTML web page output, and responds to web page interaction requests; wherein, Web server 1 is a Microsoft IIS server or Apache HTTP Server web server; the browser is on a mobile phone or The computer displays the HTML files of the web server or the file system and provides software for users to interact with the files, such as: IE, Safari, Chrome, etc.; the client is the application software that runs on the mobile phone or computer and completes one or a group of functions.

The web page automatic adaptation module 2 includes a code module for automatically judging the running state of the web page, and runs in the HTML web page in the form of a JavaScript program, and the HTML web page file containing the JavaScript program is transmitted from the Web server 1 to the client through the network; wherein, the web page The automatic adaptation module 2 is a code module for the webpage to automatically determine the running state of the webpage; the automatic webpage adaptation module 2 detects the running state of the webpage, and judges whether it is an online working state or a local cache working state.

The local cache manager 3, creates and manages the local cache, manages the cache content of the application program, downloads the web page resource file compression package on the Web server 1, decompresses it, establishes a directory structure, forms a local cache environment, and regularly updates the local cache content; The local cache manager 3 cleans up the directory, clears the local resources according to the instructions of the web server 1, and re-downloads the update

Browser container 4, a browser embedded in an application program, is a container running as a web page; browser container 4 intercepts specified interactive actions in the browser, and makes an operation response in the local code; wherein, browser container 4 is in The built-in browser control of the application program is a functional component of the operating system, and the functional component has a function of browsing HTML webpages.

The cross-domain data interaction proxy module 5, running on the application program code at the bottom of the browser container, interacts the data of the HTML webpage running in the browser container 4 that is intercepted, and submits it to the Web server 1 through the cross-domain data interaction proxy module 5, and then Obtain the data response from the Web server 1, and avoid the restriction of the same-origin policy of the browser through the cross-domain data interaction proxy module 5, so that the code downloaded to the local webpage can perform data interaction. The cross-domain data interaction proxy module 5 realizes cross-domain data interaction and eliminates the restriction of the same-origin policy.

A browser can display the content of HTML documents (an application of the standard Universal Markup Language) on a web server or file system and allow users to interact with these documents. A browser is used to display text, images, and other information on the World Wide Web or a local area network, etc. These text or image information can be hyperlinks to other websites, and users can quickly and easily browse various information. Most web pages are in HTML format. Common web browsers on mobile devices and computers include: QQ browser, Internet Explorer, Safari, Opera, Google Chrome, 360 browser, UC browser, etc. The browser is the most frequently used client program.

Client (Client), or called client, corresponds to the server and is a program that provides local services for clients. Except for some applications that only run locally, they are generally installed on ordinary client computers and need to cooperate with the server to run. After the development of the Internet, more commonly used client terminals include web browsers used on the World Wide Web, e-mail clients when receiving and sending e-mails, and client software for instant messaging. For this type of application, it is necessary to have corresponding servers and service programs in the network to provide corresponding services, such as database services, e-mail services, etc., so that a specific communication connection needs to be established between the client and server to ensure normal operation of the application.

The present invention encapsulates the local browser container in the mobile device software, realizes the cross-domain data interaction agent at the bottom layer of the browser container, and performs data interaction through the cross-domain data interaction agent and the server for webpage data interaction, and the webpage realizes automatic judgment that the webpage is "online" Running" or "running in local cache", if it is "running online", use the ordinary web page interaction method, if it is "running in local cache", use "data interaction agent" to interact with the server, and return the server through the callback The results are returned to the web page. As shown in Figure 2, the specific steps are:

First, the web server 1 arranges the web page resources, compresses and packages them, and the local cache manager 3 downloads and decompresses the packaged files to form a local resource structure;

Then, the code in the webpage uses the document.url parameter, and the webpage automatic adaptation module 2 judges the current working status. There are two current working statuses, one is the online working status with the protocol http://, and the other is the file:/ /'s local cache working status, if it is an online working status, then use the Ajax method to interact with the Web server 1, if it is a local cache working status, then use the cross-domain data interaction proxy module 5 for data communication; the so-called AJAX refers to "Asynchronous JavaScript And XML" (asynchronous JavaScript and XML) is a web development technology for creating interactive web applications. By exchanging a small amount of data with the server in the background, AJAX can make web pages update asynchronously. Parts of a web page can be updated without reloading the entire web page.

Then, use the browser container 4 interface of the mobile operating system to obtain the data submitted by the webpage automatic adaptation module 2, and according to the interaction type of the data, that is, the Get class or the Post class, the cross-domain data interaction proxy module 5 simulates the browser to send data to the Web server 1. Initiate a data read and write request, and return the data returned by Web server 1 to the calling web page through a callback.

To sum up, the web page automatic adaptation module (adaptive web page structure) automatically judges whether the web page is "online working status" or "local cache working status". , not the system browser default control.

The cross-domain data interaction proxy module solves the "same-origin policy restriction" of the data interaction between the webpage downloaded by the mobile application hybrid development and the server. Combined with the webpage automatic adaptation module, it realizes automatic judgment of the operating environment and automatic selection of the data interaction method.

The local cache manager establishes a webpage operating environment on the mobile device side by packaging and downloading website webpages, and realizes interface display and interaction in the browser container provided by the operating system.

The invention solves the cross-domain problem of mobile application development and interaction between mobile terminal App and server terminal under mixed mode state. The addition of ordinary web pages adopts the "adaptive web page structure", which can realize the data interaction with the server in the browser container after the web page is downloaded.

It should be understood that: the above is only a preferred embodiment of the present invention, for those of ordinary skill in the art, without departing from the principle of the present invention, some improvements and modifications can also be made, these improvements and Retouching should also be regarded as the protection scope of the present invention.

Claims (10)

1. the system of mixed mode cross-domain data interaction, it is characterised in that：Include Web server (1), webpage automatic adaptation module (2), local cache manager (3), browser container (4) and cross-domain data interactive agent module (5), the Web server (1), network service is provided for browser or client, provides html web page output using HTTP modes, and respond webpage interaction Request；

The webpage automatic adaptation module (2) includes the program module of automatic decision webpage operating status, with JavaScript The mode of program is run in html web page, and the html web page file containing JavaScript program passes through from Web server (1) Transmission of network is to client；

The local cache manager (3), creates and Web is downloaded in management local cache, the cache contents management to application program Local resource structure is established in web page resources compressing file packet on server (1), decompression, forms local cache environment, periodically Update local cache content；

The browser container (4) is embedded in the browser of application program, the container as webpage operation；Browser container (4) The specified interactive action in browser is intercepted and captured, and operation response is made in local code；

The cross-domain data interactive agent module (5) runs on the application program module of browser container bottom, by the clear of intercepting and capturing The data interaction of the html web page run in device container (4) is look at, by cross-domain data interactive agent module (5) to Web server (1) it submits, then obtains the data response of Web server (1), browser is avoided by cross-domain data interactive agent module (5) The limitation of origin policy makes locally downloading web page code that can carry out data interaction.

2. the system of mixed mode cross-domain data interaction according to claim 1, it is characterised in that：The Web server (1) it is Microsoft IIS server or Apache HTTP Server web page servers.

3. the system of mixed mode cross-domain data interaction according to claim 1, it is characterised in that：The webpage is fitted automatically Contain the program module of automatic decision webpage operating status for webpage with module (2).

4. the system of mixed mode cross-domain data interaction according to claim 1, it is characterised in that：The browser container (4) it is in the browser control part built in application program.

5. the system of mixed mode cross-domain data interaction according to claim 4, it is characterised in that：The browser control part It is the functional unit of operating system, functional unit has the function of html web page browsing.

6. the system of mixed mode cross-domain data interaction according to claim 1, it is characterised in that：The browser be Web page server or file system html file and the software that user and file interaction are provided are shown on mobile equipment or computer.

7. the system of mixed mode cross-domain data interaction according to claim 1, it is characterised in that：The webpage is fitted automatically Webpage operating status is detected with module (2), determines whether the state of working online or local cache working condition.

8. a kind of method that system according to claim 1 realizes the interaction of mixed mode cross-domain data, it is characterised in that including Following steps：

First, Web server (1) arranges web page resources, and compression is packaged, and local cache manager (3) is by packaging file It downloads, decompression forms local resource structure；

Then, code uses document.url parameters in webpage, and webpage automatic adaptation module (2) judges current working status, There are two types of current working statuses, and one kind is that agreement is http:// the state that works online, another kind be file:// local delay Working condition is deposited, if it is the state of working online, is interacted using Ajax modes and Web server (1), if it is local Working condition is cached, then data communication is carried out using cross-domain data interactive agent module (5)；

Then, using the browser container of Mobile operating system (4) interface, the number that webpage automatic adaptation module (2) is submitted is obtained According to according to the type of interaction of data, that is, Get classes or Post classes, cross-domain data interactive agent module (5) simulation browser takes to Web Business device (1) initiates reading and writing data request, and the data that Web server (1) returns are returned to invoking web page by readjustment.

9. the method for mixed mode cross-domain data interaction according to claim 8, it is characterised in that：The local cache pipe It manages device (3) to clear up into column catalogue, local resource is emptied according to the instruction of Web server (1), re-downloads update.

10. the method for mixed mode cross-domain data interaction according to claim 8, it is characterised in that：The cross-domain data Interactive agent module (5) realizes cross-domain data interaction, excludes the limitation of origin policy.