CN103268319A - A web-based cloud browser - Google Patents

Abstract

The invention relates to a webpage-based cloud browser, which belongs to the field of computer and Internet informatization. It includes a server and a client. The server includes a database, a plug-in manager, various plug-ins, a user verification module, a web page proxy module and a user configuration module. ; The present invention presents the functions and styles of the browser in the form of web pages on ordinary browsers, making the browser web pages, and making it have the characteristics of cross-platform, data synchronization, and convenience.

Description

A web-based cloud browser

technical field

The invention relates to a webpage-based browser, called a cloud browser, and belongs to the field of computer and Internet informatization. the

Background technique

A web browser (Browser) is an application software that displays files in a web server or file system and allows users to interact with these files. It is used to display text, images, and other information on the World Wide Web or a local area network, etc. These texts or images can be hyperlinks to other websites, and users can quickly and easily browse various information. Most web pages are in HTML format, and some web pages require specific browsers to display correctly. the

The common web browsers on personal computers are Internet Explorer of Microsoft, Firefox of Mozilla, Chrome of Google, Safari of Apple and Opera of Opera Software according to their market share in January 2010. A browser is the most commonly used client program. The World Wide Web is the world's largest online library of linked documents. the

Ordinary browsers are application software used on computers or other devices, and need to be installed on computers or other devices ( http://zh.wikipedia.org/wiki/%E6%B5%8F%E8%A7%88%E5 %99%A8 ), such as Internet Explorer, Safari, Firefox, etc. Opera once made Opera mini ( http://zh.wikipedia.org/wi ki/Opera_Mini ) suitable for mobile devices. When using it to browse, the server of Opera company first compresses and optimizes the visited web pages. Reduce the size of the file for easy transmission, making it suitable for mobile phone browsing, and then displaying it on the mobile phone, so that traffic can be saved and the display effect can be optimized through transfer, but it also requires a client to encode and decode, and through a Special technology for rendering, usability is not high. Chrome OS ( http://zh.wikipedia.org/wiki/Chrome_os ) based on the Google Chrome browser has been launched, which raises the browser to the scope of the operating system, but its essence is still a browser software.

Cloud computing ( http://zh.wikipedia.org/wiki/%E4%BA%91%E8%AE%A1%E7%AE%97 ) is an increase, usage and delivery model of Internet-based related services, and is a An Internet-based computing method whereby shared hardware and software resources and information are made available to computers and other devices on demand. Cloud computing and big data make many things easier. In the era of cloud computing, the most frequently used browser still depends on the operating system, client browser, etc., and its use and generation of data cannot enjoy the convenience brought by cloud computing.

A large category of cloud computing is software as a service (SaaS) ( http://zh.wikipedia.org/wiki/SaaS ), software and related data are centrally hosted (hosted) in the cloud, and users usually use Thin client (thin client), through a World Wide Web browser (web browser) to access software as a service. But before this technology, the browser itself was still traditional software.

HTML5 technology is becoming popular. Currently, browsers including Chrome, Opera, and Safari support almost all HTML5 specifications. The HTML5 specification includes WebSocket ( http://zh.wikipedia.org/wiki/WebSocket ), which allows web pages to communicate with trusted servers through sockets in the browser; and the AJAX technology included in HTML4 ( http://zh.wikipedia.org/wiki/AJAX ) It also allows web pages to exchange data with the server asynchronously.

Therefore, existing browsers mainly depend on the operating system, cannot easily synchronize user data, and have troublesome problems in installing programs and plug-ins. the

Contents of the invention

The technical problem of the present invention is: to overcome the deficiencies of the prior art, to provide a cloud browser based on the webpage, to provide a series of services for the server side, and to present the functions and functions of the browser in the form of webpages on the common browser. The style makes the browser a webpage, making it have the characteristics of cross-platform, data synchronization, and convenience. the

Technical solution of the present invention: a webpage-based cloud browser, including a server and a client, characterized in that: the server includes a database, a plug-in manager, various plug-ins, a user authentication module, a web page proxy module and a user configuration module ;

Described database has adopted Mysql database, wherein has stored three tables: Users table, has stored user-related information; Plugins table, has stored the physical position of each plug-in place, startup parameter information; Log table, has stored each system state information. Historical changes are used for debugging; in addition, tables used by each plug-in are stored, which are created and managed by each plug-in;

The plug-in manager reads the information of each plug-in from the Plugins table of the database, starts each plug-in, receives the plug-in request sent by the web proxy module, calls the corresponding plug-in, and returns the processed information to the web proxy module;

Each plug-in is divided into two types: it includes the web plug-in that comes with it, and other plug-ins that use Javascript source code to load according to user needs; the dynamic link library dll file of the web plug-in is loaded by the plug-in manager, and mainly includes a request information for receiving web pages , an f function that returns the processed web page request information, and a g function that receives web page data and returns the processed web page data; the web page plug-in includes: Cookies synchronization plug-in, historical record plug-in, web page history preservation plug-in and NoImage plug-in;

Among them, the Cookies synchronization plug-in synchronizes the Cookies information saved by the user on each website through the server. The specific implementation is: the f function will first check whether the user is logged in through the main server, and if not logged in, it will not be processed; otherwise, the request data will be processed and stored in the database. Query the user's Cookies on the website and add them to the request data to return; if the parameters of the g function contain Cookies data, the Cookies data will be added or updated to the server-side database; the web page history plug-in will Save the request history of the webpage, the specific implementation is: the f function will save the URL, webpage title, and webpage icon information in the request data to the database; the g function will save the parameters, that is, the content of the obtained webpage and its rendered The screenshot of the web page is stored in the database; the web page history saving plug-in will save the content of the web page at the time of the request for future query. That is, the obtained webpage is saved in the database; the function of the NoImage plug-in is to block the images that appear in the webpage in the client, and the specific implementation is: traverse all elements in the webpage, delete all Img elements and the background-image style of all elements , to save data traffic; the above-mentioned browsers’ built-in plug-ins are automatically loaded in the client when the user logs in; for other plug-ins, the developer develops a plug-in that meets the requirements and puts it on the server, and updates the Plugins table for registration at the same time;

The user authentication module is a Web Service service exposed to the user. It receives the user authentication information sent by the user through the login/logout module in the client, including the user name and password, verifies it in the database, and returns the verification result; if the verification is successful, Then a Session stored in the server memory and a Cookie sent back to the client are generated in the server to represent the user's identity;

The web page proxy module is a Web Service service. It receives the data requested by the user through the client requesting the web page module, and sends it to the plug-in manager for processing, and then remotely calls the target website to obtain the web page content, and replaces each link, including all <a> nodes, URLs in <img> nodes, <link> nodes, and strings are handed over to the plug-in manager for processing and then returned to the user; 

The user configuration module is a Web Service service. The logged-in user can obtain the current user configuration or modify the user configuration; this module receives two kinds of requests, one is to obtain the user configuration request, which is used for loading the client; the other is to set the user configuration request , which is used to set the user configuration presentation module in the client; both requests include cookies saved in the user’s host browser to verify whether the user is logged in; the request to set the user configuration also includes plug-in enablement information, whether to change the password, new password information;

The client includes a webpage presentation module, a login/logout module, a request webpage module and a client user configuration presentation module;

The webpage presentation module includes the UI presentation of the entire client; it receives the webpage content returned by the webpage proxy module on the server side, renders it and presents it to the user;

The login/logout part is a login/logout layer (Div block); it receives the user name and password information entered by the user, sends its asynchronous request to the user authentication module of the server, and passes the authentication result back to the server through the user authentication module. login/logout layer;

The request webpage module is Javascript code, which is used to exchange data with the server's webpage proxy module asynchronously. The client can adapt to the support of the browser to choose AJAX transmission or Web Socket transmission: if the browser does not support HTML5, use AJAX; otherwise, use Web Socket;

The client user configuration presentation module is a layer with many options. If the user has logged in, the user enters this part through the menu in the browser part, and this part will display user information for modification; besides the options, there is an OK button , used to call the SetSettings function to communicate with the user configuration module on the server side to update the user configuration. the

2, a webpage-based cloud browser implementation method, characterized in that:

(1) The user logs in or logs out in the web client, and after the user verification by the server, the verification result is returned to the user; after the server receives the verification request, it queries the database and returns the query result to the user; if the query is successful, it returns To generate the server-side Session and the corresponding client-side Cookie. the

(2) The web client includes some menu items and a layer for displaying web content. The user sends a request to the target website in the web client, and the request is sent to the server asynchronously. The method can be a browser that supports HTML5 WebSocket, or AJAX for browsers that do not support HTML5; the server accesses the target website through a remote proxy and processes the plug-in, replaces the link in the web page content with the request URL for continuing proxy access, and sends the final web page data back Presented to the user in the client; the plug-in contains a function responsible for processing request data and a function responsible for processing web page data; the cloud browser comes with some plug-ins, including Cookies synchronization plug-in, history plug-in, web page history saving plug-in, NoImage Plug-ins; at the same time, developers can also develop third-party plug-ins; plug-ins communicate with data in the database;

(3) Users can view or modify user configurations in the web client, and the configuration modification results will be sent back to the server and stored in the database after being processed by the server. the

The advantage of the present invention compared with prior art is:

(1) The present invention is presented on a web page, without installation, and can be cross-platform;

(2) The present invention presents the browser through the webpage, which can better support the synchronization of browsing data, including Cookies, historical records, etc., and can also upgrade and backup the browser more easily;

(3) The plug-in of the present invention is installed on the server side and can be used without client installation and configuration, which is more convenient and safer;

(4) The present invention adds more usability to browsers through server transfer technology (i.e. web proxy), such as compression to save traffic, remove advertisements, etc.;

(5) A large amount of data is stored in the server of the present invention, making personalized recommendation and data mining possible. the

Description of drawings

Fig. 1 is the realization flow chart of server end and client end of the present invention, and arrow represents the flow direction of data or information;

Figure 2 is a flow chart of processing various requests at the server side;

FIG. 3 is a flow chart of the operation of the plug-in manager on the server side. the

Detailed ways

As shown in Figure 1, a kind of webpage-based cloud browser of the present invention is characterized in that: it is a B/S (Browser/Server) architecture, including a server end and a client end, and the server end includes a process that provides web page proxy services and Multiple other service processes, such as user authentication, user configuration, etc.; the client is an HTML web page;

The server side processes, stores, and retrieves the sent or received information to provide the following functions:

i. Cookies synchronization: Synchronize the Cookies content of each website in multiple devices, that is, multiple browsers;

ii. History record preservation: store the user's browsing history on the server side, and support deletion;

iii. External plug-in: the plug-in is stored and executed on the server side, and processes the cloud browser itself and the user's request and web page content;

iv. Web page history preservation: store a snapshot of the web page browsed by the user on the server side, so that the content at that time can still be viewed when the web page changes in the future;

v. Website recommendation: According to the user's usage habits, analyze the user's behavior and recommend websites that the user may be interested in;

vi. Statistics: Count the usage history of a large number of users, and then form a large database with a large number of users' usage habits;

In terms of implementation, the server side receives the requested URL information or user data to perform web page proxy and user verification, obtain user information, set user information functions, and provide plug-in services by dynamically calling the library or dynamically executing code; including Cookies synchronization, web page history, web page history preservation, NoImage and other functions; users can set in the client to enable or disable plug-ins;

The working process of the webpage proxy is: the webpage proxy is a network service, monitors the TCP request with the HTTP protocol at port 80, and receives the client's request to a certain website; processing the request adds additional information such as Cookies data Then, according to the request, visit the specified webpage, obtain the content of the webpage, process the content of the webpage, that is, replace the URL of the hyperlink and picture, and then send it back to the client; 

The principle of the plug-in is: the plug-in is divided into a browser plug-in and a web page plug-in; the browser plug-in is a section of JavaScript code, which needs to be used after a security audit, and is called when the cloud browser is loaded in the host browser; the web page plug-in can be It is abstracted into two functions. The parameter of one function f is the client’s request data for a certain URL, and the result is the processed result; the parameter of the other function g is the obtained web page content, and the result is the processed result ;

The client side of the cloud browser renders and develops through HTML4, HTML5, and JavaScript. It uses AJAX to communicate in the browser that does not support HTML5. It can also use the Web Socket function of HTML5. Web Socket can provide better performance. and less bandwidth usage;

The client includes four parts: a webpage presentation section, a login/logout section, a webpage request section and a user configuration presentation section; the function of the client terminal is to communicate with the server, acquire and modify user information and present webpage content. the

The present invention will be described in detail below with reference to the accompanying drawings and embodiments. As shown in FIG. 1 , the present invention includes two parts: a server end and a client end. the

The server side includes database, plug-in manager, various plug-ins, user authentication, web page proxy, and user configuration. The specific process is shown in Figure 2. the

1. The database adopts Mysql database, because it is free and open source and easy to use. Three tables are stored in it:

(11) Users table, which stores user-related information, such as user name, password, and whether the plug-in is enabled or not. the

(12) The Plugins table stores information such as the physical location and startup parameters of each plug-in. the

(13) Log table, which stores the historical changes of each system state for use during debugging. the

In addition, there are tables used by each plug-in, which are created and managed by each plug-in. the

2. The plug-in manager reads the information of each plug-in from the Plugins table, starts each plug-in, receives the plug-in request, calls the corresponding plug-in, and returns the processed information. As shown in Figure 3. the

3. There are two types of plug-ins: the dynamic link library dll file containing the web plug-in is loaded by the plug-in manager, and the Javascript source code is loaded into the cloud browser as a browser plug-in according to user needs; the web plug-in, as described before, mainly includes two function. The browser plug-ins that come with Cloud Browser include:

(31) Cookies synchronization plug-in: The f function will first check whether the user is logged in through the main server, if not logged in, it will not be processed, the same below. Otherwise, process the request data, query the user’s Cookies on the website in the database and add them to the request data and return; if the parameters of the g function contain Cookies data, add or update the Cookies data to the server-side database . the

(32) History plug-in: the f function will save information such as the URL in the request data, the webpage title, the webpage icon, etc. into the database; the g function will save the rendered screenshot of the parameter (obtained webpage) into the database. the

(33) Web page history saving plug-in: if the f function finds that the requested data includes a web page history saving request, then in the g function, save the parameters (obtained web pages) into the database. the

The browser plug-in is automatically loaded in the client when the user logs in. The browser plug-ins that come with Cloud Browser include:

(34) NoImage plug-in: traverse all elements in the webpage, delete all Img elements and background-image styles of all elements, to save data traffic. the

In addition to these plug-ins, developers can develop plug-ins that meet the requirements and put them on the server, while updating the Plugins table for registration. the

4. The following three modules use the Web Service technology in Asp.net to expose some services to the client for AJAX or WebSocket asynchronous calls. the

(41) The user verification module is a Web Service exposed to the user, which receives the user verification information sent by the user, such as user name, password, etc., verifies it in the database, and returns the verification result. If the verification is successful, a Session stored in the server and a Cookie sent back to the client are generated in the server to represent the identity of the user. the

(42) The web page proxy module is also a Web Service service, which receives the user's basic information and request data, passes them to the plug-in manager for processing, and then remotely calls the target website to obtain the web page content, and replaces each link (all <a> nodes, <img > node, <link> node, URL in the string, etc.), and then handed over to the plug-in manager for processing and returning to the user. the

The user's request information includes the following:

a. Cookies saved in the user's host browser are used to verify whether the user is logged in;

b. The URL of the target website;

c. The URL of the referring web page;

d.HTTP action, such as GET or POST;

e. If the HTTP action is POST, the additional data content in the request should also be included. the

The method for replacing the link in the web page is: use regular expressions to match the URL in the HTML node, replace the matched character string with a Javascript function, and use the matched character string as a parameter of the function to perform The next asynchronous call to the web proxy module. the

(43) The user configuration module is also a Web Service service. A logged-in user can obtain the current user configuration or modify the user configuration. the

The module receives two kinds of requests. The first is to obtain a user configuration request, which is used for loading the client; the second is to set the user configuration request, which is used for setting by the user configuration presentation module in the client. Both requests include cookies stored in the user's host browser to verify that the user is logged in. The setting user configuration request also includes plug-in enablement information, whether to modify the password, new password and other information. the

The asynchronous call adopts the TCP protocol, and the data structure to be transmitted is transmitted after the client performs XML serialization or Json serialization. On the server side, deserialize it to get the original data structure. the

Client includes web page rendering, login/logout, request web page, user configuration part. the

A. Web page rendering includes the UI rendering of the entire client, which is mostly designed using Div+CSS, including menus and an IFrame frame as the container of the browsed web page. the

The menu is generally at the top of the webpage, and the menu includes buttons such as back, forward, and favorites. In addition, some browser plug-ins can also add buttons to the menu. the

The IFrame frame is used to browse web pages. Its content is controlled by a piece of code that is part of the requested web page and receives content returned by the server. the

B. The login/logout part is a login/logout layer (Div block), which contains text boxes for filling in user name, password and other information, a button for login or registration, and a button for return. When the user clicks on login or register, it will communicate with the user authentication module on the server side in the form of AJAX, and the returned message will be handed over to a piece of code for processing. If the verification is successful, cookies are added to the host browser; otherwise, an error message is displayed. the

The Login/Logout and Register buttons can be found in the menu, click to bring up this login/logout layer. the

C. The part of the requested webpage is mainly Javascript code, which is used to exchange data with the webpage agent module of the server asynchronously. The client can adapt to the support of the browser to choose AJAX or Web Socket: if the browser does not support HTML5 (such as IE8 and before), AJAX will be used; otherwise, Web Socket will be used. the

The code mainly includes the following functions:

a.Present function, the parameter is a piece of HTML code, the browser plug-in is applied to it and displayed in the Iframe. the

b. The Request function is used to package the URL that needs to be accessed, and then send it to the web proxy module on the server side, wait for the result returned by the server and send it to the Present function for display. the

c.Login function, the parameters are user name and password, communicate with the server for verification, if successful, update Cookies and return successful information, otherwise return failure information. the

d.Register function, the parameters are user name and password, communicate with the server to register, if successful, return a successful message, otherwise return a failure message. the

e.GetSettings function, used to communicate with the server and obtain user information. Called when login is complete. the

f.SetSettings function, the parameters are all settings, communicate with the server and set user information. the

D. The user configuration section is a layer with many options. If the user is logged in, the user can enter this section through the menu in the browser section, which will display the user information and can be modified. In addition to the options, there is an OK button, which is used to call the SetSettings function to communicate with the user configuration module on the server side to update the user configuration. the

As shown in Figure 2, it is the workflow of the cloud browser server. the

(1) The cloud browser server will listen to user requests on port 80, and once a user request is received, it will determine the type of user request;

(2) If it is a proxy request, it will be handed over to the webpage proxy module for processing. The web proxy module proceeds in sequence according to the flow in the figure, and returns the results to the user;

(3) If it is a user configuration request, send it to the user configuration module. The user configuration module proceeds sequentially according to the flow in the figure, and returns configuration information or configuration results to the user;

(4) If it is a user authentication request, it is handed over to the user authentication module. The user verification module proceeds sequentially according to the flow in the figure, and returns the verification result to the user;

(5) Otherwise, it is an unrecognized request and returns an error message. the

As shown in Figure 3, it is the workflow of the plug-in manager. the

(1) First, when the plug-in manager is just started, it first loads all plug-in libraries in sequence and performs corresponding processing. Then enter the monitoring state;

(2) Once a request from the web proxy module is monitored, it will be accessed in turn by the two functions of all plug-ins to process it, and then returned to the web proxy module for processing results;

(3) If a shutdown request is detected, stop working. the

Claims (2)

1. A webpage-based cloud browser, comprising a server end and a client terminal, is characterized in that: said server comprises a database, a plug-in manager, each plug-in, a user authentication module, a webpage agent module and a user configuration module; Described database has adopted Mysql database, wherein has stored three tables: Users table, has stored user-related information; Plugins table, has stored the physical position of each plug-in place, startup parameter information; Log table, has stored each system state information. Historical changes are used for debugging; in addition, tables used by each plug-in are stored, which are created and managed by each plug-in; The plug-in manager reads the information of each plug-in from the Plugins table of the database, starts each plug-in, and receives the plug-in request sent by the web proxy module, calls the corresponding plug-in, and returns the processed information to the web proxy module; Each plug-in is divided into two types: it includes the web plug-in that comes with it, and other plug-ins that use Javascript source code to load according to user needs; the dynamic link library dll file of the web plug-in is loaded by the plug-in manager, and mainly includes a request information for receiving web pages , an f function that returns the processed web page request information, and a g function that receives web page data and returns the processed web page data; the web page plug-in includes: Cookies synchronization plug-in, historical record plug-in, web page history preservation plug-in and NoImage plug-in; Among them, the Cookies synchronization plug-in synchronizes the Cookies information saved by the user on each website through the server. The specific implementation is: the f function will first check whether the user is logged in through the main server, and if not logged in, it will not be processed; otherwise, the request data will be processed and stored in the database. Query the user's Cookies on the website and add them to the request data to return; if the parameters of the g function contain Cookies data, the Cookies data will be added or updated to the server-side database; the web page history plug-in will Save the request history of the web page. The specific implementation is: the f function will save the URL, web page title, and web page icon information in the request data to the database; the g function will save the parameters, that is, the content of the obtained web page and its rendered Screenshot to the database; the web page history saving plug-in will save the content of the web page at the time of the request for future query. The acquired web pages are saved in the database; the function of the NoImage plug-in is to block the images that appear in the web pages in the client, and the specific implementation is: traverse all elements in the web page, delete all Img elements and the background-image style of all elements, In order to save data traffic; the plug-ins of the above browsers are automatically loaded in the client when the user logs in; for other plug-ins, the developer develops a plug-in that meets the requirements and puts it on the server, and updates the Plugins table for registration at the same time; The user authentication module is a Web Service service exposed to the user. It receives the user authentication information sent by the user through the login/logout module in the client, including the user name and password, verifies it in the database, and returns the verification result; if the verification is successful, Then a Session stored in the server memory and a Cookie sent back to the client are generated in the server to represent the identity of the user; The web page proxy module is a Web Service service. It receives the data requested by the user through the client requesting the web page module, and sends it to the plug-in manager for processing, and then remotely calls the target website to obtain the web page content, and replaces each link, including all <a> nodes, The <img> node, <link> node, and the URL in the string are then handed over to the plug-in manager for processing and returned to the user; The user configuration module is a Web Service service. The logged-in user can obtain the current user configuration or modify the user configuration; this module receives two kinds of requests, one is to obtain the user configuration request, which is used for loading the client; the other is to set the user configuration request , which is used to set the user configuration presentation module in the client; both requests include cookies saved in the user’s host browser to verify whether the user is logged in; the request to set the user configuration also includes plug-in enablement information, whether to change the password, new password information; The client includes a webpage presentation module, a login/logout module, a request webpage module and a client user configuration presentation module; The webpage presentation module includes the UI presentation of the entire client; it receives the webpage content returned by the webpage proxy module on the server side, renders it and presents it to the user; The login/logout part is a login/logout layer (Div block); it receives the user name and password information entered by the user, sends its asynchronous request to the user authentication module of the server, and passes the authentication result back to the server through the user authentication module. login/logout layer; The request web page module is Javascript code, which is used to exchange data with the web proxy module of the server asynchronously. The client can adapt to the support of the browser to choose AJAX transmission or Web Socket transmission: if the browser does not support For HTML5, use AJAX; otherwise, use Web Socket; The client user configuration presentation module is a layer with many options. If the user has logged in, the user enters this part through the menu in the browser part, and this part will display user information for modification; besides the options, there is an OK button , used to call the SetSettings function to communicate with the user configuration module on the server side to update the user configuration. 2. A webpage-based cloud browser implementation method, characterized in that: (1) The user logs in or logs out in the web client, and after the user verification by the server, the verification result is returned to the user; after the server receives the verification request, it queries the database and returns the query result to the user; if the query is successful, it returns To generate the server-side Session and the corresponding client-side Cookie; (2) The web client includes some menu items and a layer for displaying web content. The user sends a request to the target website in the web client, and the request is sent to the server asynchronously. The method can be a browser that supports HTML5 WebSocket, or AJAX for browsers that do not support HTML5; the server accesses the target website through a remote proxy and processes the plug-in, replaces the link in the web page content with the request URL for continuing proxy access, and sends the final web page data back Presented to the user in the client; the plug-in contains a function responsible for processing request data and a function responsible for processing web page data; the cloud browser comes with some plug-ins, including Cookies synchronization plug-in, history plug-in, web page history saving plug-in, NoImage Plug-ins; at the same time, developers can also develop third-party plug-ins; plug-ins communicate with data in the database; (3) Users can view or modify user configurations in the web client, and the configuration modification results will be sent back to the server and stored in the database after being processed by the server.

Images