CN104636146A

CN104636146A - Online visual customizing method and system

Info

Publication number: CN104636146A
Application number: CN201510098004.2A
Authority: CN
Inventors: 朱奕; 周华强
Original assignee: BEIJING HANDSCAPE TECHNOLOGY Co Ltd
Current assignee: Beijing Zhong Xian Electronic Technology Development Co ltd
Priority date: 2015-03-05
Filing date: 2015-03-05
Publication date: 2015-05-20
Anticipated expiration: 2035-03-05
Also published as: CN104636146B

Abstract

The invention provides an online visual customizing method and system. The online visual customizing method includes: receiving an online customizing instruction and displaying an online customizing page; receiving a page slicing and remaining instrument and slicing the network page according to the page slicing and remaining instrument to obtain network page slices; sending network page slice data to a server end; receiving an application edition instrument and connecting the service end to acquire the network page slice data according to the application edition instrument; generating the network page slices according to the network slice data and performing visual edition on the network slices to obtain an application page. With the method, a visual edition environment can be provided, developing difficulty is lowered, multiple types of users are satisfied, the page can be easily combined into a new network application by dragging in the page, development cost and time are greatly saved, procedure is simplified, the network application is generated more simply and rapidly, requirements of different terminals on network page display are met, and user experience is improved.

Description

A kind of visual on-line customization method and system

Technical field

The present invention relates to technical field of network communication, refer to a kind of visual on-line customization method and system especially.

Background technology

Web browser is the Client browse program that WWW (Web) is served, and can send various request to Web server, and makes an explanation to the hypertext information sent from server and various multimedia data format, show and play.Compared with workstation, PC, mobile terminal resource is relatively limited, and therefore mobile terminal web browsing device is more difficult when developing compared with the web browser that workstation, PC run, and functionally has more restrictions.Just because of this reason, the mobile terminal built-in web browser of the current overwhelming majority can not be resolved execution and be comprised complicated JS (JavaScript, based on object and event-driven and there is the client-side scripting language of relative safety) a Web page, this causes mobile terminal built-in web browser normal browsing can not comprise the Web page of complicated JS.

Normal browsing the problem of the Web page of complicated JS can not be comprised in order to solve mobile terminal built-in browser, method used in the prior art is by carrying out splitting and reorganizing technology to Web application, when not revising the former page, the content of specifying in one or more page is tailored out, forms a new page.But there is following defect in prior art: this technology needs the Knowledge Base such as certain JavaScript, HTML, CSS, be applicable to have the user that higher Specialized training crosses use, then cannot left-hand seat immediately for the user of new contact or the popular client that do not possess specialized Web application mobile technology, also need first to spend a large amount of time to give training, learn even if tailor a simple page.

Therefore, need to provide a kind of new solution, it can reduce development difficulty, is applicable to polytype user and uses, and particularly can be applicable to non-professional ordinary populace user and use, there is the shirtsleeve operation page, make user directly in operation pages, just can be combined into a new Web by drag operation intuitively to apply, thus greatly save cost of development and time, simplify flow process, allow and generate Web application more simply, fast.

Summary of the invention

The invention provides a kind of novel visual on-line customization method and system, can customization operations be simplified, realize visualized operation, quick generating network application.

For solving the problems of the technologies described above, embodiments of the invention provide a kind of visual on-line customization method, and described method comprises:

Receive online custom instruction, show online customized web page;

Receive the page and cut instruction, cut instruction according to the described page and Webpage is cut, obtain webpage section;

Webpage slice of data is sent to service end;

Receive application edit instruction, connect described service end according to described application edit instruction and obtain webpage slice of data;

According to described webpage slice of data generating web page section, carry out visual edit to described webpage section, be applied the page.

Preferably, the online custom instruction of described reception, shows online customized web page, comprising:

Receive online custom instruction, obtain the authentication information in described on-line customization instruction;

Utilize described authentication information to carry out authentication, when described authentication is passed through, show online customized web page.

Preferably, the described on-line customization page comprises former web page editing district and section directorial area.

Preferably, the described page cuts instruction and comprises: page area divides instruction, content of pages cuts instruction and page section edit instruction.

Preferably, receive the page and cut instruction, cut instruction according to the described page and Webpage is cut, obtain webpage section, comprising:

Receive the page and cut instruction, divide instruction according to described page area and Region dividing is cut to former webpage;

Cut instruction according to described content of pages, the content of pages cutting region divided is cut, obtain page section;

According to described page section edit instruction, editor is carried out to described page section and obtains the section of described webpage.

Preferably, receive the page and cut instruction, divide instruction according to described page area and Region dividing is cut to former webpage, cut instruction according to described content of pages, the content of pages cutting region divided is cut, obtain page section, comprising:

Receive the drag operation information that user sends, Region dividing is cut to former webpage, the content of pages cutting region divided is cut, obtain page section, editor is carried out to described page section and obtains the section of described webpage.

Preferably, described webpage slice of data is sent to service end, comprises:

Webpage section is converted to webpage slice of data, is sent to service end with JSON character string forms.

Preferably, described reception application edit instruction, connects described service end according to described application edit instruction and obtains webpage slice of data, comprising:

Receive application edit instruction, obtain the authentication information in described application edit instruction;

Utilize described authentication information to carry out authentication, when described authentication is passed through, connect described service end according to described application edit instruction and obtain webpage slice of data.

Preferably, describedly connect described service end according to described application edit instruction and obtain webpage slice of data, comprising:

Send webpage slice of data according to described application edit instruction to service end and obtain request;

Receive the webpage slice of data that service end sends.

Preferably, described according to described webpage slice of data generating web page section, visual edit is carried out to described webpage section, before the page that is applied, also comprises:

According to application edit instruction display application edit page, described application edit page comprises page listings district, page editing preview region and webpage section district.

Preferably, described according to described webpage slice of data generating web page section, comprising:

According to described webpage slice of data generating web page section, and described webpage section is presented at the webpage section district in described application edit page;

Carry out the preview of application page editing according to described application edit instruction in the page editing preview region of application edit page, and the application page of generation is presented at page listings district.

