Appearance
Google authentication
Google lets your users sign in with the Google account they already use for Gmail, Google Workspace, and other Google services. Once connected, you can use Google as a social provider in your WeWeb sign-in flows without asking users to create a separate password for your app.
What this integration supports
- Let users sign in with their Google account.
- Work with the
Sign in with social provideraction in your interface workflows. - Use the same WeWeb
Users,Roles, protected pages, and protected API rules as any other sign-in method. - Send users to different pages after sign in, after an error, or on first sign in.
Setup in Google Cloud
All configuration for this provider happens in the Google Cloud Console. You will create a web OAuth client, add the domains where users can start sign in, and add the exact callback URL Google should use.
1. Create a project and enable OAuth
- Go to the Google Cloud Console.
- Create or select a project for your application.
- In the left menu, open
APIs & Services -> OAuth consent screen. - Complete the consent screen setup:
- Choose
Externalfor most public apps. - Fill in the app name and support email.
- Add your app domains under
Authorized domains.
- Choose
- Save and continue until the consent screen is published, or keep it in testing mode while you add test users.
2. Create OAuth client credentials
- Still in
APIs & Services, go toCredentials. - Click
Create credentials -> OAuth client ID. - Choose
Web applicationas the application type. - Under
Authorized JavaScript origins, add the full origin for each place where users can start Google sign in. - Under
Authorized redirect URIs, add the fixed Google callback URL for each origin by adding/api/auth/callback/googleto the end of that origin. - Click
Createand copy the generatedClient IDandClient secret.
Use the same origin and callback pair for each environment you want to support:
| Where users start sign in | Authorized JavaScript origin | Authorized redirect URI |
|---|---|---|
| Editor project | https://<your-project-id>-editor.weweb.io | https://<your-project-id>-editor.weweb.io/api/auth/callback/google |
| Published app | https://your-domain.com | https://your-domain.com/api/auth/callback/google |
| Preview or staging app | https://your-preview-domain.com | https://your-preview-domain.com/api/auth/callback/google |
FULL URLS MATTER
For Authorized JavaScript origins, Google expects the full origin with https://.
For Authorized redirect URIs, Google expects the full callback URL, not just the domain.
Connect Google in WeWeb
With your Google credentials ready, connect the provider in WeWeb.
- In the WeWeb editor, open
Data & API -> Auth -> Integrating providers. - Find the
Googleprovider section and expand it. - Turn on the
Enabletoggle for Google. - Paste your values:
Client IDs- Your Google OAuth client ID. If you use multiple client IDs, paste them as a comma-separated list.Client Secret (for OAuth)- The client secret from your Google OAuth client.
- Save your changes.
GOOGLE CALLBACK URL VS SUCCESS PAGE
The Google Console redirect URI is always the provider callback URL, such as https://your-domain.com/api/auth/callback/google.
The Success page, Error page, and New user page you choose in WeWeb are separate. They are the pages inside your app where users land after the Google callback is complete.
Test sign in
After saving the provider configuration, test that everything works end to end.
- In the editor, add a button or link to your interface.
- Attach a workflow with the
Sign in with social providerinterface action. - In the action options:
- Set
Providertogoogle. - Choose a
Success pagefor where users should land after sign in. - Choose an
Error pagefor where users should go if sign in fails. - Optionally choose a
New user pageif you want to route first-time users differently.
- Set
- Preview your project and click the button.
- Complete the Google sign-in flow with a test Google account.
- Confirm that:
- You are redirected to the correct page in your app after sign in.
- You are authenticated as the corresponding user.
For general information about how sessions, roles, and page protection work once a user is signed in, see Using authentication in WeWeb ->.
Common pitfalls
Redirect URI mismatch
If Google shows a redirect_uri_mismatch error, the redirect URL used by your app does not match what you configured in the Google Cloud Console.
Confirm the value in Authorized redirect URIs is the full callback URL, such as https://your-domain.com/api/auth/callback/google.
Wrong domain or environment
If sign in works in one environment but not another, check that:
- Each environment has both entries added in Google.
- The full origin is listed in
Authorized JavaScript origins. - The same origin plus
/api/auth/callback/googleis listed inAuthorized redirect URIs. - You updated Google if you changed your editor domain, preview domain, or custom domain.
Using the success page as the Google callback
The Success page in the Sign in with social provider action is not the value you paste into Google.
- Google needs the fixed WeWeb callback URL:
https://<origin>/api/auth/callback/google. - The action page settings only decide where the user lands after that callback is complete.
Missing test users on the Google consent screen
If your Google app is still in testing mode, only approved test users can sign in.
- Open
APIs & Services -> OAuth consent screen. - Add your test Google accounts before trying the flow.
Reference
WeWeb settings reference
| Setting | Description | Where to find it in Google |
|---|---|---|
Enable | Turns Google sign in on for your WeWeb project. | Not used in Google. Turn this on in WeWeb after you finish the Google setup. |
Client IDs | One or more OAuth client IDs that identify your app to Google. | APIs & Services -> Credentials -> OAuth 2.0 Client IDs |
Client Secret (for OAuth) | Secret used by WeWeb when completing the Google sign-in flow. | Open the same OAuth client in Credentials, then copy the Client secret. |
Google values to prepare
| Google field | What to enter |
|---|---|
Authorized domains | Your domain only, without a path. |
Authorized JavaScript origins | The full origin where sign in starts, such as https://your-domain.com. |
Authorized redirect URIs | The full callback URL, such as https://your-domain.com/api/auth/callback/google. |
FAQs
Can I use multiple Google OAuth clients?
Yes. If you have separate client IDs for web, Android, or Chrome extensions, you can paste them into Client IDs as a comma-separated list. Make sure each client is configured with the correct domains and redirect URIs.
What should I put in Google for my WeWeb project editor URL?
If you want Google sign in to work inside the WeWeb editor, add your editor project origin and callback URL:
https://<your-project-id>-editor.weweb.iohttps://<your-project-id>-editor.weweb.io/api/auth/callback/google
Do I need to change anything in my workflows to use Google?
No. Once Google is enabled and configured, you simply use the Sign in with social provider interface action and set Provider to google. The rest of your auth logic stays the same.
Is the success page the same as the Google redirect URI?
No. The Google redirect URI is the fixed callback URL ending in /api/auth/callback/google. The success page is where WeWeb sends the user after Google sign in has already finished.
Can I mix Google sign in with email/password?
Yes. Users can sign up with email/password or sign in with Google on the same project. Behind the scenes, both methods work with the same user and session system.
CONTINUE LEARNING
After Google sign in is working, the next step is deciding what authenticated users can access.

