Ever wish there was a way to ‘Send to FileMaker’ from your Web Browser?


Turns out there is a fairly easy way to do this. It involves creating a bookmark in your web browser that is written in Javascript. It calls a FileMaker script using the URL scheme ‘FMP’ and sends the web page title, and the page’s URL to FileMaker. Once you have this in FileMaker, you can use a callback script to get more information from the web page using standard screen scraping techniques to parse out things you are looking for.

I’ve long wished the FileMaker would add a system extension that would allow us to ‘Send to FileMaker’ from most Mac or iOS apps. Since it doesn’t seem to be forthcoming, I have been working on a method that at least works from a web browser, on a Mac (and presumably Windows,  though that remains untested) or an iPhone or iPad.

I started hacking around in Javascript to see if I could make this happen, remembering the idea of a ‘Bookmarklet‘ — a little app that runs some Javascript from a bookmark. I was able to get the page URL ( document.location.href) and Title (document.title) to work reliably. I tried adding the description (document.description), but if this item was not in the web page source, it would kill the bookmarklet. Nothing would happen.

Then I hit on the idea of just sending the most basic info, the title and url, something that almost every web page has and then using a callback to go and get other stuff. That way, I could do most of my programming in FileMaker, a world that I understand, rather than in Javascript a world in which I am easily lost.

My example file is a database to get information from Craigslist, specifically about cars for sale. The idea here is to adapt this to a specific use you may have for collecting information from the web. You could use it to simply collect blog posts about FileMaker or record politician’s tweets, etc.

A great thing about this technique is that it works both on Mac/Windows FileMaker, but also in FileMaker Go on an iPad or iPhone.

Inspiration – Send to Notes

In most Mac apps, there is a small icon called the ‘Actions’ menu. Clicking on it allows you to perform some action on the current document. One of my favorites is ‘Send to Notes’. Using this action on a web page in Safari, will send the URL, and often a preview of the title and text of the page. I wanted the ability to send to FileMaker in the same way.
actions-menu
 

Send to Notes

Notice that whatever is happening in the background, Safari is able to get

  • the title,
  • the URL,
  • the description and
  • a small thumbnail image

all from the web page. This Javascript Bookmarklet technique allows us to get most of this information in a semi-automated way.

 

Bookmarklet Javascript

Here is the Javascript to enter or paste in. Edit the values for ‘DatabaseName‘, ‘ScriptName‘ to match the script within your FileMaker database.

javascript:location.href=’FMP://DatabaseName.fmp12?script=ScriptName&param=’+document.location.href+’|’+document.title

To find out more about the uses of the FMP URL scheme, go here.

 

Add a Bookmark to your web browser

Create a new Bookmark in your web browser, or if there is no way to add a blank Bookmark, duplicate and edit an existing bookmark.

Call it something meaningful, such as ‘Send to FileMaker’, or make it more specific to your own application. You can have as many of these bookmarklets as you like, one for each particular database you are adding links to.

Paste in the Javascript from the previous step. Be sure you edit the database name and script name to match up with your database.

 

FileMaker Processing

In FileMaker, create a script that goes to the correct layout, creates a new record and then sets the appropriate fields with the the inbound script variables, Title and URL. At the end of the script, I am running the callback script to get more information from the web page.

 

Callback script in FileMaker to get more ‘stuff’ from the web page

To get more information items from a web page, you can now script FileMaker to Insert from URL the contents of the web page. Because you are getting the source of the web page, you can parse through and grab bits of data, as long as they follow a pattern that you can figure out. In my file, I am using a Custom Function called Extract, which lets me easily grab the text between specific text blocks.

One more setup item, if you are running FileMaker 16 or greater, be sure to allow fmurlscript access to your database. Go to Manage Security, Extended Privileges and fmurlscript and turn on access for whichever accounts you want to be able to run these remote called scripts.

fmpurlscript

 

 

In your web browser, go to Craigslist and search on a vehicle

When you have located one you want to add to your database, click the Bookmark you have created.

 

Click ‘Allow’ to allow the ‘fmp’ url to run.

This will call FileMaker using the FMP URL scheme and add the record, sending the URL and title of the record over to FileMaker.

 

In FileMaker the script runs, adding the new vehicle

FileMaker received the script call, ran the script, which created the new record, added the Title and URL and then ran a callback script to get more information using the Insert from URL script step.

 

Drag and Drop an image

Sometimes the Javascript on a web page is designed to prevent you just Dragging and Dropping an image out of the webpage, so there is a trick needed to get the image into a FileMaker field. To solve this issue, try something like this:

 

Script to grab the image

If the pattern count for what’s in the container field contains “.jpg”, then insert the image by using Insert from URL.

 

Summary

 

That’s it, a simple Javascript Bookmark to call a FileMaker database using the FMP URL scheme, adds a new record from a web page, setting the URL and Title fields and callback the page source to grab other bits of information to paste into FileMaker fields. Hope this is useful to someone out there.

Troubleshooting (update 2019-08-13)

If you get this error:

fm-error

Double check that the FileMaker database name matches the name in your Javascript.

For example, in this case, it should be:

javascript:location.href=’FMP://Which Vehicle.fmp12?script=ImportNewURL&param=’+document.location.href+’|’+document.title

 

Note that when you download the file from AWS, from the download link, it may have changed the file name to ‘Which+Vehicle.fmp12’, rather than ‘Which Vehicle.fmp12’. You can either change the file name, or change the text in the Javascript bookmarklet. They just have to match up.

 

 

Comments are closed.