Preferably, described reception application edit instruction, before connecting described service end acquisition webpage slice of data, also comprises according to described application edit instruction:

Receive application and create instruction, create instruction according to described application and set up application.

The present invention also provides a kind of visual on-line customization method, and described method comprises:

Receive webpage slice of data, described webpage slice of data is saved in database;

Receive webpage slice of data and obtain request, obtain request according to described webpage slice of data and send webpage slice of data.

Preferably, described reception webpage slice of data obtains request, obtains request and sends webpage slice of data, comprising according to described webpage slice of data:

Obtain request according to described webpage slice of data, obtain described webpage slice of data and obtain the authentication information in asking;

Utilize described authentication information to carry out authentication, when described authentication is passed through, send webpage slice of data.

The present invention also provides a kind of visual on-line customization system, and described system comprises:

Customized web page display module, for receiving online custom instruction, shows online customized web page;

The page cuts module, cutting instruction, cutting instruction cut Webpage according to the described page for receiving the page, obtains webpage section;

Data transmission blocks, for being sent to service end by webpage slice of data;

Data acquisition module, for receiving application edit instruction, connecting described service end according to described application edit instruction and obtaining webpage slice of data;

Application editor module, for cutting into slices according to described webpage slice of data generating web page, carry out visual edit to described webpage section, be applied the page.

Preferably, described customized web page display module comprises:

First identification authenticating unit, for receiving online custom instruction, obtains the authentication information in described on-line customization instruction;

Customized web page display unit, for utilizing described authentication information to carry out authentication, when described authentication is passed through, shows online customized web page.

Preferably, the described page cuts module and comprises:

Area division unit, cuts instruction for receiving the page, divides instruction cut Region dividing to former webpage according to described page area;

The page cuts unit, for cutting instruction according to described content of pages, cuts the content of pages cutting region divided, and obtains page section;

Section edit cell, for according to described page section edit instruction, carries out editor to described page section and obtains the section of described webpage.

Preferred described area division unit comprises:

Region dividing subelement, for receiving the drag operation information that user sends, dividing instruction according to described page area and cutting Region dividing to former webpage;

The described page cuts subelement, for receiving the drag operation information that user sends, cuts the content of pages cutting region divided, and obtains page section;

Section editor subelement, for receiving the drag operation information that user sends, carrying out editor to described page section and obtaining the section of described webpage.

Preferably, described data transmission blocks comprises:

Data transmission unit, for webpage section is converted to webpage slice of data, is sent to service end with JSON character string forms.

Preferably, described data acquisition module comprises:

Second identification authenticating unit, for receiving application edit instruction, obtains the authentication information in described application edit instruction;

Data capture unit, for utilizing described authentication information to carry out authentication, when described authentication being passed through, connecting described service end according to described application edit instruction and obtaining webpage slice of data.

Preferably, described data acquisition module comprises:

Request transmitting unit, obtains request for sending webpage slice of data according to described application edit instruction to service end;

Data receipt unit, for receiving the webpage slice of data that service end sends.

Preferably, described system also comprises:

Application editor display module, for according to application edit instruction display application edit page, described application edit page comprises page listings district, page editing preview region and webpage section district.

Preferably, described application editor module comprises:

Section generation unit, for cutting into slices according to described webpage slice of data generating web page, and is presented at the webpage section district in described application edit page by described webpage section;

Application edit cell, for carrying out the preview of application page editing according to described application edit instruction in the page editing preview region of application edit page, and is presented at page listings district by the application page of generation.

Preferably, described system also comprises

Application creation module, creating instruction for receiving application, creating instruction set up application according to described application.

Data memory module, for receiving webpage slice of data, is saved in database by described webpage slice of data;

Data response sending module, obtaining request for receiving webpage slice of data, obtaining request send webpage slice of data according to described webpage slice of data.

Preferably, described data response sending module comprises:

Tiers e'tat authentication ' unit, for obtaining request according to described webpage slice of data, obtaining described webpage slice of data and obtaining the authentication information in asking;

Data response sends subelement, for utilizing described authentication information to carry out authentication, when described authentication is passed through, sends webpage slice of data.

Present invention also offers a kind of visual on-line customization module being applied to adaptive system based on cloud framework, described adaptive system comprises following functions module:

Access Control module TailorForwarder: the load balance process being responsible for HTTP, mobile terminal receive request, to the TailorWorkHorse node transmitting mobile terminal request that current loads is little, receive TailorWorkHorse node processing result, forward object information to mobile terminal;

Visible customization unit module VisualTailor: visual on-line customization module realizes the page business function fragment of catching visually and collecting in the page, user on a web browser visually, convenient and swift and realize former Web system intuitively the page on the restructuring of function secondary generate new Web application;

Integrated Development module TailorIDE: provide Tailor engineering Integrated Development Environment, realizes engineering and creates, manages WebApp engineering and related resource, have and support that JS, HTML, CSS, JSON and this several mixed code carry out the function of painted display; Tailor IDE also realizes WebApp engineering and the startup of TailorServer integrated debugging device in IDE, time-out and stopping;

Web page dynamic analysis engine/dynamic analysis server module TailorWorkHorse:TailorWorkHorse provides Web page dynamic analysis to serve, can infinite expanding TailorWorkHorse run node form;

Engineering memory node module StoreWorkHorse: be responsible for Data distribution8 formula data storage and search, can be made up of the StoreWorkHorse memory node of infinite expanding, is responsible for storing the management information such as Tailor engineering information, Web module library and engineering authority;

Engineering space module TailorWorkspace: storage and the retrieval of being responsible for Tailor engineering;

Self-help service for user administration module: the business monitoring and the system monitoring that realize user self-help, and service management and system administration services;

Operation management console module: realize enterprises registration management and whole platform service and system running state monitor and managment.

Further, described TailorForwarder bears two functions, one is that between completing user and web page dynamic analysis service-Engine TailorWorkHorse, user asks the information interaction with request results, two is the pressure balancing multiple web page dynamic analysis service-Engine, realizes load balancing.

