Image for post
Image for post

Capturing GoogleMap Coordinates in FileMaker WebDirect

Sounds Essential
Nov 17, 2016 · 8 min read

We have previously examined techniques to capture the coordinates from a Google map and place these into a record in FileMaker. This is certainly a great way to have your users interact with maps, as long as they are using the FileMaker Pro client. If the solution deploys FileMaker WebDirect, the technique does not work. But we have a way that does and after a number of enquiries about how we did it, we’re finally getting around to documenting this and sharing with others…

The Problem

The issue we’re up against is that previous techniques use the FMP URL protocol to make calls back to the database. WebDirect does not support this. So we need to find a way of displaying a Google map in WebDirect, allow a user to click on the map and then capture those coordinates in a FileMaker record.

It’s worth pointing out that our solution to this is not simple but we’ll step through it bit by bit. Also, due to the nature of the solution, it’s not possible to post a working demo, but we will post the code and details necessary for any reader to use. Of course, there may be other ways of achieving our goal, but this is how we went about it.

Requirements

In order to implement this technique, you will need the following:

Integration Concepts

The basic concepts of what we will be doing are:

Let’s get started!

Assumptions

For the rest of this article, we will need to assume some conditions and use them ongoing in our example. You can replace these values with your own during implementation:

Create the Map PHP Page

So, we need to make a PHP page that will be hosted on our web server/website. This PHP page will show the map to our user in WebDirect via a web viewer and handle the click the user performs to select the required coordinates. This is not hugely different from the code we used in our previous posts. We still use the basic concepts of the Google Maps API to load the map but there’s a couple of differences:

You can download this code here. It is well commented and may not need much adjustment if the rest of the below is followed, but we recommend you read it anyway to see what each section does. The file is named map.php.

In addition, it’s worth pointing out that if your FileMaker Server is protected using a SSL certificate (and your FileMaker Server isprotected with a SSL certificate, right?), then wherever you end up hosting these PHP files, they should also be protected with SSL or your users will see warning errors when the SSL and non-SSL content tries to load in their browser.

Create the FileMaker Script PHP Page

When the user clicks, the Google Maps JavaScript handles the dropping of the pin on the map, but we need to call the script to run. This is done with a second PHP file that contains the database name, address etc and the script we are calling, the layout we’re using, and parameters to send in. This is not complex, but it does need adjusting to have the right details for your environment.

You can download this code here. The file is named fmperformscript.php.

Upload Files to the Web Server

Now that we have our PHP page for displaying the map, and our PHP page to call our script, let’s get these uploaded to our web server. Create a new folder on the root called _filemaker. Upload map.php and fmperformscript.php to this folder. This assumes that our path to display the map in our web viewer will be https://www.xyz.com/_filemaker/map.php.

That’s great, but we’re not done. We need to upload the FileMaker PHP API to the same folder. You can find this on the installation of FileMaker Server in the following locations:
Windows: \Program Files\FileMaker\FileMaker Server\Web Publishing\FM_API_for_PHP_Standalone.zip
Mac:
/Library/FileMaker Server/Web Publishing/FM_API_for_PHP_Standalone.zip
Uncompress this file and upload the resulting FileMaker folder and FileMaker.php file to the same folder as above.

So, after all that you should have the following listed in the _filemaker folder on the web server:

Set Up the Web Viewer

Now that we have the file on the web server that will display the map for our users, we need to point the web viewer to this file. Open the calculation dialog for the web viewer on your WebDirect layout and put this in there (replacing attributes as needed for your environment of course):
“https://www.xyz.com/_filemaker/map.php?id=" & ADD_Addresses::ID & “&secretKey=123456&city=” & ADD_Addresses::City & “&country=” & ADD_Addresses::Country

So, with this we are pointing to the map.php file and sending in the record ID, secret key (which you will change!), and the city and country to center the map on.

Set Up FileMaker Server

There’s not much to do here, but you do need to ensure that PHP Publishing is enabled. Log into your admin console, select the Web Publishing menu on the left, then the PHP tab on the top menu and check the Enable PHP Publishing box. If you’re using a hosting provider, it’s likely that this is switched on already.

Set Up Your User in the FileMaker File

Recall that we set up a user and password in the fmperformscript.php file? We need to make sure we have that user set up correctly. In the FileMaker file, open the Security dialog and ensure you have a user with the same username as entered in the PHP file, set the password as per the PHP file (you’re changing this password from the demo one here, right?), and ensure the privilege set the user is assigned has the Access via PHP Web Publishing option enabled. We highly recommend that the privilege set you set up for this user be as locked down as possible. Absolutely do not use the Full Access privilege set. Restrict the privilege set to the layout, script and tables/fields that it needs access to in order to perform its function and nothing else.

Set Up the Script to Set the Coordinates

When the script, named SetCoordinates, is called via fmperformscript.php, there are four variables that are passed in the parameter, separated by | characters. These values are:

You can parse these out however you wish. The below is one idea and deliberately not optimized to keep it simpler. But the general idea is parse out these parameters, exit if the secret key is not correct, otherwise find the record we need to adjust and set the latitude and longitude fields.

Set Variable [ $SP; Value:Get ( ScriptParameter ) ]
# Test if secret key passed is correct. Exit if not.
If [ GetValue ( Substitute ( $SP ; “|” ; ¶ ) ; 4 ) ≠ “123456” ]
Exit Script [ ]
End If
# Go to Addresses layout and perform find for record in question — ID passed in script parameter
Go to Layout [ “ADD.Addresses” (ADD_Addresses) ]
Enter Find Mode [ ]
Set Field [ ADD_Addresses::ID ; GetValue ( Substitute ( $SP ; “|” ; ¶ ) ; 3 ) ]
Perform Find [ ]
# Set coordinate fields with values passed in script parameter
Set Field [ ADD_Addresses::Latitude ; GetValue ( Substitute ( $SP ; “|” ; ¶ ) ; 1 ) ]
Set Field [ ADD_Addresses::Longitude ; GetValue( Substitute ( $SP ; “|” ; ¶ ) ; 2 ) ]
Commit Records/Requests [ Skip data entry validation; No dialog ]

Decide how you wish to handle the parameters, and ensure this script is set up in your database, named correctly, and check that the user you set up above has the rights to execute this script.

Conclusion

We started out this post saying this is not a simple task. As the above demonstrates, it’s not, but it is a foot in the door of Custom Web Publishing and what can be done with the PHP API.

You can download the PHP files for this solution here.

This article originally appeared on soundsessential.com

FileMaker

We moved to @Claris (formerly FileMaker Inc.,

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store