diff --git a/packages/devtools-kit/src/_types/rpc.ts b/packages/devtools-kit/src/_types/rpc.ts index 04f6bc1f1..8b9e21310 100644 --- a/packages/devtools-kit/src/_types/rpc.ts +++ b/packages/devtools-kit/src/_types/rpc.ts @@ -64,7 +64,7 @@ export interface ServerFunctions { customTabAction(name: string, action: number): Promise runWizard(token: string, name: T, ...args: GetWizardArgs): Promise openInEditor(filepath: string): Promise - requestForAuth(info?: string): Promise + requestForAuth(info?: string, origin?: string): Promise verifyAuthToken(token: string): Promise restartNuxt(hard?: boolean): Promise installNuxtModule(token: string, name: string, dry?: boolean): Promise diff --git a/packages/devtools/client/components/AuthRequiredPanel.vue b/packages/devtools/client/components/AuthRequiredPanel.vue index 3e74e98d7..675dad2b6 100644 --- a/packages/devtools/client/components/AuthRequiredPanel.vue +++ b/packages/devtools/client/components/AuthRequiredPanel.vue @@ -8,7 +8,7 @@ onMounted(async () => { } } if (!isDevAuthed.value) - rpc.requestForAuth() + requestForAuth() }) const authInput = ref('') diff --git a/packages/devtools/client/composables/dev-auth.ts b/packages/devtools/client/composables/dev-auth.ts index 70089da68..0274b27e7 100644 --- a/packages/devtools/client/composables/dev-auth.ts +++ b/packages/devtools/client/composables/dev-auth.ts @@ -51,7 +51,7 @@ export async function ensureDevAuthToken() { export const userAgentInfo = new UAParser(navigator.userAgent).getResult() -async function authConfirmAction() { +export async function requestForAuth() { const desc = [ userAgentInfo.browser.name, userAgentInfo.browser.version, @@ -60,7 +60,12 @@ async function authConfirmAction() { userAgentInfo.os.version, userAgentInfo.device.type, ].filter(i => i).join(' ') - rpc.requestForAuth(desc) + return await rpc.requestForAuth(desc, window.location.origin) +} + +async function authConfirmAction() { + if (!devAuthToken.value) + requestForAuth() const result = await Promise.race([ AuthConfirm.start(), diff --git a/packages/devtools/client/pages/modules/custom-[name].vue b/packages/devtools/client/pages/modules/custom-[name].vue index f682ee5dd..28070e15d 100644 --- a/packages/devtools/client/pages/modules/custom-[name].vue +++ b/packages/devtools/client/pages/modules/custom-[name].vue @@ -24,7 +24,7 @@ onMounted(() => { }, 2000) } else if (tab.value.requireAuth && !isDevAuthed.value) { - rpc.requestForAuth() + requestForAuth() } }) diff --git a/packages/devtools/src/server-rpc/general.ts b/packages/devtools/src/server-rpc/general.ts index 5b054d932..b22b62c4d 100644 --- a/packages/devtools/src/server-rpc/general.ts +++ b/packages/devtools/src/server-rpc/general.ts @@ -149,15 +149,17 @@ export function setupGeneralRPC({ nuxt, options, refresh, openInEditorHooks }: N logger.info('Restarting Nuxt...') return nuxt.callHook('restart', { hard }) }, - async requestForAuth(info: string) { + async requestForAuth(info: string, origin?: string) { const token = await getDevAuthToken() + origin ||= `${nuxt.options.devServer.https ? 'https' : 'http'}://${nuxt.options.devServer.host === '::' ? 'localhost' : (nuxt.options.devServer.host || 'localhost')}:${nuxt.options.devServer.port}` + const message = [ `A browser is requesting permissions of ${colors.bold(colors.yellow('writing files and running commands'))} from the DevTools UI.`, colors.bold(info), '', 'Please open the following URL in the browser:', - colors.bold(colors.green(`${nuxt.options.devServer.https ? 'https' : 'http'}://${nuxt.options.devServer.host === '::' ? 'localhost' : (nuxt.options.devServer.host || 'localhost')}:${nuxt.options.devServer.port}${ROUTE_AUTH}?token=${token}`)), + colors.bold(colors.green(`${origin}${ROUTE_AUTH}?token=${token}`)), '', 'Or manually copy and paste the following token:', colors.bold(colors.cyan(token)),