Further, in the press process of the multiple web page dynamic analysis engine of balance, the state of all web page dynamic analysis engines in TailorForwarder meeting automatic regular polling cloud framework, judge the payload of each web page dynamic analysis engine, and new user is asked the web page dynamic analysis engine that sends to load little, thus realize load balancing.

Further, described visual on-line customization module is formed primarily of TailorIDEPlug and TailorIDEService, mutually have been cooperated the visual on-line customization page by TailorIDEPlug and TailorIDEService, wherein:

TailorIDEPlug primary responsibility realizes realizing visually the process activities such as the cutting, process of Web section, combination;

The store and management that TailorIDEService primary responsibility Web cuts into slices.

The present invention additionally provides a kind of visual on-line customization method simultaneously, and it is realized by the visual on-line customization module in above-mentioned adaptive system, and the method comprises the following steps:

Step 1: input needs the original web address of tailoring in TailorIDEPlug;

Step 2:TailorIDEPlug utilizes browser plug-in technology to catch visually webpage and collects the page business function fragment in the page, forms Web section one by one;

Step 3: provide template support to Web section, the concrete setting up procedure such as layout, pattern, specifically comprises:

Transfer the Web template base in WebApp cloud memory structure by TairlorWorkSpace, the Web section of extracting for TailorIDEPlug provides template support;

What provided by TailorIDEPlug integratedly arranges environment, to interested Web section by selecting Web template, arranges the layout, pattern etc. of Web section;

Step 4: the Web set section is transferred TairlorWorkHorse engine by TairlorIDEService and debugs, checking Web section mobile phone terminal operational effect, if dissatisfied, can also reset by returning step 3; If be satisfied with Web dicing effect, perform step 5 and preserve section.

Step 5: send to TairlorWorkHorse to preserve the Web set section, specifically comprise:

TairlorWorkHorse receives the Web slice information needing to preserve, and is kept in the Web slice library in WebApp cloud memory structure; Be stored in the Web section of Web slice library, the parts that can be used as WebApp engineering carry out assembling, integrated and run, but can not separately as application accessed by the user and use by outer net;

Step 6: user can WebApp engineering to set Web section assemble, integrated, form the application in engineering, described be applied as a webpage or other application, described WebApp engineering is can directly by the application of user by extranet access;

Step 7: the WebApp engineering set is transferred TairlorWorkHorse engine by TairlorIDEService and debugs, checks WebApp engineering mobile phone terminal operational effect, if dissatisfied, can also reset by returning step 6; If be satisfied with WebApp engineering effort, perform step 8 and preserve engineering;

Step 8: send to TairlorWorkHorse to preserve the WebApp engineering set; TairlorWorkHorse receives the Web engineering information needing to preserve, and is kept in the StoreWorkHorse engineering node storehouse in WebApp cloud memory structure.

Technique scheme of the present invention at least achieves following beneficial effect:

Cutting Webpage by cutting instruction according to the described page, obtaining webpage section and cutting into slices according to described webpage slice of data generating web page, carry out visual edit to described webpage section, be applied the page.Visual editing environment can be provided, reduce development difficulty, be applicable to polytype user to use, particularly can be applicable to non-professional ordinary populace user to use, the page simply directly just can be combined into a new network application at the page through capable pulling by user, greatly saves cost of development and time, simplify flow process, allow generating network apply more simple and fast, thus meet the demand of different terminals Webpage display, improve Consumer's Experience.

Accompanying drawing explanation

Figure 1A is the visual on-line customization method flow diagram of the embodiment of the present invention 1;

Figure 1B-1D is each sub-step logical flow chart of visual on-line customization method of the embodiment of the present invention 1;

Fig. 2 is the visual on-line customization method flow diagram of the embodiment of the present invention 2;

Fig. 3 is the visual on-line customization system architecture diagram of the embodiment of the present invention 3;

Fig. 4 is the visual on-line customization system architecture diagram of the embodiment of the present invention 4;

Fig. 5 is another structural framing figure of the visual on-line customization system of the embodiment of the present invention 4;

Fig. 6 is the schematic diagram of visual prototype of the present invention design section page;

Fig. 7 is the schematic diagram of visual prototype design ap-plication management page of the present invention;

Fig. 8 is the schematic diagram of visual prototype design and assembly page of the present invention;

Fig. 9 is the structured flowchart of the adaptive system based on cloud framework of the embodiment of the present invention 4.

Figure 10 is the method flow diagram of the adaptive system based on cloud framework of the embodiment of the present invention 4.

Figure 11 is the principle of work schematic diagram of the visual on-line customization module of the adaptive system based on cloud framework of the embodiment of the present invention 4.

Figure 12 is the principle of work schematic diagram of the Integrated Development module of the adaptive system based on cloud framework of the embodiment of the present invention 4.

Figure 13 is the engineering debug principle of work schematic diagram of the Integrated Development module of the adaptive system based on cloud framework of the embodiment of the present invention 4.

Figure 14 is the principle of work schematic diagram of the dynamic analysis server module of the adaptive system based on cloud framework of the embodiment of the present invention 4.

Embodiment

For making the technical problem to be solved in the present invention, technical scheme and advantage clearly, be described in detail below in conjunction with the accompanying drawings and the specific embodiments.It is to be understood that; following specific embodiment only schematically illustrates; unless otherwise specified; even if the Different Optimization means in the different embodiment of the application and each embodiment are not set forth in the same embodiment; also should be understood as that and can be applied to any other side described here, embodiment or example; unless incompatible or be explicitly excluded outside in this article with it, otherwise combination between all embodiments not having limit of the application or sub-portfolio are all in record of the present invention and protection domain.Purport of the present invention and preferred implementation thereof is elaborated below with reference to instructions and accompanying drawing.

Embodiment 1

As shown in figures 1 a-1d, the visual on-line customization method of one of the embodiment of the present invention, described method comprises:

Step 101: receive online custom instruction, shows online customized web page.

Wherein, the described on-line customization page can comprise former web page editing district and section directorial area.The online custom instruction of described reception, shows online customized web page, can comprise:

In the present embodiment, the intuitive of on-line customization is improve by showing online customized web page, user directly can carry out customization operations on the on-line customization page, effectively can improve the security of row customization again by carrying out certification to the authentication information in on-line customization instruction.

