fix(app): make Modrinth account SSO logins from the app work (#4345)

Author: AlexTMjugador

apps/frontend/src/composables/auth.js

@@ -109,7 +109,7 @@ export const getAuthUrl = (provider, redirect = '/dashboard') => {
 	const route = useNativeRoute()
 
 	const fullURL = route.query.launcher
-		? 'https://launcher-files.modrinth.com'
+		? getLauncherRedirectUrl(route)
 		: `${config.public.siteUrl}/auth/sign-in?redirect=${redirect}`
 
 	return `${config.public.apiBaseUrl}auth/init?provider=${provider}&url=${encodeURIComponent(fullURL)}`
@@ -131,3 +131,12 @@ export const removeAuthProvider = async (provider) => {
 
 	stopLoading()
 }
+
+export const getLauncherRedirectUrl = (route) => {
+	const usesLocalhostRedirectionScheme =
+		['4', '6'].includes(route.query.ipver) && Number(route.query.port) < 65536
+
+	return usesLocalhostRedirectionScheme
+		? `http://${route.query.ipver === '4' ? '127.0.0.1' : '[::1]'}:${route.query.port}`
+		: `https://launcher-files.modrinth.com`
+}

apps/frontend/src/pages/auth/sign-in.vue

@@ -144,7 +144,7 @@ import { commonMessages, injectNotificationManager } from '@modrinth/ui'
 import { IntlFormatted } from '@vintl/vintl/components'
 
 import HCaptcha from '@/components/ui/HCaptcha.vue'
-import { getAuthUrl } from '@/composables/auth.js'
+import { getAuthUrl, getLauncherRedirectUrl } from '@/composables/auth.js'
 
 const { addNotification } = injectNotificationManager()
 const { formatMessage } = useVIntl()
@@ -275,26 +275,21 @@ async function finishSignIn(token) {
 			token = auth.value.token
 		}
 
-		const usesLocalhostRedirectionScheme =
-			['4', '6'].includes(route.query.ipver) && Number(route.query.port) < 65536
+		const redirectUrl = `${getLauncherRedirectUrl(route)}/?code=${token}`
 
-		const redirectUrl = usesLocalhostRedirectionScheme
-			? `http://${route.query.ipver === '4' ? '127.0.0.1' : '[::1]'}:${route.query.port}/?code=${token}`
-			: `https://launcher-files.modrinth.com/?code=${token}`
-
-		if (usesLocalhostRedirectionScheme) {
-			// When using this redirection scheme, the auth token is very visible in the URL to the user.
+		if (redirectUrl.startsWith('https://launcher-files.modrinth.com/')) {
+			await navigateTo(redirectUrl, {
+				external: true,
+			})
+		} else {
+			// When redirecting to localhost, the auth token is very visible in the URL to the user.
 			// While we could make it harder to find with a POST request, such is security by obscurity:
 			// the user and other applications would still be able to sniff the token in the request body.
 			// So, to make the UX a little better by not changing the displayed URL, while keeping the
 			// token hidden from very casual observation and keeping the protocol as close to OAuth's
 			// standard flows as possible, let's execute the redirect within an iframe that visually
 			// covers the entire page.
 			subtleLauncherRedirectUri.value = redirectUrl
-		} else {
-			await navigateTo(redirectUrl, {
-				external: true,
-			})
 		}
 
 		return

apps/labrinth/.env.docker-compose

@@ -51,7 +51,7 @@ RATE_LIMIT_IGNORE_IPS='["127.0.0.1"]'
 
 WHITELISTED_MODPACK_DOMAINS='["cdn.modrinth.com", "github.com", "raw.githubusercontent.com"]'
 
-ALLOWED_CALLBACK_URLS='["localhost", ".modrinth.com", "127.0.0.1"]'
+ALLOWED_CALLBACK_URLS='["localhost", ".modrinth.com", "127.0.0.1", "[::1]"]'
 
 GITHUB_CLIENT_ID=none
 GITHUB_CLIENT_SECRET=none

apps/labrinth/.env.local

@@ -51,7 +51,7 @@ RATE_LIMIT_IGNORE_IPS='["127.0.0.1"]'
 
 WHITELISTED_MODPACK_DOMAINS='["cdn.modrinth.com", "github.com", "raw.githubusercontent.com"]'
 
-ALLOWED_CALLBACK_URLS='["localhost", ".modrinth.com", "127.0.0.1"]'
+ALLOWED_CALLBACK_URLS='["localhost", ".modrinth.com", "127.0.0.1", "[::1]"]'
 
 GITHUB_CLIENT_ID=none
 GITHUB_CLIENT_SECRET=none