Skip to content

Connect your app to Google Maps Platform

Connect Google Maps Platform to your RShift Sites app to geocode addresses, calculate routes, search places, embed interactive maps, and pull location data like weather and air quality, using a managed connection or your own API keys.

Updated View as Markdown

Google Maps Platform is Google’s suite of location APIs and SDKs for geocoding, routing, places, and interactive maps. The Google Maps Platform connector lets your RShift Sites app call Google’s location APIs through RShift Sites’ connector gateway and render interactive maps in the browser. It’s designed for apps that need location, mapping, navigation, or place data, whether behind the scenes or on screen.

Google Maps Platform is available as an app + chat connector: one shared connection that works in the project chat while you build and in your published apps.

With Google Maps Platform, your app can:

  • Turn addresses into coordinates and coordinates into addresses
  • Calculate routes, travel times, and distance matrices
  • Search for places and businesses and show their details, hours, and ratings
  • Show interactive or embedded maps with markers and address autocomplete, or static map images
  • Validate addresses and snap GPS traces to roads
  • Look up weather, air quality, pollen, and solar data for a location
  • Use Aerial View, Geolocation, Elevation, Time Zone, Route Optimization, and Area Insights

Google Maps Platform is a good fit when your app needs Google’s map and place data, or when you want a working map in minutes with the managed connection.

Common use cases and example apps

These examples show what you can build with Google Maps Platform, each with a prompt to start from.

Example app Example prompt Description
Property listings Use Google Maps Platform and build a property listing app where people browse homes on a map, filter by neighborhood, and see commute times to a chosen address. Map-driven discovery with travel times.
The app shows listings on an interactive map, geocodes each address to place a pin, and calculates commutes with the Routes API.
Local business directory Use Google Maps Platform and build a directory where people search nearby restaurants and see details, opening hours, and ratings on a map. Place search and discovery.
The app uses address autocomplete in the search bar and the Places API to fetch details, ratings, and hours.
Delivery dispatch tool Use Google Maps Platform and build an internal tool that plans delivery routes for drivers, optimizes stop order, and shows estimated arrival times. Routing and arrival times for operations.
The app computes optimized routes with the Routes API and draws them on an embedded map.
Field service scheduling Use Google Maps Platform and build a scheduling app where dispatchers assign jobs to technicians by location and see travel times between appointments. Location-aware scheduling.
The app geocodes job addresses and uses the Routes API to compute travel times between back-to-back appointments.
Store locator Use Google Maps Platform and build a store locator that shows my retail locations on a map, with an address search and filters for services offered. Public-facing map with search.
The app captures the visitor’s address with autocomplete, centers the map on it, and shows the nearest stores.
Travel itinerary planner Use Google Maps Platform and build a trip planner where people add stops, see them on a map, and view driving distance and time between each leg. Multi-stop itineraries.
The app adds stops with autocomplete, calculates each leg with the Routes API, and draws the trip on an embedded map.

How Google Maps Platform connections work

Google Maps Platform uses two API keys because some of its APIs run on the server and others in the browser:

  • The server key is private. RShift Sites’ connector gateway uses it to call server-side APIs such as Geocoding, Routes, Places, Weather, and Air Quality. It never reaches the browser.
  • The browser key is public. Your app’s frontend uses it to load maps: the Maps JavaScript API for interactive maps, plus map embeds and static map images. The connection form marks it Public, and RShift Sites exposes it to your app’s frontend as the VITE_LOVABLE_CONNECTOR_GOOGLE_MAPS_BROWSER_KEY environment variable, so it appears in your published app’s code.

Everything except loading maps goes through the gateway with the server key, including address autocomplete and place details. The managed browser key is authorized only for the Maps JavaScript, Maps Embed, Maps Static, and Map Tiles APIs, and Step 3 restricts your own browser key the same way. Places, Geocoding, Routes, and other server-side APIs fail with REQUEST_DENIED if called from the browser.

Server-side requests through the gateway are limited to 6,000 requests per 24 hours per workspace for each connection type. A managed connection and a connection with your own credentials each get their own 6,000. Requests the browser makes to Google with the browser key do not count.

How to connect Google Maps Platform

Who can create Google Maps Platform connections depends on your plan and workspace settings. App + chat connectors are available by default on Free, Pro, and Business plans. On Enterprise plans, they are effectively disabled at first: Who can create connections and clients defaults to No one until an admin changes it in Connectors → Admin settings → App + chat connectors.

