Make Clerk sign-in work on the static GitHub Pages build (dashban.com) - #72
Merged
Conversation
dashban.com is served by GitHub Pages (static, no backend), so the frontend's same-origin calls to /api/config and /api/github returned 404 and Clerk never initialized — "Sign in with GitHub" did nothing. Mirror the pattern already used by super3/padtask: keep the static frontend on Pages and reach the backend on its own Railway origin, cross-origin. - server.js: enable CORS so the Pages origin can call the API. The GitHub proxy still requires a valid Clerk session token, so this grants no access on its own. - github-auth.js: add origin-aware getApiBase() — relative paths on localhost / when served by the backend, the absolute Railway URL for a static host. Route the authenticated proxy request through it. - clerk-auth.js: fetch /api/config via getApiBase(), and fall back to the built-in browser-safe publishable key so Clerk initializes even when the backend config is momentarily unreachable. Keeps dashban.com on GitHub Pages (no DNS change). Full suite green at 100% coverage; lint clean. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_019VQjXJyM3EZPd4joy3EwaB
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
Clicking Sign in with GitHub on https://dashban.com does nothing.
dashban.comis served by GitHub Pages (static, no backend). The frontend made same-origin calls —fetch('/api/config')and/api/github/...— which 404 on Pages, so Clerk never initialized and the button no-oped. (Sign-in already works fine when the app is opened directly on its Railway URL, which serves both the frontend and the API.)Fix
Mirror the pattern already proven in
super3/padtask: keep the static frontend on GitHub Pages and reach the backend on its own Railway origin, cross-origin. No DNS change —dashban.comstays on Pages.server.js—app.use(cors())so the Pages origin can call the API. The GitHub proxy still requires a valid Clerk session token, so opening CORS grants no access on its own.src/github-auth.js— new origin-awaregetApiBase(): relative paths onlocalhost/ when served by the backend, the absolute Railway URL (https://dashban-production.up.railway.app) for a static host likedashban.com. The authenticated proxy request routes through it.src/clerk-auth.js—fetchConfig()now usesgetApiBase()to reach/api/configcross-origin, andinitialize()falls back to the built-in browser-safe publishable key so Clerk still initializes if the backend config is momentarily unreachable.How padtask does it (verified)
padtask.compadtask-production.up.railway.app)API_BASEabsolute URL, chosen by hostnameapp.use(cors())→access-control-allow-origin: *Deployment notes
dashban.comremains on GitHub Pages.CLERK_SECRET_KEYset on the Railway service (already configured).Testing
npm test— 959 passing (6 new:getApiBasebranches,fetchConfigbase-URL handling, the built-in-key fallback, and a CORS header check).npm run test:coverage— 100% statements/branches/functions/lines across all files includingserver.js,github-auth.js,clerk-auth.js.npm run lint— 0 errors (7 pre-existing warnings unchanged).🤖 Generated with Claude Code
https://claude.ai/code/session_019VQjXJyM3EZPd4joy3EwaB
Generated by Claude Code