Dojo Offline technology applications: Web Editors that support offline functionality

Overview

With the Dojo offline feature, you can save page content and its associated pictures, CSS, and JavaScript resources while the page is loaded, so that even when we are offline we can continue to manipulate the page, and the contents of the operation can be faithfully stored locally, and automatically synchronizes to the service side when the connection to the server is restored. Using the Dojo offline feature, you can effectively improve the reliability of user access and enhance the user experience.

In the article "Using Dojo to develop offline application", we introduce the basic function, realization principle and programming mode of Dojo off-line function, in this article, I will give a complete example to readers how to apply Dojo off-line technology to practice. The example that runs through the text is an online Web editor. In this example, we will complete: how to introduce an offline editing capability for an existing online Web editor, as well as how to write the appropriate server-side code to accept and synchronize edits from the client. By reading this article, readers will be able to understand the full process of using the Dojo offline library, as well as some details and considerations in the use process.

Moxie Offline Editor

Moxie is a more complete dojo offline application that includes server-side and client implementation, with a single feature, clear program structure and concise code, and is a good example of the Dojo offline sample application, from which we can systematically learn how to use the Dojo Offline library for page caching and handling of various events.

In the process of using an online editor, we often encounter situations in which the session expires due to too long editing time, or if the network connection is disconnected and the edited content is not saved. A more common solution is to set a long session expiration on the server side or to automatically submit the contents of the editor at regular intervals (within the session expiration time) of the client. Too long session expiration can lead to security issues, while client-side retention can lead to unnecessary network traffic, increasing server pressure, especially when the content of the edit is large. The emergence of the Dojo Offline Library provides a new solution to this problem, whether it is session expiration or network interruption, we can save the edited content on the client, and then synchronize the contents of the client temporarily to the server when the server connection is restored.

The main function of Moxie application is to provide a browser-based text editor, we can take a name for the contents of the current edit, and then submit it to the server in the form of < filename, file content > key value pair. The client can also load the server-side list of saved files and edit them by selecting the filename to load the corresponding file contents. With the Dojo offline library, we can edit the contents of the file locally, even offline, or save the edited content locally, and then synchronize it when the connection to the server is restored.

The implementation of this application is divided into server-side and client two parts, server-side is the WEB application implemented by Java language, receive request through servlet, realize the function of saving or reading the content of the file. The client uses the Dojo offline library and a text editor to implement the function of the file Off-line editor. Because the server-side implementation is specific to the application requirements, does not have universal significance, and the server-side function is relatively simple, so this article only outlines the server side of the function and design, does not involve specific coding details, interested readers can refer to its source code.

How to Run

We can download the Dojo Offline Demo via HTTP, or through SVN downloads, see Get Dojo Source code. If you do not want to download the source code, you can view its content through the web-based track tool provided by Dojo. As we can see, it contains the client code based on the Dojo Offline, and the Java code that completes the server-side response. To complete the server-side response, a lightweight Web server--jetty is included in the ZIP package, as well as a lightweight database--derby. Our server-side code body is a Servlet that is responsible for receiving HTTP requests from the client and corresponding access to the database for the requested type.

Before you start running the program, make sure that the JDK we use must be above 1.5 and 1.5.

Running a server-side program is simple. Just navigate to the root of the online editor at the command line, and then enter the following command:

Java-jar Editor.jar

The Jetty server will then start, including the Derby database, with no additional configuration, just until the server is started, open the browser and enter:

Http://localhost:8000/demos/offline/editor/editor.html

That way, you'll be able to access the online editor.