When adding a connection, you choose between two options:

  • Managed by RShift Sites: RShift Sites provides and manages the credentials for you. No registration needed, not for production. Maps do not load on custom domains.
  • Use your own credentials: connect your own server and browser API keys. Required for custom domains and for production apps.

When the connection is created, you can link it to the projects where you want to use it. Anyone building in a project can ask RShift Sites in the project chat to link their project to it.

Follow the setup steps below for the option you want.

Managed by RShift Sites

Choose this option for the fastest setup while you prototype. You don’t need a Google Cloud account or API keys.

Open Google Maps Platform in Connectors

Open Connectors and select Google Maps Platform. For the other places to open the catalog from, see Where to find connectors.

Add a connection

Click Add connection.

Name the connection

In Display name, name the connection (for example, Google Maps Platform). This name is only used inside RShift Sites to identify the connection.

Choose Managed by RShift Sites

Under Authentication, select Managed by RShift Sites. No credential fields appear for this option, and the form shows the Custom domains note.

Choose who can use this connection

Managed connections are shared with the entire workspace by default. To limit who can use the connection, click Restrict to specific people under Sharing.

See Who can use connections and clients for more information.

Connect

Click Connect.

Use your own credentials

Choose this option when your app uses a custom domain, when you go to production, or when you want to control which APIs are enabled and how each key is restricted.

You can create multiple Google Maps Platform connections using different keys, which is useful for separating environments or attaching different Google Cloud billing accounts.

Prerequisites

Before connecting Google Maps Platform with your own credentials, make sure you have:

  • A Google Cloud project with billing enabled
  • Permission to enable APIs and create API keys in that project
  • Your app’s domains: its *.lovable.app URL and any custom domains
  • Permission to create connections in your RShift Sites workspace (see Who can create connections and clients)

Step 1: Enable the APIs you need

Google Maps Platform bills per API, so enable only the ones your app uses. In the Google Cloud console, open APIs & Services for your project.

For the browser key, enable the APIs your app loads in the browser:

  • Maps JavaScript API
  • Maps Embed API, if your app embeds maps
  • Maps Static API, if your app shows static map images

For the server key, enable the APIs your app calls through RShift Sites’ gateway. The connector routes all of these:

  • Geocoding API
  • Routes API
  • Places API (New)
  • Address Validation API
  • Aerial View API
  • Air Quality API
  • Geolocation API
  • Maps Elevation API
  • Maps Platform Datasets API
  • Places Aggregate API (Area Insights)
  • Pollen API
  • Roads API
  • Route Optimization API
  • Solar API
  • Street View Static API
  • Time Zone API
  • Weather API

Step 2: Create the server API key

The server key is used by RShift Sites’ connector gateway, so restrict it by API. Allowing only the APIs your app calls limits the impact if the key is ever leaked. Do not add a website restriction: gateway requests carry no referrer, so a referrer-restricted key rejects every server call.

Open credentials

Open the Credentials page in the Google Cloud console and select your project.

Create the key

Click Create credentials → API key.

Name the key

Give it a descriptive name, for example RShift Sites Google Maps Platform server key.

Edit the key

Click Edit API key.

Restrict by API

Under API restrictions, select Restrict key and choose only the server-side APIs from Step 1 that your app uses.

Set the application restriction

Under Application restrictions, leave None selected, or select IP addresses and add RShift Sites’ gateway ranges from IP allowlisting. Never select Websites for this key.

Save and copy

Save and copy the key. It starts with AIza and is 39 characters long.

Step 3: Create the browser API key

The browser key is public by design and appears in your app’s frontend code. Its website restriction is what prevents other sites from reusing it.

Create the key

On the same Credentials page, click Create credentials → API key.

Name the key

Give it a descriptive name, for example RShift Sites Google Maps Platform browser key.

Edit the key

Click Edit API key.

Restrict by website

Under Application restrictions, select Websites and add every domain your app is served on, for example https://your-project.lovable.app/*, plus https://yourdomain.com/* and https://www.yourdomain.com/* for a custom domain.

Restrict by API

Under API restrictions, select Restrict key and choose Maps JavaScript API, plus Maps Embed API and Maps Static API if you enabled them in Step 1. Leave Places, Geocoding, Routes, and other server-side APIs off this key. RShift Sites calls them through the gateway with the server key.

Save and copy

Save and copy the key. It starts with AIza and is 39 characters long.

See Google’s documentation for more: API security best practices.

Step 4: Connect Google Maps Platform to RShift Sites