Step 102: receive the page and cut instruction, cut instruction cut Webpage according to the described page, obtains webpage section.

Wherein, the described page cuts instruction and can comprise: page area divides instruction, content of pages cuts instruction and page section edit instruction.Receive the page and cut instruction, cut instruction according to the described page and Webpage is cut, obtain webpage section, comprising:

Receive the page and cut instruction, divide instruction according to described page area and Region dividing is cut to former webpage; Cut instruction according to described content of pages, the content of pages cutting region divided is cut, obtain page section; According to described page section edit instruction, editor is carried out to described page section and obtains the section of described webpage.Preferably, the drag operation information that user sends can be received, Region dividing is cut to former webpage, the content of pages cutting region divided is cut, obtain page section, editor be carried out to described page section and obtains the section of described webpage.

In the present embodiment, user can facilitate intuitively by the operation former network page content of fast selecting such as to pull and carry out network intercepting, obtains network section.

Step 103: webpage slice of data is sent to service end.

Wherein, webpage section can be converted to webpage slice of data, be sent to service end with JSON character string forms.

Further, by carrying out drag operation in the page of browser, after content of pages is drawn to break area, the section of this webpage is converted into webpage slice of data in break area after row relax, and is sent to service end with JSON character string forms.

In the present embodiment, by webpage section is converted to webpage slice of data and sends to server, the memory data output of browser can be effectively reduced, and ensure integrality and the security of webpage slice of data.

Step 104: receive application edit instruction, connects described service end according to described application edit instruction and obtains webpage slice of data.

Wherein, application edit instruction can be received, obtain the authentication information in described application edit instruction; Utilize described authentication information to carry out authentication, when described authentication is passed through, connect described service end according to described application edit instruction and obtain webpage slice of data.Concrete, send webpage slice of data according to described application edit instruction to service end and obtain request; Receive the webpage slice of data that service end sends.

In the present embodiment, obtain webpage slice of data by Connection Service end, can ensure that user carries out application editor anywhere or anytime, improve the movability of row customization again.

Preferably, described according to described webpage slice of data generating web page section, visual edit is carried out to described webpage section, be applied before the page, also comprise: according to application edit instruction display application edit page, described application edit page comprises page listings district, page editing preview region and webpage section district.

Step 105: according to the described webpage slice of data generating web page section obtained, carry out visual edit to described webpage section, be applied the page.

Wherein, according to the described webpage slice of data generating web page section obtained, and described webpage section can be presented at the webpage section district in described application edit page; Carry out the preview of application page editing according to described application edit instruction in the page editing preview region of application edit page, and the application page of generation is presented at page listings district.

Preferably can also analyze the network section generated, tracking and location, thus improve the efficiency of application editor.

In the present embodiment, can install visual on-line customization plug-in unit in a browser to realize visual on-line customization method, when visual on-line customization plug-in unit starts and activate, visual on-line customization plug-in unit realizes repartitioning region to browser display area.

Concrete, the logical flow chart of step 102 as shown in Figure 1B, receive after the page cuts instruction and enter step 1101, input user name, password carries out authentication: if be verified, then perform step 1102 to start to select section at the page, after completing, execution step 1103 is edited and processed section, then performs step 1104 and input slice information, then perform step 1105 and preserve slice information, finally terminate; If authentication failed, then perform step 1106 and provide miscue, whether user decides in its sole discretion and again verifies, if so, then gets back to step 1101, if otherwise directly terminated.

The logical flow chart of step 105 as shown in Figure 1 C, step 1201 is entered after receiving application edit instruction, input user name, password carries out authentication: if be verified, then perform the application that step 1202 selects to need editor, then perform step 1203 to edit certain page in this application, perform step 1204 afterwards and section is dragged on the page, then perform step 1205 and input this page data relevant information, perform step 1206 afterwards page data is preserved, finally terminate; If authentication failed, then perform step 1207 and provide miscue, whether user decides in its sole discretion and again verifies, if so, then gets back to step 1201, if otherwise directly terminated.

Step receives application and creates instruction, create instruction according to described application and set up the logical flow chart of application as shown in figure ip, receive after application creates instruction and enter step 1301, input user name, password carries out authentication: if be verified, then perform step 1302 and input application message, then perform 1303 and preserve application data, finally terminate; If authentication failed, then perform step 1304 and provide miscue, whether user decides in its sole discretion and again verifies, if so, then gets back to step 1301, if otherwise directly terminated.

The visual on-line customization method of the embodiment of the present invention, by cutting instruction according to the described page, Webpage is cut, obtain webpage section and cut into slices according to described webpage slice of data generating web page, carry out visual edit to described webpage section, be applied the page.Shown in Fig. 6-8, i.e. the App application of mobile phone terminal that how generated by this visual on-line customization method of the common Web page of schematic diagram one simple PC end.

The visual on-line customization method of the embodiment of the present invention, visual editing environment can be provided, reduce development difficulty, be applicable to polytype user to use, particularly can be applicable to non-professional ordinary populace user to use, the page can simply directly to pull through row at the page by user just can be combined into a new network application, greatly save cost of development and time, simplify flow process, generating network is allowed to apply more simple and fast, thus meet the demand of different terminals Webpage display, improve Consumer's Experience.

Embodiment 2

As shown in Figure 2, the visual on-line customization method of one of the embodiment of the present invention, described method comprises:

Step 201: receive webpage slice of data, described webpage slice of data is saved in database.

Step 202: receive webpage slice of data and obtain request, obtains request according to described webpage slice of data and sends webpage slice of data.

Wherein, described reception webpage slice of data obtains request, obtains request and sends webpage slice of data, comprising according to described webpage slice of data:

In the present embodiment, by receiving webpage slice of data, and preserving integrality and the security that effectively can ensure webpage slice of data in a database, obtaining request according to described webpage slice of data and sending webpage slice of data, effectively can improve movability, user-friendly.

Embodiment 3

As shown in Figure 3, the visual on-line customization system of one of the embodiment of the present invention, described system comprises:

Customized web page display module 301, for receiving online custom instruction, shows online customized web page;

