Q: Google OAuth Login Issue - Redirect Stuck at API Server Instead of Auth Server

[gavined1]

Describe the bug | 问题描述

Problem Description

GitHub OAuth works perfectly fine and correctly redirects to the auth server. However, after adding Google OAuth alongside GitHub, the login flow gets stuck at the API server (api.mydomain.com) instead of redirecting to the separate auth server (auth.mydomain.com).

Key point: The issue only appears when Google OAuth is added to an existing working GitHub OAuth setup. The oauthServices response is working fine - the problem is with the OAuth redirect flow.

Environment

• Waline Client Version: @waline/[email protected]
• Waline Server: @waline/vercel (latest)
• Framework: Next.js 16.1.0
• Browser: Chrome 143.0 (Windows 11)
• Server Architecture:
  • API Server: api.mydomain.com (Waline API server)
  • Auth Server: auth.mydomain.com (Separate OAuth authentication server)

Steps to Reproduce

1. First, configure only GitHub OAuth (this works perfectly):

   GITHUB_ID=your_github_client_id
   GITHUB_SECRET=your_github_client_secret

   • ✅ GitHub OAuth works without any errors
   • ✅ Login button appears and functions correctly
   • ✅ Clicking login correctly redirects to auth.mydomain.com for OAuth
   • ✅ OAuth flow completes successfully
   • ✅ Comments work as expected

2. Then, add Google OAuth alongside GitHub:

   GOOGLE_ID=your_google_client_id
   GOOGLE_SECRET=your_google_client_secret

3. Initialize Waline client with login: "enable":

   import { init } from "@waline/client";
   
   const waline = init({
     el: "#waline",
     serverURL: "https://api.mydomain.com",
     login: "enable",
     // ... other options
   });

4. After adding Google OAuth, the redirect flow breaks:

   • Click the login button
   • Instead of redirecting to auth.mydomain.com, it gets stuck at https://api.mydomain.com/ui/login?lng=en
   • The login page shows a white/blank screen
   • Users cannot complete the OAuth login flow

Expected Behavior

• When clicking the login button, the system should redirect to auth.mydomain.com for OAuth authentication
• After OAuth authentication, users should be redirected back to complete the login
• Both GitHub and Google OAuth should work seamlessly
• The login page should display OAuth provider buttons (GitHub, Google)

Actual Behavior

• ✅ With GitHub OAuth alone:

  • Login button works correctly
  • Redirects to auth.mydomain.com as expected
  • OAuth flow completes successfully

• ❌ After adding Google OAuth:

  • Login button redirects to api.mydomain.com/ui/login?lng=en instead of auth.mydomain.com
  • Page loads but shows a completely blank white screen
  • OAuth redirect flow is broken
  • Users cannot log in
  • The system appears to be trying to handle OAuth on the API server instead of redirecting to the auth server

Error Details

Redirect Issue

When clicking login after adding Google OAuth:

• Expected URL: https://auth.mydomain.com/... (auth server)
• Actual URL: https://api.mydomain.com/ui/login?lng=en (API server)
• Result: White/blank screen, OAuth flow cannot proceed

Server Architecture

The setup uses a separate auth server:

• API Server (api.mydomain.com): Handles Waline API endpoints
• Auth Server (auth.mydomain.com): Handles OAuth authentication

With GitHub OAuth alone, the redirect to auth.mydomain.com works correctly. After adding Google OAuth, the system incorrectly tries to handle login on the API server.

Server Response Analysis

The oauthServices response is working correctly:

{
  "oauthServices": [
    { "name": "github", "origin": "https://github.com" },
    { "name": "google", "origin": "https://accounts.google.com" }
  ]
}

The issue is not with the API response, but with the redirect logic when Google OAuth is present.

Questions

1. Why does adding Google OAuth change the redirect behavior?

   • GitHub OAuth: ✅ Correctly redirects to auth.mydomain.com
   • GitHub + Google OAuth: ❌ Gets stuck at api.mydomain.com/ui/login
   • Is there a conflict in how Waline v3 handles redirects for multiple OAuth providers?

2. How should OAuth redirects work with a separate auth server?

   • Is there a configuration option to specify the auth server URL?
   • Should the redirect always go to the auth server, not the API server?
   • Why does Google OAuth cause the system to use the API server instead?

