Jump to content

WebDirect and Progressive Web Apps


Recommended Posts

This might be useful for those who have users that use WebDirect on a Desktop, Tablet or Phone. Creating a Progressive Web App (PWA) provides a fully skinned app-like experience for the users.

On Windows/Mac/Linux it allows the user to create an Icon on the desktop which opens the WebDirect login page without any browser UI. On Android/iOS it creates an Icon on the home screen which launches a full screen browser.  It's really easy for the user to install themselves and no need to keep software up to date (as browsers auto-update).

Icons and colour-scheme can be customised. There are several sites on how to create a Progressive Web App, and it's still being developed by Google so there's a few funny bits/issues but mostly it works fine.

The primary issue I had was using multiple domains. For example the PWA is hosted on myapp.domain but our FileMaker Server is at fms.domain. This causes the PWA to display the location bar when redirecting to the WebDirect login. I had some issues hosting multiple PWA's on the same domain (in different folders) so this is a problem, however it can be fixed by using an iFrame on myapp.domain containing fms.domain. This does require a small reconfiguration on the FileMaker Server:

On Windows make a backup of FileMaker Server\HTTPServer\conf\web.config and change the customHeaders tags to:

        <add name="Content-Security-Policy" value="frame-ancestors 'self' https://*.[app domain];" />
          <add name="X-Frame-Options" value="ALLOW-FROM https://*.[app domain]" />
          <add name="X-XSS-Protection" value="1; mode=block" />

This works on all supported browsers and platforms apart from IE 11 (which thankfully is no longer supported anyway).

I have attached an example - please note it's only a template as it's a stripped-down version of what I use.


Progressive Web App.zip

Edited by jaboda
Bug in manifest.json in example
Link to comment
Share on other sites

  • 1 year later...

Another way of making these changes is to open IIS Manager and navigate to FMWebSite. Select HTTP Response Headers and change X-Frame-Options from ‘SAMEORIGIN’ to ‘ALLOW-FROM https://*.[app domain]’.

I prefer this method as it doesn't require a restart and feels safer than editing the config files directly. It seems the Content-Security-Policy is not required.

Link to comment
Share on other sites

  • 1 year later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Create New...

Important Information

By using this site, you agree to our Terms of Use.