The page cuts module 302, cutting instruction, cutting instruction cut Webpage according to the described page for receiving the page, obtains webpage section;

Data transmission blocks 303, for being sent to service end by webpage slice of data;

Data acquisition module 304, for receiving application edit instruction, connecting described service end according to described application edit instruction and obtaining webpage slice of data;

Application editor module 305, for cutting into slices according to described webpage slice of data generating web page, carry out visual edit to described webpage section, be applied the page.

Preferably, described customized web page display module comprises:

Preferably, the described page cuts module and comprises:

Preferred described area division unit comprises:

Preferably, described data transmission blocks comprises:

Preferably, described data acquisition module comprises:

Preferably, described system also comprises:

Preferably, described application editor module comprises:

Preferably, described system also comprises

As shown in Figure 4, the visual on-line customization system of one of the embodiment of the present invention, described system comprises:

Data memory module 401, for receiving webpage slice of data, is saved in database by described webpage slice of data;

Data response sending module 402, obtaining request for receiving webpage slice of data, obtaining request send webpage slice of data according to described webpage slice of data.

Preferably, described data response sending module comprises:

Embodiment 4

Preferably, the visual on-line customization system of the embodiment of the present invention, its customization framed structure can also as shown in Figure 5, and those skilled in the art can be arranged as required.

Visual on-line customization (TailorIDEPlug) system in the embodiment of the present invention can exist as the card format in browser, when visual on-line customization plug-in unit (TailorIDEPlug) starts and activate, visual on-line customization plug-in unit realizes repartitioning region to browser display area, and this system comprises following functions module and realizes following functions:

1, page setup module is tailored: realize freely tailoring of the page according to the visualized operation of user, specifically comprise:

1.1 tool bar districts arrange module: for placing sectioning OptionButton;

1.2 former page viewing areas arrange module: for showing former content of pages and the former page structure of trace analysis;

1.3 slice processing districts arrange module: the section of tailoring carried out processing, processing;

2, application management page setup module: for managing the application page, realizing application preview and application editor, specifically comprise:

2.1 application preview region arrange module: be applied in the roughly effect on mobile phone for preview;

2.2 application operating tool bars: for placing applying the action button of editing;

3, application assembling page setup module: for assembling the application page, specifically comprise:

3.1 page listings districts arrange module: for showing all pages of current application;

3.2 page editings/preview region arranges module: for showing specified page through edlin, preview;

3.3 slice list districts arrange module: for showing all sections of current account.

Preferably, the visual on-line customization system of the embodiment of the present invention, can be applied in an adaptive system based on cloud framework as a subsystem (or visual on-line customization module), described adaptive system structure as shown in Figure 9, the described adaptive system based on cloud framework is the Tailor platform cloud service in this Fig. 9, and it comprises following functions module:

TailorForwarder, VisualTailor, TailorIDE, TailorWorkspace, TailorWorkHorse, StoreWorkHorse and Service Management and operation management platform.

Wherein the function of each functional module is as follows:

TailorForwarder (Access Control module): the load balance process being responsible for HTTP, mobile terminal receive request, to the TailorWorkHorse node transmitting mobile terminal request that current loads is little, receive TailorWorkHorse node processing result, forward object information to mobile terminal.

TailorForwarder bears two functions, one is that between completing user and TailorWorkHorse (web page dynamic analysis engine), user asks the information interaction with request results, two is the pressure that the multiple web page dynamic analysis of balance is served, and realizes load balancing.

In the press process of the multiple web page dynamic analysis engine of balance, the state of all web page dynamic analysis engines in TailorForwarder meeting automatic regular polling cloud framework, judge the payload of each web page dynamic analysis engine, and new user is asked the web page dynamic analysis engine that sends to load little, thus realize load balancing.

VisualTailor (visible customization unit module): visual on-line customization adopts browser plug-in technology to realize the page business function fragment of catching visually and collecting in the page, user on a web browser visually, convenient and swift and realize former Web system intuitively the page on the restructuring of function secondary generate new Web and apply.

TailorIDE (Integrated Development module): be a JavaScript program development EclipsePlugin Integrated Development Environment built based on TailorServer and eclipse, Eclipse3.5 and above version are supported in design.TailorIDE is a Tailor engineering Integrated Development Environment, can create, manage WebApp engineering and related resource, has and supports that JS, HTML, CSS, JSON and this several mixed code carry out painted display; TailorIDE is also that WebApp engineering and TailorServer integrated debugging device can start, suspend and stop in IDE.In cloud computing environment, can test and dispose your code, it can also link telework platform.Use subject population is Tailor engineering development personnel.

TailorWorkHorse (Web page dynamic analysis engine/dynamic analysis server module): TailorWorkHorse provides Web page dynamic analysis to serve, can infinite expanding TailorWorkHorse run node form.

StoreWorkHorse (engineering memory node module): be responsible for Data distribution8 formula data storage and search, can be made up of the StoreWorkHorse memory node of infinite expanding, be responsible for storing the management information such as Tailor engineering information, Web module library and engineering authority.

TailorWorkspace (engineering space module): storage and the retrieval of being responsible for Tailor engineering.

Self-help service for user manages: user applies self-service business monitoring and the system monitoring of Tailor, and service management and system administration services.

Tailor platform cloud service framework shown in Fig. 9 is the framework meeting following ultra-large Tailor bundle of services business demand development need and design, comprise and can support corporate client service needed and public users activities of daily living needs, can run well, issue and the WebApp of management enterprise client and public users.Corporate client and public users are when utilizing Tailor platform cloud service framework to use the WebAPP of oneself, need through multiple steps such as registration, examination & approval, mandate, engineering customization, engineering preservation, engineering operation, engineering management, idiographic flow, see Figure 10, repeats herein no longer one by one.

As an other embodiment of visual on-line customization module, described VisualTailor (visual on-line customization module) adopts browser plug-in technology to realize the page business function fragment of catching visually and collecting in the page, user on a web browser visually, convenient and swift and realize former Web system intuitively the page on the restructuring of function secondary generate new Web and apply.