3. Is there a specific server-side configuration for Google OAuth with separate auth servers?

   • GitHub OAuth works with the separate auth server setup
   • Google OAuth seems to require different redirect handling
   • Are there environment variables or configuration options for auth server URLs?

4. Is this a known issue with multiple OAuth providers and separate auth servers?

   • Single provider (GitHub) works correctly
   • Multiple providers (GitHub + Google) breaks the redirect flow

Additional Information

• ✅ GitHub OAuth alone works perfectly - correctly redirects to auth.mydomain.com, OAuth flow completes successfully
• ❌ After adding Google OAuth, the redirect flow breaks:
  • System tries to handle login on api.mydomain.com instead of redirecting to auth.mydomain.com
  • Login page shows white/blank screen
  • OAuth flow cannot proceed
• The oauthServices API response is working correctly (not the issue)
• Server logs don't show any obvious errors related to OAuth configuration
• Google OAuth credentials are verified and working in other applications
• Removing Google OAuth credentials (keeping only GitHub) resolves the issue immediately:
  • ✅ Redirect to auth.mydomain.com works correctly again
  • ✅ Login page renders correctly again

Server Configuration

Current setup:

• Waline API Server: api.mydomain.com
• OAuth Auth Server: auth.mydomain.com (separate server)
• GitHub OAuth Callback: https://auth.mydomain.com/api/oauth/github
• Google OAuth Callback: https://auth.mydomain.com/api/oauth/google (configured but redirect doesn't reach it)

Related

• This might be related to how Waline v3 handles OAuth redirects when multiple providers are configured
• The system may be trying to handle OAuth on the API server when it should redirect to the auth server
• There may be a configuration issue with how Google OAuth redirects are processed compared to GitHub

---

Note: I'm happy to provide more details, server logs, network traces, or test different configurations if needed. Thank you for maintaining Waline!

Website URL | 问题网站

https://gavined.com

Where your waline deploy? | 服务部署在哪里？

Vercel (Default)

Where your comment data store? | 数据存储在哪里？

TiDB

[lizheming]

The error is because the frontend of the backend hasn't added the Google login-related resource configuration yet, causing this error. I'll fix it as soon as possible.

[gavined1]

I really appreciate the incredibly fast response and for pinpointing the exact issue with the Google resource configuration so quickly! It’s a huge help to have such a clear answer. Looking forward to the fix! ✨

[lizheming]

@waline/[email protected] has been fixed. Please check again to see if there are any issues. Remember to refresh the browser cache on the admin panel.

[lizheming]

I actually discovered this issue when I was modifying the OAuth capabilities. At the time, I assumed that since the official login method wasn't yet available, no one was using it, so I didn't address it. I didn't expect Waline has so many such experienced users! 👍🏻

[gavined1]

Since the project is evolving so well, I would like to propose a new idea: Server-Side UI Customization.

The goal is to allow customization of the Admin Dashboard and Login UI (like the /ui/login page) to feel as seamless as Clerk. It would be great if we could modify these via environment variables—specifically adding a SITE_LOGO to replace the default icon and ADMIN_CUSTOM_CSS to inject custom styling. This would allow the Waline management interface to match the blog's branding perfectly, rather than looking like a separate system.

#One more question:
How can I make the .wl-addr (location text) display in English? Is there a server-side environment variable like IP_LANG=en to force this?

[lizheming]

https://github.com/walinejs/waline/blob/main/packages/server/src/middleware/dashboard.js#L21C19-L21C48 WALINE_ADMIN_MODULE_ASSET_URL is what you need.

The address information is based on the IP database. Currently, we are using a Chinese IP database, and there is no option to configure multi-language support at this time. Unless you generate an English IP database file according to the instructions at this link: https://github.com/yumeiqiang/dy-node-ip2region?tab=readme-ov-file#ip2regiondb%E7%9A%84%E7%94%9F%E6%88%90, which I think would be too difficult for you. Additionally, some users in international regions are sensitive about the collection of IP addresses. Therefore, I recommend that non-Chinese users simply use the DISABLE_REGION environment variable to disable the display of location information, which would be more convenient.