Configuring Data Sources for Offline Mobile Applications
Configuring Data Sources for Offline Mobile Applications by Arjan van IJzendoorn
In Mendix 6.0.0 we released offline support for mobile as a beta feature. This is a truly unique feature: create apps that can operate without an internet connection, and work across platforms by using the simple models we know and love. You will also appreciate the speed at which these apps respond to user interaction. Offline is still a beta feature and we will keep improving it in the upcoming minor releases of Mendix 6.
In offline mode, static resources such as pages are cached on the device, so that they can be shown without an internet connection. The most challenging part of running applications offline, however, is handling the data. Data normally comes from the database in the Mendix server, or from executing a microflow, and both of these require an internet connection.
The new database data source
To solve this, we introduced a new data source for list widgets that can query a database that lives on the device itself. It is called the database data source. For existing users this may be confusing because we already had a data source by that name. That data source has been renamed to XPath because it supports advanced filtering through XPath constraints.
The database data source was originally called offline data source and was only supported in offline scenarios. Later, we realized that it could also be supported online and that, in fact, it would make a great data source to start with because of its simplicity. In an offline application, the data source gets its data from the device, in an ‘online’ application it uses the Mendix database on the server. This means you can even reuse pages between both modes!
The database data source features simple constraints that compare attributes to values. For example, only show orders with status ‘Delivered’. If you configure multiple constraints, only data that meets all the constraints will be shown, i.e. they are combined with ‘
and'. You don’t need to learn XPath to configure simple constraints anymore. Especially first-time users will appreciate this. If you need more advanced constraints and you do not need your app to run offline, you can switch to the XPath data source.
Due to the fact that the database data source may be used offline, it has some limitations. Searching is not supported yet, because the current implementation requires the Mendix database. This limitation will be lifted during the beta period. Note that searching is supported if the page is only accessible through the normal ‘online’ profiles.
Certain buttons are not supported in the control bar of a grid, based on the database data source, e.g. export to Excel. If you need this functionality (which is executed by the server), you will need to switch to the XPath data source.
For more information about supported offline features, check out the offline documentation page.
Running in Chrome
Nothing beats seeing an offline app running on a real device, and during development you want to see the effects of your changes as quickly as possible. The good news is that Google Chrome supports the offline database API that we also use on the device. This means you can run your offline app in Chrome, while data retrieval and synchronization works the same way as on the device. Static resources will still be retrieved from the server.
To make this work, you need to make a change to the web client configuration. Copy and rename the
index.html.orig file from
index-offline.html in the
theme folder, and add the text “
offline: true” to the configuration. For example:
Deploy the app and navigate to the following URL and off(line) you go:
While navigating your app, you can check the Network tab of the Developer Tools (F12) to see that only resources are requested. There are no network requests for data! On a real device, even the requests for pages will not happen because they are stored in the file system on the device.
Note: If you ever need to delete the offline database in Chrome, navigate to
chrome://settings/cookies, search for localhost, select it, click ‘MendixDatabase’ and click ‘Remove’.
We will continue working on the offline functionality to support more scenarios so that you can make your app ideas come true!