Skip to main content
Connecting Google Maps
Dave Quested avatar
Written by Dave Quested
Updated over a month ago

Google Maps is a web mapping service developed by Google.

Why connect my Google Maps account to Airsquare?

By connecting Google Maps:

  • You can use our Google map widget, this won't work unless you have Google Maps connected.

  • You can use our Google multiple-location map widget, this won't work unless you have Google Maps connected.

  • We show maps elsewhere on your website (e.g. event pages, organisation directory pages).

  • We show a "find address" box for shipping / billing addresses in the checkout, allowing customers to quickly find their address and reduce the amount of typing required.

  • We show maps on your ticket PDFs.

  • We show a map on 'order shipped' emails which get sent to your customers.

  • You can use delivery distance/duration based shipping rates.

  • We show a 'find address' box on the shipping modal in the POS so you can quickly find addresses.

Will I be charged to use Google Maps?

Google offer a substantial free tier.

They also give you a substantial lump sum to start with.

Unless you have a very large amount of traffic it's unlikely you'd go over this free tier.

How do I connect Google Maps to Airsquare?

Google have made this unnecessarily complex. This is primarily due to how they bill for their service and the need to protect your API keys from being abused by bad actors.

With this in mind, we need 3 API keys and 1 URL signing secret. This protects you from bad actors using your API keys on their own sites and racking up a large bill for you to pay.

Here's what you need to do:

Step 1: Setup a Google Cloud account and project

If you don't have a Google Cloud account or project you'll need to set that up first. This link sets that up for you:

Step 2: Setup account information / payment profile

You'll be asked to provide your account information and payment information. This is required for billing should you go over their generous free tier.

Once you've done all that, it'll ask you some annoying questions about your industry and services. Just swat your way through that.

It'll automatically create your first API key for you. Just click 'Go to Google Maps Platform'. Click 'Maybe later' when it asks you to protect your key. We'll do that below.

Ok finally you should be actually in the console.

Step 3: Create your API keys

  1. Delete the 'Maps Platform API Key' they've automatically created for you, it won't be setup right.

  2. Add 3 x API Keys by clicking 'Create Credentials > API Key' at the top.

  3. Repeat 3 times. You'll end up with 3 x API keys, called 'API key 1', 'API key 2' and 'API Key 3'.

Step 4: Setup your 'Public API Key'

  1. Click on 'API Key 1' to edit it.

  2. Rename it to 'Airsquare > Google Maps Public API Key'.

  3. Under Set an application restriction choose Websites.

  4. Add the following Website restrictions:

    1. *.airsquare.com/*

    2. *.yourwebsite.com/* (replace yourwebsite.com with your domain name!)

  5. Under API restrictions, restrict the key to the following APIs:

    1. Maps Javascript API

    2. Geocoding API

    3. Places API

  6. Click Save.

It should look like this:

Step 5: Setup your 'Private API key'

  1. Click on 'API Key 2' to edit it.

  2. Rename it to 'Airsquare > Google Maps Private API Key'.

  3. Under API restrictions, restrict the key to the following APIs:

    1. Maps Javascript API

    2. Geocoding API

    3. Places API

    4. Distance Matrix API

  4. Click Save.

It should look like this:

Step 7: Setup your 'Private API key'

  1. Click on 'API Key 3' to edit it.

  2. Rename it to 'Airsquare > Google Maps Static API Key'.

  3. Under API restrictions, restrict the key to the following APIs:

    1. Maps Static API

  4. Click Save.

It should look like this:

Step 8: Limit unsigned requests

To ensure that your Static API key only accepts signed requests:

  1. Go to the Google Maps Platform Quotas page in the Cloud Console.

  2. Click the project drop-down and select the same project you used when you created the API key for your application or site.

  3. Select the Maps Static API from the APIs drop-down.

  4. Expand the Unsigned requests section.

  5. In the Quota Name table, click the edit button next to the quota you want to edit. For example, Unsigned requests per day.

  6. Update Quota limit in the Edit Quota Limit pane.

  7. Select Save.

Step 9: Connect Google Maps to Airsquare

  1. In another window/tab, fire up Airsquare admin and go to Account > Connected Apps.

  2. Click Connect next to Google Maps.

  3. You then need to plug in all the API keys you've created. You can copy each one from your Google Cloud console. Best to have both windows open and copy it across.

  4. What about the URL signing secret?! You can find that on your Google Maps credentials page (https://console.cloud.google.com/google/maps-apis/credentials)

  5. Click Connect.

Did this answer your question?