> ## Documentation Index
> Fetch the complete documentation index at: https://ngrok.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Google OAuth

> Configure ngrok to authenticate users with Google OAuth 2.0. Set up a GCP project, consent screen, and OAuth client.

By default, if you use `"google"` for OAuth in your Traffic Policies without specifying a Google OAuth application, visitors are authenticated using ngrok's managed Google OAuth instance.
Setting up your own Google OAuth application lets you customize authentication in more detail.
This guide walks you through creating a Google OAuth 2.0 application for your ngrok endpoints.

## What you'll need

* A [Google Cloud Platform](https://console.cloud.google.com) account and project.
* Your ngrok authtoken and an endpoint with the OAuth action in its Traffic Policy.

## 1. Configure the consent screen

ngrok configures its OAuth settings in the [Google Auth Platform](https://console.cloud.google.com/auth/overview), which replaces the former OAuth consent screen.
Follow [Google's OAuth 2.0 setup documentation](https://support.google.com/cloud/answer/6158849?hl=en) to configure the consent screen, and set the following for ngrok:

* **Authorized domains**: add `ngrok.com` along with your application's homepage domain.
* **Scopes**: keep the `email` and `profile` scopes selected, and add any additional scopes your application requires. Save the full scope URIs for later. See [possible scope URIs](https://developers.google.com/identity/protocols/oauth2/scopes) for options.
* **Audience**: select whether your application is an [internal or external app](https://support.google.com/cloud/answer/6158849?hl=en#public-and-internal).

<Note>
  Applications that require Google verification cannot complete setup and are not supported by ngrok.
</Note>

## 2. Create credentials for ngrok

Create an OAuth **Web application** client (see [Google's documentation](https://developers.google.com/identity/protocols/oauth2/web-server)), and set the following:

* **Authorized redirect URIs**: `https://idp.ngrok.com/oauth2/callback`

Securely store the **Client ID** and **Client secret** from the final screen for use in your Traffic Policy below. The client secret is shown only once.

## 3. Update your ngrok endpoint Traffic Policy

1. Access the [ngrok Dashboard Endpoints page](https://dashboard.ngrok.com/endpoints?sortBy=createdAt\&orderBy=desc) and locate an existing endpoint you'd like to add this to or create a new one.
2. In your traffic policy, add the following configuration:

<Note>
  You may add [any scopes](https://developers.facebook.com/docs/apps/review/login-permissions) that are required by your application with the following caveats.

  * Scopes which require a Facebook [app review](https://developers.facebook.com/docs/apps/review/#app-review) are unsupported.
  * ngrok will enforce that users [accept all permissions](https://developers.facebook.com/docs/facebook-login/handling-declined-permissions#reprompt) before completing authorization.
</Note>

<CodeGroup>
  ```yaml policy.yml theme={null}
  on_http_request:
    - actions:
        - type: oauth
          config:
            provider: google
            client_id: '{your app''s oauth client id}'
            client_secret: '{your app''s oauth client secret}'
            scopes:
              - https://www.googleapis.com/auth/userinfo.profile
              - https://www.googleapis.com/auth/userinfo.email
  ```

  ```json policy.json theme={null}
  {
    "on_http_request": [
      {
        "actions": [
          {
            "type": "oauth",
            "config": {
              "provider": "google",
              "client_id": "{your app's oauth client id}",
              "client_secret": "{your app's oauth client secret}",
              "scopes": [
                "https://www.googleapis.com/auth/userinfo.profile",
                "https://www.googleapis.com/auth/userinfo.email"
              ]
            }
          }
        ]
      }
    ]
  }
  ```
</CodeGroup>

Click **Save** to validate and update your traffic policy.

### Configure access control

Optionally, configure access control to your service by only allowing specific users or domains.

<CodeGroup>
  ```yaml policy.yml theme={null} theme={null}
  on_http_request:
    - expressions:
        - '!(actions.ngrok.oauth.identity.email in [''me@example.com''])'
      actions:
        - type: deny
  ```

  ```json policy.json theme={null} theme={null}
  {
    "on_http_request": [
      {
        "expressions": [
          "!(actions.ngrok.oauth.identity.email in ['me@example.com'])"
        ],
        "actions": [
          {
            "type": "deny"
          }
        ]
      }
    ]
  }
  ```
</CodeGroup>

## Further resources

* [Google OAuth 2.0 Web Server](https://developers.google.com/identity/protocols/oauth2/web-server) (prerequisite steps)
* [GCP Help: Setting up OAuth 2.0](https://support.google.com/cloud/answer/6158849?hl=en)
* [Google OAuth 2.0 workflow](https://developers.google.com/identity/protocols/oauth2)