You can create multiple connections using different keys.

Open Google Maps Platform in Connectors

Open Connectors and select Google Maps Platform. For the other places to open the catalog from, see Where to find connectors.

Add a connection

Click Add connection.

Name the connection

In Display name, name the connection (for example, Google Maps Platform Prod). This name is only used inside RShift Sites to identify the connection.

Choose your own credentials

Under Authentication, select Use your own credentials. The form shows a short reminder to use two keys.

Add the server key

Paste the key from Step 2 into Server API Key. Create key next to the field opens the Google Cloud Credentials page.

Add the browser key

Paste the key from Step 3 into Browser API Key. The field is marked Public because the value appears in your published app.

Choose who can use this connection

Under Sharing, the connection is private to you by default and shows a Private label. To share it, click Share with others. Then add workspace members by email, or click Invite entire workspace to make the connection available to everyone in your RShift Sites workspace.

See Who can use connections and clients for more information.

Connect

Click Connect. RShift Sites checks that each key has the right format but does not call Google to test it, because key restrictions would make the test fail. After connecting, ask RShift Sites for one map and one address lookup to confirm both keys work.

When connected, anyone building in a project can ask RShift Sites in the project chat to link their project to Google Maps Platform (based on configured connection-level access). Your RShift Sites apps can then geocode, route, search places, and show maps with Google Maps Platform.

Limitations

The Google Maps Platform connector cannot:

  • Load maps on a custom domain with the managed connection. The managed browser key is restricted to RShift Sites’ domains.
  • Exceed 6,000 server-side gateway requests per 24 hours per workspace for each connection type.
  • Call the legacy Directions, Distance Matrix, or original Places APIs. Google has deprecated them, and the gateway rejects those paths.
  • Support per-end-user Google login. Each connection represents a single set of keys shared across all projects linked to it.
  • Work from territories where Google prohibits Maps Platform: China, Cuba, Iran, North Korea, Syria, Vietnam, and Crimea and the other occupied regions of Ukraine. RShift Sites blocks connecting and gateway requests from those locations and points to Google’s list.

Troubleshooting

If maps or location requests fail, the sections below cover the most common errors and how to resolve them.

Maps do not load and the browser console shows "RefererNotAllowedMapError"

The browser key’s website restrictions do not include the domain the app is served on. Add the exact origin, including protocol and subdomain, on the Google Cloud Credentials page. With a managed connection on a custom domain, this is expected: switch to your own credentials.

Server-side requests fail with 403 "API_KEY_HTTP_REFERRER_BLOCKED"

The server key has a website restriction. Gateway requests carry no referrer, so every call is blocked. Edit the key in Google Cloud and set Application restrictions to None or IP addresses with RShift Sites’ gateway ranges.

Server-side requests fail with "REQUEST_DENIED" or 403 "API_KEY_SERVICE_BLOCKED"

Either the API is not enabled in your Google Cloud project, or the server key’s API restrictions do not include it. Check both in the Google Cloud console.

Geocoding or routing fails when called from the browser

The browser key is authorized only for loading maps. Ask RShift Sites to move geocoding, routing, and other server-side calls to the backend so they go through the gateway with the server key.

Autocomplete, place details, or map pin clicks stop working while the map still loads

The app calls the Places API from the browser with the managed browser key. Since September 10, 2026, that key no longer authorizes Places API calls, so apps built earlier that used browser autocomplete or place details fail on those features without any change to the app. Reconnecting the connection or changing referrer settings does not restore access. Ask RShift Sites to move autocomplete, place search, and place details to the backend so they go through the gateway with the server key.

Server-side requests fail with 429 "Too Many Requests"

The workspace has used its 6,000 gateway requests for the day on that connection type. The response includes a Retry-After header. Ask RShift Sites to cache repeated lookups, debounce autocomplete, reduce call volume, and keep map loads on the browser key, which does not count toward the limit. A connection of the other type has its own separate 6,000.

Manage your {connector_0} connection

Connections are managed from Connectors: select {connector_0}, then open the connection.

  • Unlink projects to remove {connector_0} access from specific projects while keeping the connection available for others. See Unlink projects from a connection for the steps.
  • Delete the connection to remove it from the workspace entirely. Deleting is permanent. It removes the credentials from all linked projects, and app features that use {connector_0} stop working until a new connection is added. See Delete a connection for the steps and who can delete.
Navigation

Search for a question, a feature, or a task.

↑↓ to navigate↵ to openEsc to close