WebDirect and the Back button
WebDirect and the Back button
4 September 2020 - Author : - Categories : Blog, FileMaker, Technique - Tag : , ,

WebDirect and the Back button

No way back

WebDirect was introduced as component of FileMaker Server 13 and has evolved regularly since then.

It makes your FileMaker custom applications available in the browser and available through the Internet, Claris making sure that the user experience is as close as possible from FileMaker Pro’s.

This has proven very useful in corporate companies where installing a software like FileMaker Pro on desktop computers isn’t trivial.

Web Direct is a good option if you need to expose your app to external users or to build a customer portal for instance.

WebDirect requires FileMaker Server

The “back button” issue

An often heard complaint though is that users are disconnected when they click the Back button of their browser. This button is confusing because it’s very similar and at the same top left corner than FileMaker Pro record navigation widget.

Our work-around

Here is our solution, freely downloadable and usable. It’s a single HTML file.

This HTML file disables the back button if a user connects to a custom app using the file URL.

Using the back button will result in a message telling the user he can’t use that button.

To install, simply download the file and place it in this directory of your FileMaker Server machine

  • On Windows : FileMaker Server\HTTPServer\conf\
  • On the mac : FileMaker Server/HTTPServer/htdocs/

Repertoire de destination du fichier html

Next edit the HTML with a simple text editor and modify the “solution” variable to indicate your FileMaker file name.

Fichier html destiné à l'ouverture de la solution en Webdirect

 

Usually, a user uses this kind of URL to connect to his custom app:

  • https://<server>/fmi/webd/<filename>

With this solution he should rather use:

  • https://<server>/<htmlfilename>.html

In our example this would be: https://1mt_server/1mt_Tasks.html

NB : If you’re using this solution with a http connection instead of https, don’t forget to edit the uri, variable in the HTML file (change https into http).

Download the file here: Zip-file-iconWebDirect_Wrapper.zip

Do not hesitate to share this blog post!

 

Prev / Next Post
Comments (25)
  • Davide Puppo - 5 September 2020 - Reply

    It’s Wonderful!!!
    Gorgeous!!!

    Thank You Fabrice…
    It’s also simple customize the alert dialog with the proper localization…

    The question is: Why Filemaker didn’t to it before?

    • Fabrice Nordmann - 7 September 2020 - Reply

      Ciao Davide,
      I take all compliments but this is a Romain Dunand and Ceydrick Valentini finding 🙂

  • Josh Willing - 7 September 2020 - Reply

    Can you think of any potential problems caused by wrapping WebDirect in an iframe. E.g. perhaps if your app has a webviewer that uses iframes etc.?

    • Fabrice Nordmann - 10 September 2020 - Reply

      Hello,
      thank your for your question,
      You’re correct, when the web viewer is set as interactive, the browser back button interacts directly with the web viewer! Under this condition, if your web viewer has a navigation history and you change layout, the wrapper will no longer have any effect on the back button. But in all other cases the wrapper works perfectly.
      So to sum up, here are the steps to reproduce the issue:
      – load a layout with an interactive web viewer
      – load another page in the web viewer by following a hyperlink
      – change layout
      – click the back button
      –> disconnection

  • Jörg Köster - 11 September 2020 - Reply

    GREAT!
    Thank you so much for sharing!

  • Francesco Cucinotta - 26 January 2021 - Reply

    I get Database not available 🙁

    • Romain Dunand - 27 January 2021 - Reply

      Hi,

      Is your database available with legacy webdirect url ?
      Also, does your filename includes special chars (accents, spaces, hashtag, slash…) ?
      If so, please consider encode the filename at line 13, ie :
      let solution = encodeURIComponent('my file with special chars &$/')

  • Francesco Cucinotta - 28 January 2021 - Reply

    Hi thanks for answering.
    No it doesn’t have any special characters, the only thing no requires login my application. I tried to make the change you suggested, but nothing, always the same error 🙁 do you have any other ideas?

  • Angus Milner-Brown - 5 March 2021 - Reply

    Fantastic simple solution. A life saver and from an HTML noob like me, thankfully easy to integrate

  • David - 17 March 2021 - Reply

    If I have two solutions, how do I specify more than one solution in the file, or what do I do?

    • Romain Dunand - 17 March 2021 - Reply

      Just add another html file for your other solutions, you can have as many wrapper as you want : ie solution_A.html, solution_B.html..

  • Tatvam - 21 August 2021 - Reply

    Thanks for sharing the knowledge!
    I also want to warn user if he/she reloads the browser page / hit the reload button.
    Kindly share the solution if possible!
    Thanks in advance!

  • giulio villani - 27 September 2021 - Reply

    It’s great!
    Just a single warning: It doesn’t work if the file is hidden (the file need to be shown on the host to work).

    .g.

    • Romain Dunand - 27 September 2021 - Reply

      Hi Giulio

      Thanks for your feedback.
      We couldn’t reproduce the issue you described. The “hidden” option seems to have no side effect over this method (We tried both the Web Direct and the file sharing “hide” options).

      Which version of FileMaker server are you using ?

  • giulio villani - 27 September 2021 - Reply

    Bonjour, Romain.

    FMS 19.3
    Windows Server 2019
    SSL on (GoDaddy)

    IN my experience with file sharing option “hidden” selected, the result is a warning “Database not available” [the translation could be inaccurate, the server is in italian and right now I’ve not the time to test on a english server), while with the file shown oh the host the procedure works flawlessly.
    🙂

  • joost kingma - 3 November 2021 - Reply

    Yuo can add the homeurl option in the html file if you do not want to open the default webdirect page after logging out. Only limitation I see is that it stills hows the original url in the address bar.

  • Jonathan Marcus - 28 January 2022 - Reply

    im also getting an error: The requested URL was not found on this server. The link on the “>referring page seems to be wrong or outdated. Please inform the author of “>that page about the error. If you entered the URL manually please check your spelling and try again.
    There are no special characters in the name.

    • Romain Dunand - 28 January 2022 - Reply

      Is your server a Mac/Linux or Windows ?

      If your are on mac/linux and have a SSL Cert install, the html file should be placed in the httpsRoot subfolder of the htdocs folder to be available

  • Jonathan Marcus - 28 January 2022 - Reply

    Thank you that fixed it. But how do I get the message to appear in English?

  • Faber - 30 January 2022 - Reply

    Hi Ceydrick,
    what if we want to lock the mobile screen rotation in webdirect?
    Always vertical for iPhone and orizzontal for iPad (I use two different layout).
    We could inject some javascript in the html page?
    Thank you!

    • Romain Dunand - 2 February 2022 - Reply

      It should be possible using CSS media queries or custom JS code to rotate the iframe depending on screen orientation as described here : https://stackoverflow.com/a/14360699/5242696
      You can add anything you want in the html page to fit your needs

  • Jonathan Marcus - 11 February 2022 - Reply

    I noticed that this seems to interfere with the ability to access a file using a browser on iOS device. Is there a work around for this?

    • Romain Dunand - 14 February 2022 - Reply

      Do you mean a FileMaker file over webdirect or some “containers” ?
      We didn’t notice any issue with this technic on iOS

  • Timu - 10 October 2023 - Reply

    Hi, i am struggeling around by the same issue. I would be very happy if i could have this demofile. Unfortunately the downloadable file is emtpy when i open it with textedit. what am i doing wrong? Thank you for advide

    • Fabrice - 10 October 2023 - Reply

      Hi!
      TextEdit tries to render html files, and indeed there isn’t much to display here.
      Try a different text editor, or change the file extension to .txt

Add comment

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.