Google Meet

Open console.cloud.google.com and create a new project (or select an existing one). In the left sidebar, navigate to 'APIs & Services' → 'Library.' Search for 'Google Calendar API' and click 'Enable.' Once enabled, go to 'APIs & Services' → 'Credentials.' Click 'Create credentials' → 'OAuth client ID.' If prompted to configure the consent screen first, click 'Configure consent screen.' On the consent screen: - Choose 'External' unless all users are in your Google Workspace org - Fill in the app name, support email, and developer contact email - On the 'Scopes' step, click 'Add or remove scopes' and add `https://www.googleapis.com/auth/calendar.events` (for read/write access to events) — search for it in the filter box - Add test users during development (your own Google account at minimum) - Complete the consent screen setup and return to 'Create credentials' Back on 'Create credentials → OAuth client ID,' select 'Web application.' Add your Bubble app's redirect URI in the 'Authorized redirect URIs' field. Bubble's OAuth2 redirect URI format is: `https://bubble.io/oauth_callback` for Bubble-hosted apps, or your custom domain equivalent — check Bubble's documentation for the exact URL format in your API Connector settings. Copy the Client ID and Client Secret when they appear.

1// Required OAuth scope:
2https://www.googleapis.com/auth/calendar.events
3
4// Authorized redirect URI for Bubble (add in Google Cloud Console):
5https://bubble.io/oauth_callback
6// OR your custom domain:
7https://yourdomain.com/oauth_callback

In your Bubble editor, click 'Plugins' → 'API Connector.' Click 'Add another API' and name it 'Google Calendar.' In the authentication section at the top of this API group, click the dropdown (default 'None') and select 'OAuth2 User-Agent.' This tells Bubble that this API requires each user to individually authorize their Google account. Fill in the OAuth fields: - **App ID / Client ID**: paste your Google Cloud OAuth Client ID - **App Secret / Client Secret**: paste your Client Secret (Bubble stores this securely server-side — it is Private by default for OAuth2 credentials) - **Scope**: `https://www.googleapis.com/auth/calendar.events` - **Authorization URL**: `https://accounts.google.com/o/oauth2/v2/auth` - **Access Token URL**: `https://oauth2.googleapis.com/token` - **Extra parameters for access token endpoint**: add `access_type=offline` and `prompt=consent` — these ensure Google returns a refresh_token so Bubble can refresh the access token after it expires (Google only returns a refresh_token on the first authorization unless you force the consent screen) After saving the OAuth configuration, Bubble generates a 'Connect to Google Calendar' button automatically that you can add to your pages.

1// API Connector OAuth2 User-Agent settings:
2// Authentication Type: OAuth2 User-Agent
3// Client ID: [your Google Cloud Client ID]
4// Client Secret: [your Google Cloud Client Secret]  // Private
5// Scope: https://www.googleapis.com/auth/calendar.events
6// Authorization URL: https://accounts.google.com/o/oauth2/v2/auth
7// Access Token URL: https://oauth2.googleapis.com/token
8// Extra params: access_type=offline&prompt=consent