Whether perform script containing browser according in WEB page, WEB page can be divided into static page and dynamic page.The hyperlink network address that browser plug-in technology adopts the body matter in HTML mark recognition method reading static page and inside thereof to comprise, the browser adopting dynamic analysis technology to read in dynamic page performs script (such as JavaScript script etc.), extracted by code again and recombinate, thus the page business function fragment that realization is caught and collected in the page.

As shown in figure 11, visual on-line customization is formed primarily of TailorIDEPlug and TailorIDEService the principle of work of the visual on-line customization of VisualTailor.Mutually to be cooperated the visual on-line customization page by TailorIDEPlug and TailorIDEService.

TailorIDEPlug primary responsibility realizes realizing visually the process activities such as the cutting, process of Web section, combination.

See the visual on-line customization module of VisualTailor treatment scheme Figure 12 shown in, the workflow of this on-line customization module is specific as follows:

Step 1: input needs the original web address of tailoring in TailorIDEPlug;

TairlorWorkHorse receives the Web slice information needing to preserve, and is kept in the Web slice library in WebApp cloud memory structure.Be stored in the Web section of Web slice library, the parts that can be used as WebApp engineering carry out assembling, integrated and run, but can not separately as application accessed by the user and use by outer net.

Step 6: user can assemble the Web section set in WebApp engineering, integrated, forms the application (webpage or other) in engineering.

WebApp engineering is can directly by the application of user by extranet access.

Step 7: the WebApp engineering set is transferred TairlorWorkHorse engine by TairlorIDEService and debugs, checks WebApp engineering mobile phone terminal operational effect, if dissatisfied, can also reset by returning step 6; If be satisfied with WebApp engineering effort, perform step 8 and preserve engineering.

TailorIDE (Integrated Development module) is that the plug-in unit of an Eclipse provides Tailor engineering Integrated Development Environment completely, make the help of the Tailor resource authenticates code of standard development function, search-type, syntax and semantics, the profile of type and hierarchical structure, call chain, reconstruct is with more.

TailorIDE provides the functions such as the establishment of WebApp engineering, editor, template-setup, integrated assembling, debugging, management and deployment.

Principle process Figure 12 see TailorIDE work is known, and the workflow of described TailorIDE (Integrated Development module) is specific as follows:

Step 1: user inputs user name and logs in TailorIDE;

The engineering account that TailorIDE sends over by step 2:TailorIDEService sends to TairlorWorkSpace;

2.1 transfer the user library in WebApp cloud memory structure by TairlorWorkSpace, and the engineering resource information of user is sent to TailorIDE by TailorIDEService, for the engineering resource of user management oneself.

Step 3: user creates or edit oneself WebApp engineering in TailorIDE;

Step 4:

4.1TairlorIDEService transfers the Web template base in WebApp cloud memory structure by TairlorWorkSpace, and from Web slice library the Web slice information of calling and obtaining user oneself, for TairlorIDE Integrated Development Environment provides abundant WebUI template, and the Web section that user has stored.

4.2 users carry out code development to Web section, the page etc. in TailorIDE Integrated Development Environment, also can use the UI template configuration engineering page, after completing, check engineering page effect by engineering debug.

Step 5: the engineering page set is transferred TairlorWorkHorse engine by TairlorIDEService and debugs, checks engineering page mobile phone terminal operational effect, if dissatisfied, can also reset by returning step 4; If satisfactory project page effect, perform step 6 and preserve engineering.

Step 6: send to TairlorWorkHorse to preserve the engineering set;

6.1TairlorWorkHorse receives the engineering information needing to preserve, and is kept in the StoreWorkHorse engineering node storehouse in WebApp cloud memory structure.WebApp engineering is can directly by the application of user by extranet access.

Step 7: user can carry out the organization and administration of associated documents resource in TailorIDE Integrated Development Environment to WebApp engineering, project file version management, project plan manages, the management such as engineering control of authority management.

Step 8: information of disposing sends to TairlorWorkHorse to preserve by the WebApp engineering management set;

Information is disposed in the Web engineering management that 8.1TairlorWorkHorse receives to be needed to preserve, and is kept in the StoreWorkHorse engineering node storehouse in WebApp cloud memory structure.

The major function of TailorIDE (Integrated Development module) comprising:

There is provided engineering editor: engineering development can create, edit Tailor engineering and related resource, have and support that JS, HTML, CSS, JSON and this several mixed code carry out the editing and processing such as grammer prompting, auto-complete, highlighted, editor's error correction.

There is provided engineering template: platform business provides abundant WebUI template base, allow engineering staff according to project situation, select suitable WebUI template, generate project WebUI structural framing, allow engineering staff's fast construction play mobile Web application.

Engineering management and deployment: engineering management can complete the organization and administration of Tailor engineering associated documents resource, project file version management, enterprises engineering collaborative development can be completed, project plan works, can support and manage the engineering control of authority management of multiple enterprise, also can support that the engineering control of authority of integrator inside manages.

The debugging interface that engineering debug: TailorIDE debugs between plug-in unit and TailorWorkHorse is based upon the JSON debug communication protocol on TCP communication basis, by the Tailor engineering code that TailorIDE remote debugging TailorWorkHorse runs, remote debugging technology mode is that communication infrastructure is established in IDE platform and cloud computing.

The specific works principle of engineering debug, see Figure 13, repeats herein no longer one by one.

TailorWorkspace is responsible for storage and the retrieval of Tailor engineering, and engineering resource control of authority access.

TailorWorkspace workflow is see Figure 14, and detailed process is as follows:

TailorIDE accesses the Tailor engineering resource file in oneself extent of competence by TailorWorkspace, create and manage the Tailor engineering resource file of oneself, for TailorIDE provides abundant UI template base, editor, preservation, management and deployment engineering information.

VisualTailor visible customization accesses the resource file of oneself by TailorWorkspace, creates and processes the Web section of oneself, provide abundant UI template base for visual, and the Web section engineering information after integrated to assembling provides preservation.

TailorWorkHorse calls Tailor engineering resource file by TailorWorkspace and completes page dynamic analysis, supports WebApp user's access.

TailorWorkHorse Web dynamic analysis engine has distributed arithmetic service function, and TailorWorkHorse provides Web page dynamic analysis to serve, can infinite expanding TailorWorkHorse run node.

Processing capacity is tailored in the parsing of TailorWorkHorse Web dynamic analysis engine implementation web content, processing and polymerization, can seamlessly all kinds of enterprise operation system or internet, applications information organically be condensed together, and extends on mobile device and apply.Web dynamic analysis engine can perform original Web system and export the page self-adapted WebApp being applicable to mobile phone behaviour's built-in browser or the operation of Hybrid client according to the command request parsing in project file.

TailorWorkHorse Web dynamic analysis engine is made up of parts such as javascript resolver, CSS resolver, html resolver, Cookie & Session management, HttpFetcher.

StoreWorkHors engineering memory node has Distributed Storage and search function, user can according to whole Distributed Storage and retrieval operating load, can the StoreWorkHorse node of infinite expanding, be responsible for storing Tailor engineering information and engineering operation status information, be responsible for storing project operation information and system information, be responsible for storing engineering account and engineering resource information.

Management platform is divided into two classes: manage the operation management platform of whole platform operation and the self-help service for user management platform business of business administration oneself service operation.

Operation management platform: the whole platform operation of operation management platform management.Operation management platform is used by whole Tailor cloud platform service operator, provides the functions such as the examination & approval of user's registration information, the distribution mandate of user engineering resource information, the operation monitoring management of user engineering resource services and the personal management of operation management platform.It ensures that whole Tailor cloud platform can support the establishment, maintenance, operation, monitoring etc. of all user engineerings normally.Specifically comprise following functions module and realize following functions respectively:

Enterprise introduces examination & approval: realize the enterprise qualification examination & approval processing capacity introduced;

Business administration: business administration realizes enterprises registration, enterprise query, enterprise's modify feature;

Personal management: realize the personal management using centralized management platform;

Business monitoring: realize each business event running state monitoring;

System monitoring: realize hardware system, operating system, support platform and business platform monitoring.

Self-help service for user management platform:

Self-help service for user manages as public users, enterprise customer, engineering technical personnel provide the functions such as registration, data management, service request, user management, engineering management, business monitoring, business statistics analysis.User is sent usage platform to operation management platform created the application of WebApp engineering by registration, data management, service request.After operation management person is by examination & approval, user can obtain oneself engineering resource space, user can create in engineering resource space, edit, debug, preserve the WebAPP engineering of oneself, and just monitored by the operation of Self-Service to WebAPP engineering, business statistics analysis etc.Specifically comprise following functions module and realize following functions respectively:

User's registration management: if operation management platform does not have the materials for registration of user, just needs user in the information of centralized services management platform door registration oneself.When registered user successful time, system default generates an Administrator account, and Administrator account's information is: Administrator account: admin, Administrator account's password: 123.When user uses default admin's account number login system first time, the password of oneself to be revised after logining successfully, to protect the information security of oneself company.

User information management: user can check user basic information, user's qualification file, user's approval status and user's approval record qualification file.User can revise user basic information;

Service request: when service can be applied for after user registration success, service could be applied for after only having user registration success;

User's user management: user can manage independently oneself engineering staff's information by platform;

Engineering management: the management and the right assignment that realize engineering resource;

Business monitoring: the monitoring management realizing customer service using state;

Business statistics is analyzed: realize customer service statistical study management.

The visual on-line customization system of the embodiment of the present invention, the method for employing is visual on-line customization method, and therefore the feature of visual on-line customization system is identical with visual on-line customization method, does not repeat them here.

The above is the preferred embodiment of the present invention; it should be pointed out that for those skilled in the art, under the prerequisite not departing from principle of the present invention; can also make some improvements and modifications, these improvements and modifications also should be considered as protection scope of the present invention.

Claims

1. a visual on-line customization method, is characterized in that, described method comprises:

Receive online custom instruction, show online customized web page;

Webpage slice of data is sent to service end;

2. visual on-line customization method according to claim 1, is characterized in that, the online custom instruction of described reception, shows online customized web page, comprising:

3. visual on-line customization method according to claim 1, is characterized in that, the described on-line customization page comprises former web page editing district and section directorial area.

4. visual on-line customization method according to claim 1, is characterized in that, the described page cuts instruction and comprises: page area divides instruction, content of pages cuts instruction and page section edit instruction.

5. visual on-line customization method according to claim 4, is characterized in that, receives the page and cuts instruction, cut instruction cut Webpage according to the described page, obtains webpage section, comprising:

6. visual on-line customization method according to claim 5, it is characterized in that, receive the page and cut instruction, divide instruction according to described page area and Region dividing is cut to former webpage, cut instruction according to described content of pages, the content of pages cutting region divided is cut, obtain page section, according to described page section edit instruction, editor is carried out to described page section and obtains the section of described webpage, comprising:

7. visual on-line customization method according to claim 1, is characterized in that, described webpage slice of data is sent to service end, comprising:

8. visual on-line customization method according to claim 1, is characterized in that, described reception application edit instruction, connects described service end according to described application edit instruction and obtain webpage slice of data, comprising:

9. visual on-line customization method according to claim 1, is characterized in that, describedly connects described service end according to described application edit instruction and obtains webpage slice of data, comprising:

Receive the webpage slice of data that service end sends.

10. visual on-line customization method according to claim 1, is characterized in that, described according to described webpage slice of data generating web page section, carries out visual edit, before the page that is applied, also comprise described webpage section:

11. visual on-line customization methods according to claim 10, is characterized in that, described according to described webpage slice of data generating web page section, comprising:

12. visual on-line customization methods according to claim 1 to 11 any one, is characterized in that, described reception application edit instruction, connect before described service end obtains webpage slice of data, also comprise according to described application edit instruction:

13. 1 kinds of visual on-line customization methods, it is characterized in that, described method comprises:

14. visual on-line customization methods according to claim 13, is characterized in that, described reception webpage slice of data obtains request, obtain request and send webpage slice of data, comprising according to described webpage slice of data:

15. 1 kinds of visual on-line customization systems, it is characterized in that, described system comprises:

16. visual on-line customization systems according to claim 15, it is characterized in that, described customized web page display module comprises:

17. visual on-line customization systems according to claim 15, it is characterized in that, the described page cuts module and comprises:

18. visual on-line customization systems according to claim 15, it is characterized in that, described area division unit comprises:

19. visual on-line customization systems according to claim 15, it is characterized in that, described data transmission blocks comprises:

20. visual on-line customization systems according to claim 15, it is characterized in that, described data acquisition module comprises:

21. visual on-line customization systems according to claim 15, it is characterized in that, described data acquisition module comprises:

22. visual on-line customization systems according to claim 15, it is characterized in that, described system also comprises:

23. visual on-line customization systems according to claim 22, it is characterized in that, described application editor module comprises:

24. according to claim 15 to the visual on-line customization system described in 23 any one, and it is characterized in that, described system also comprises

25. 1 kinds of visual on-line customization systems, it is characterized in that, described system comprises:

26. visual on-line customization systems according to claim 25, is characterized in that, described data response sending module comprises:

27. 1 kinds of visual on-line customization systems, it is characterized in that, described system comprises:

Tailor page setup module: realize freely tailoring of the page according to the visualized operation of user, specifically comprise following submodule:

Tool bar district arranges module: for placing sectioning OptionButton;

Former page viewing area arranges module: for showing former content of pages and the former page structure of trace analysis;

Slice processing district arranges module: the section of tailoring carried out processing, processing;

Application management page setup module: for managing the application page, realizing application preview and application editor, specifically comprise following submodule:

Application preview region arranges module: be applied in the roughly effect on mobile phone for preview;

Application operating tool bar: for placing applying the action button of editing;

Application assembling page setup module: for assembling the application page, specifically comprise following submodule:

Page listings district arranges module: for showing all pages of current application;

Page editing/preview region arranges module: for showing specified page through edlin, preview;

Slice list district arranges module: for showing all sections of current account.

28. 1 kinds of visual on-line customization modules, it is applied in the adaptive system based on cloud framework, and described adaptive system comprises following functions module:

Access Control module Tai lorForwarder: the load balance process being responsible for HTTP, mobile terminal receive request, to the Tai lorWorkHorse node transmitting mobile terminal request that current loads is little, receive Tai lorWorkHorse node processing result, forward object information to mobile terminal;

Visible customization unit module VisualTai lor: visual on-line customization module realizes the page business function fragment of catching visually and collecting in the page, user on a web browser visually, convenient and swift and realize former Web system intuitively the page on the restructuring of function secondary generate new Web application;

Integrated Development module Tailor IDE: provide Tailor engineering Integrated Development Environment, realizes engineering and creates, manages WebApp engineering and related resource, have and support that JS, HTML, CSS, JSON and this several mixed code carry out the function of painted display; Tailor IDE also realizes WebApp engineering and the startup of Tai lorServer integrated debugging device in IDE, time-out and stopping;

Web page dynamic analysis engine/dynamic analysis server module Tai lorWorkHorse:Tai lorWorkHorse provides Web page dynamic analysis to serve, can infinite expanding Tai lorWorkHorse run node form;

Engineering space module Tai lorWorkspace: storage and the retrieval of being responsible for Tailor engineering;

29. visual on-line customization modules according to claim 28, it is characterized in that, the Tai lorForwarder in described adaptive system bears two functions:

Function one: between completing user and web page dynamic analysis service-Engine Tai lorWorkHorse, user asks the information interaction with request results;

Function two: the pressure balancing multiple web page dynamic analysis service-Engine, realizes load balancing.

30. visual on-line customization modules according to claim 29, is characterized in that, described adaptive system:

In the press process of the multiple web page dynamic analysis engine of balance, the state of all web page dynamic analysis engines in Tai lorForwarder meeting automatic regular polling cloud framework, judge the payload of each web page dynamic analysis engine, and new user is asked the web page dynamic analysis engine that sends to load little, thus realize load balancing.

31. according to described visual on-line customization module arbitrary in claim 28-30, it is characterized in that, described visual on-line customization module is formed primarily of Tai lor IDEP lug and Tai lor IDEService, mutually to be cooperated the visual on-line customization page by Tai lor IDEP lug and Tailor IDEService, wherein:

Tai lor IDEP lug primary responsibility realizes realizing visually the cutting, process of Web section, combined treatment activity;

The store and management that Tai lor IDEService primary responsibility Web cuts into slices.

32. 1 kinds of visual on-line customization methods, it is realized by the visual on-line customization module in the claims 28-31, and the method comprises the following steps:

Step 1: input needs the original web address of tailoring in Tai lor IDEP lug;

Step 2:Tai lor IDEP lug utilizes browser plug-in technology to catch visually webpage and collects the page business function fragment in the page, forms Web section one by one;

Transfer the Web template base in WebApp cloud memory structure by Tair lorWorkSpace, the Web section of extracting for Tai lor IDEP lug provides template support;

What provided by Tai lor IDEP lug integratedly arranges environment, to interested Web section by selecting Web template, arranges layout, the pattern of Web section;

Step 4: the Web set section is transferred Tair lorWorkHorse engine by Tair lor IDEService and debugs, checking Web section mobile phone terminal operational effect, if dissatisfied, can also reset by returning step 3; If be satisfied with Web dicing effect, perform step 5 and preserve section;

Step 5: send to Tair lorWorkHorse to preserve the Web set section, specifically comprise:

Tair lorWorkHorse receives the Web slice information needing to preserve, and is kept in the Web slice library in WebApp cloud memory structure; Be stored in the Web section of Web slice library, the parts that can be used as WebApp engineering carry out assembling, integrated and run, but can not separately as application accessed by the user and use by outer net;

Step 7: the WebApp engineering set is transferred Tair lorWorkHorse engine by Tair lor IDEService and debugs, checks WebApp engineering mobile phone terminal operational effect, if dissatisfied, can also reset by returning step 6; If be satisfied with WebApp engineering effort, perform step 8 and preserve engineering;

Step 8: send to Tair lorWorkHorse to preserve the WebApp engineering set; Tair lorWorkHorse receives the Web engineering information needing to preserve, and is kept in the StoreWorkHorse engineering node storehouse in WebApp cloud memory structure.