Under the Google Calendar API group, click 'Add another call.' Name it 'Create Meet Event.' Set the method to POST and the URL to: `https://www.googleapis.com/calendar/v3/calendars/primary/events?conferenceDataVersion=1` The `?conferenceDataVersion=1` query parameter is mandatory — without it, Google ignores the conferenceData in your request body and creates a plain Calendar event with no Meet link. Set the body type to 'JSON body.' Add the following JSON structure in the body section, replacing the static values with dynamic parameters: - `summary`: the meeting title (dynamic) - `description`: optional meeting description (dynamic) - `start.dateTime`: ISO 8601 datetime string for the start (dynamic) - `start.timeZone`: timezone string like 'America/New_York' (dynamic or hardcoded) - `end.dateTime`: ISO 8601 datetime string for the end (dynamic) - `end.timeZone`: same timezone (dynamic or hardcoded) - `conferenceData.createRequest.requestId`: a unique string per request (dynamic — use Bubble's 'Generate random string' to get a UUID-style value) - `conferenceData.createRequest.conferenceSolutionKey.type`: `"hangoutsMeet"` (static string) Click 'Initialize call.' You will need to be logged in with a Google account that has already completed the OAuth flow in your Bubble app to initialize. Enter a real test summary, start time, and a random requestId and run the call. Confirm the response contains a `hangoutLink` field.

1// POST https://www.googleapis.com/calendar/v3/calendars/primary/events?conferenceDataVersion=1
2// Authorization: Bearer [managed automatically by Bubble OAuth2 User-Agent]
3// Content-Type: application/json
4
5{
6  "summary": "<dynamic_meeting_title>",
7  "description": "<dynamic_description>",
8  "start": {
9    "dateTime": "<dynamic_start_datetime_ISO8601>",
10    "timeZone": "<dynamic_timezone>"
11  },
12  "end": {
13    "dateTime": "<dynamic_end_datetime_ISO8601>",
14    "timeZone": "<dynamic_timezone>"
15  },
16  "conferenceData": {
17    "createRequest": {
18      "requestId": "<dynamic_unique_id>",
19      "conferenceSolutionKey": {
20        "type": "hangoutsMeet"
21      }
22    }
23  }
24}

Users must authorize your app before Bubble can make Calendar API calls on their behalf. Go to your Bubble page editor. Add a button element and label it 'Connect Google Calendar.' In the button's workflow, add the action 'Account → Log the user into [Google Calendar API name].' This fires Bubble's OAuth2 authorization flow — it opens a popup where the user selects their Google account and grants the calendar.events scope. After the user authorizes, Bubble stores their OAuth tokens automatically. You can show or hide the 'Connect Google Calendar' button conditionally: show it when the Current User's API Connector status for Google Calendar is 'not connected,' and hide it once connected. In Bubble's UI, this condition is expressed as 'Current User is logged into [Google Calendar] is no.' For the best user experience, place the 'Connect Google Calendar' button in an onboarding flow or settings page so users connect once during setup rather than seeing an authorization prompt at the point of scheduling a meeting. Important: the OAuth2 redirect flow requires HTTPS. In Bubble's test preview environment (http://), the OAuth redirect will fail. Test this step after deploying your app to a custom domain with SSL, or use Bubble's built-in bubbleapps.io subdomain (which uses HTTPS) for testing.

1// Button workflow:
2// Event: Button 'Connect Google Calendar' is clicked
3// Action: Account → Log the user into Google Calendar
4//
5// Conditional visibility for the button:
6// Show this button: Current User is logged into Google Calendar = no
7//
8// After connection, show a success state:
9// Show group 'Google Calendar Connected' when Current User is logged into Google Calendar = yes

With OAuth configured and the API call ready, wire everything together in a meeting-scheduling workflow. On your Bubble page, add: - An Input element for meeting title - A DateTimePicker for start time - A DateTimePicker for end time (or a duration selector) - A Button: 'Create Meet Link' In the button's workflow: 1. Generate a unique requestId: use 'Set state → Page's random_id = Generate random string' or create a custom state for the unique ID 2. Add action: 'Plugins → API Connector - Google Calendar - Create Meet Event' - summary: Input_Title's value - start.dateTime: DateTimePicker_Start's value formatted as ISO 8601 (use Bubble's 'format date' operator with format `YYYY-MM-DDTHH:mm:ss` and append the timezone offset) - end.dateTime: DateTimePicker_End's value formatted the same way - conferenceData.createRequest.requestId: your generated random string (must be unique per meeting) 3. After the API call, save the result: create a new Meeting record with `join_url = Result of step 2 - hangoutLink` and `calendar_event_id = Result of step 2 - id` 4. Display the join_url to the user in a text element or popup Apply privacy rules to any data type that stores calendar event IDs or Meet links so users can only see their own meetings. Go to Data tab → Privacy → add a rule for the Meeting data type: 'Created by = Current User.' RapidDev's team can help architect multi-user scheduling systems — book a free scoping call at rapidevelopers.com/contact.

1// Button workflow: Create Meet Link
2// Step 1: Set custom state unique_request_id = Generate random string (length 16)
3//
4// Step 2: API Connector → Google Calendar → Create Meet Event
5//   summary: Input_Title's value
6//   description: Input_Description's value
7//   start.dateTime: DateTimePicker_Start formatted as ISO 8601
8//   start.timeZone: "America/New_York"  (or dynamic from user profile)
9//   end.dateTime: DateTimePicker_End formatted as ISO 8601
10//   end.timeZone: "America/New_York"
11//   conferenceData.createRequest.requestId: Page's unique_request_id state
12//   conferenceData.createRequest.conferenceSolutionKey.type: "hangoutsMeet"
13//
14// Step 3: Create Meeting record
15//   join_url: Step 2 result - hangoutLink
16//   calendar_event_id: Step 2 result - id
17//   host: Current User
18//   scheduled_start: DateTimePicker_Start's value
19//
20// Step 4: Show popup 'Meeting Created' displaying join_url