split url into webUrl and localUrl (like mastodon)

19 files changed, 52 insertions, 52 deletions

diff --git a/packages/frontend/src/pages/about-misskey.vue b/packages/frontend/src/pages/about-misskey.vue
index 08a4e80494..79281fad0d 100644
--- a/packages/frontend/src/pages/about-misskey.vue
+++ b/packages/frontend/src/pages/about-misskey.vue
@@ -48,7 +48,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<FormSection v-if="instance.repositoryUrl !== 'https://github.com/misskey-dev/misskey'">
 					<div class="_gaps_s">
 						<MkInfo>
-							{{ i18n.tsx._aboutMisskey.thisIsModifiedVersion({ name: instance.name ?? host }) }}
+							{{ i18n.tsx._aboutMisskey.thisIsModifiedVersion({ name: instance.name ?? webHost }) }}
 						</MkInfo>
 						<FormLink v-if="instance.repositoryUrl" :to="instance.repositoryUrl" external>
 							<template #icon><i class="ti ti-code"></i></template>
@@ -137,7 +137,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { nextTick, onBeforeUnmount, ref, useTemplateRef, computed } from 'vue';
-import { host, version } from '@@/js/config.js';
+import { webHost, version } from '@@/js/config.js';
 import FormLink from '@/components/form/link.vue';
 import FormSection from '@/components/form/section.vue';
 import MkButton from '@/components/MkButton.vue';
diff --git a/packages/frontend/src/pages/about.overview.vue b/packages/frontend/src/pages/about.overview.vue
index 32296de3a4..9d4a2c3480 100644
--- a/packages/frontend/src/pages/about.overview.vue
+++ b/packages/frontend/src/pages/about.overview.vue
@@ -9,7 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<div style="overflow: clip;">
 			<img :src="instance.iconUrl ?? '/favicon.ico'" alt="" :class="$style.bannerIcon"/>
 			<div :class="$style.bannerName">
-				<b>{{ instance.name ?? host }}</b>
+				<b>{{ instance.name ?? webHost }}</b>
 			</div>
 		</div>
 	</div>
@@ -25,7 +25,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<template #key>Misskey</template>
 				<template #value>{{ version }}</template>
 			</MkKeyValue>
-			<div v-html="i18n.tsx.poweredByMisskeyDescription({ name: instance.name ?? host })">
+			<div v-html="i18n.tsx.poweredByMisskeyDescription({ name: instance.name ?? webHost })">
 			</div>
 			<FormLink to="/about-misskey">
 				<template #icon><i class="ti ti-info-circle"></i></template>
@@ -126,7 +126,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { host, version } from '@@/js/config.js';
+import { webHost, version } from '@@/js/config.js';
 import { i18n } from '@/i18n.js';
 import { instance } from '@/instance.js';
 import number from '@/filters/number.js';
diff --git a/packages/frontend/src/pages/admin-user.vue b/packages/frontend/src/pages/admin-user.vue
index b084eb5ab2..3c605a70dd 100644
--- a/packages/frontend/src/pages/admin-user.vue
+++ b/packages/frontend/src/pages/admin-user.vue
@@ -208,7 +208,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { computed, defineAsyncComponent, watch, ref, markRaw } from 'vue';
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import type { ChartSrc } from '@/components/MkChart.vue';
 import MkChart from '@/components/MkChart.vue';
 import MkObjectView from '@/components/MkObjectView.vue';
@@ -514,7 +514,7 @@ async function editAnnouncement(announcement: Misskey.entities.AdminAnnouncement
 
 watch(user, () => {
 	misskeyApi('ap/get', {
-		uri: user.value.uri ?? `${url}/users/${user.value.id}`,
+		uri: user.value.uri ?? `${webUrl}/users/${user.value.id}`,
 	}).then(res => {
 		ap.value = res;
 	});
diff --git a/packages/frontend/src/pages/admin/branding.vue b/packages/frontend/src/pages/admin/branding.vue
index 016d1b6a89..367702d7ca 100644
--- a/packages/frontend/src/pages/admin/branding.vue
+++ b/packages/frontend/src/pages/admin/branding.vue
@@ -44,7 +44,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						<template #prefix><i class="ti ti-link"></i></template>
 						<template #label><SearchLabel>{{ i18n.ts._serverSettings.iconUrl }} (App/192px)</SearchLabel></template>
 						<template #caption>
-							<div>{{ i18n.tsx._serverSettings.appIconDescription({ host: instance.name ?? host }) }}</div>
+							<div>{{ i18n.tsx._serverSettings.appIconDescription({ host: instance.name ?? webHost }) }}</div>
 							<div>({{ i18n.ts._serverSettings.appIconUsageExample }})</div>
 							<div>{{ i18n.ts._serverSettings.appIconStyleRecommendation }}</div>
 							<div><strong>{{ i18n.tsx._serverSettings.appIconResolutionMustBe({ resolution: '192x192px' }) }}</strong></div>
@@ -57,7 +57,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						<template #prefix><i class="ti ti-link"></i></template>
 						<template #label><SearchLabel>{{ i18n.ts._serverSettings.iconUrl }} (App/512px)</SearchLabel></template>
 						<template #caption>
-							<div>{{ i18n.tsx._serverSettings.appIconDescription({ host: instance.name ?? host }) }}</div>
+							<div>{{ i18n.tsx._serverSettings.appIconDescription({ host: instance.name ?? webHost }) }}</div>
 							<div>({{ i18n.ts._serverSettings.appIconUsageExample }})</div>
 							<div>{{ i18n.ts._serverSettings.appIconStyleRecommendation }}</div>
 							<div><strong>{{ i18n.tsx._serverSettings.appIconResolutionMustBe({ resolution: '512x512px' }) }}</strong></div>
@@ -156,7 +156,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 import { ref, computed } from 'vue';
 import JSON5 from 'json5';
 import * as Misskey from 'misskey-js';
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import MkInput from '@/components/MkInput.vue';
 import MkTextarea from '@/components/MkTextarea.vue';
 import * as os from '@/os.js';
diff --git a/packages/frontend/src/pages/channel.vue b/packages/frontend/src/pages/channel.vue
index 0879aa72be..ac11c6e9bc 100644
--- a/packages/frontend/src/pages/channel.vue
+++ b/packages/frontend/src/pages/channel.vue
@@ -73,7 +73,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { computed, watch, ref, markRaw, shallowRef } from 'vue';
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { useInterval } from '@@/js/use-interval.js';
 import type { PageHeaderItem } from '@/types/page-header.js';
 import MkPostForm from '@/components/MkPostForm.vue';
@@ -268,7 +268,7 @@ const headerActions = computed(() => {
 					console.warn('failed to copy channel URL. channel.value is null.');
 					return;
 				}
-				copyToClipboard(`${url}/channels/${channel.value.id}`);
+				copyToClipboard(`${webUrl}/channels/${channel.value.id}`);
 			},
 		});
 
@@ -285,7 +285,7 @@ const headerActions = computed(() => {
 					navigator.share({
 						title: channel.value.name,
 						text: channel.value.description ?? undefined,
-						url: `${url}/channels/${channel.value.id}`,
+						url: `${webUrl}/channels/${channel.value.id}`,
 					});
 				},
 			});
diff --git a/packages/frontend/src/pages/chat/XMessage.vue b/packages/frontend/src/pages/chat/XMessage.vue
index f759e45e48..83e290e92c 100644
--- a/packages/frontend/src/pages/chat/XMessage.vue
+++ b/packages/frontend/src/pages/chat/XMessage.vue
@@ -54,7 +54,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 import { computed, defineAsyncComponent, provide } from 'vue';
 import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { isLink } from '@@/js/is-link.js';
 import type { MenuItem } from '@/types/menu.js';
 import type { NormalizedChatMessage } from './room.vue';
@@ -182,7 +182,7 @@ function showMenu(ev: PointerEvent, contextmenu = false) {
 			text: i18n.ts.reportAbuse,
 			icon: 'ti ti-exclamation-circle',
 			action: async () => {
-				const localUrl = `${url}/chat/messages/${props.message.id}`;
+				const localUrl = `${webUrl}/chat/messages/${props.message.id}`;
 				const { dispose } = await os.popupAsyncWithDialog(import('@/components/MkAbuseReportWindow.vue').then(x => x.default), {
 					user: props.message.fromUser!,
 					initialComment: `${localUrl}\n-----\n`,
diff --git a/packages/frontend/src/pages/clip.vue b/packages/frontend/src/pages/clip.vue
index 8feddf70b0..4c51ed7f5e 100644
--- a/packages/frontend/src/pages/clip.vue
+++ b/packages/frontend/src/pages/clip.vue
@@ -32,7 +32,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { computed, watch, provide, ref, markRaw } from 'vue';
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import type { MenuItem } from '@/types/menu.js';
 import type { PageHeaderItem } from '@/types/page-header.js';
 import MkNotesTimeline from '@/components/MkNotesTimeline.vue';
@@ -152,7 +152,7 @@ const headerActions = computed<PageHeaderItem[] | null>(() => clip.value && isOw
 			icon: 'ti ti-link',
 			text: i18n.ts.copyUrl,
 			action: () => {
-				copyToClipboard(`${url}/clips/${clip.value!.id}`);
+				copyToClipboard(`${webUrl}/clips/${clip.value!.id}`);
 			},
 		}, {
 			icon: 'ti ti-code',
@@ -170,7 +170,7 @@ const headerActions = computed<PageHeaderItem[] | null>(() => clip.value && isOw
 					navigator.share({
 						title: clip.value!.name,
 						text: clip.value!.description ?? '',
-						url: `${url}/clips/${clip.value!.id}`,
+						url: `${webUrl}/clips/${clip.value!.id}`,
 					});
 				},
 			});
diff --git a/packages/frontend/src/pages/flash/flash.vue b/packages/frontend/src/pages/flash/flash.vue
index 449f1af60a..f2f5f7a9b2 100644
--- a/packages/frontend/src/pages/flash/flash.vue
+++ b/packages/frontend/src/pages/flash/flash.vue
@@ -65,7 +65,7 @@ import { computed, onDeactivated, onUnmounted, ref, watch, shallowRef, defineAsy
 import * as Misskey from 'misskey-js';
 import { utils } from '@syuilo/aiscript';
 import { compareVersions } from 'compare-versions';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import type { Ref } from 'vue';
 import type { AsUiComponent, AsUiRoot } from '@/aiscript/ui.js';
 import type { MenuItem } from '@/types/menu.js';
@@ -129,7 +129,7 @@ function share(ev: PointerEvent) {
 function copyLink() {
 	if (!flash.value) return;
 
-	copyToClipboard(`${url}/play/${flash.value.id}`);
+	copyToClipboard(`${webUrl}/play/${flash.value.id}`);
 }
 
 function shareWithNavigator() {
@@ -138,7 +138,7 @@ function shareWithNavigator() {
 	navigator.share({
 		title: flash.value.title,
 		text: flash.value.summary,
-		url: `${url}/play/${flash.value.id}`,
+		url: `${webUrl}/play/${flash.value.id}`,
 	});
 }
 
@@ -146,7 +146,7 @@ function shareWithNote() {
 	if (!flash.value) return;
 
 	os.post({
-		initialText: `${flash.value.title}\n${url}/play/${flash.value.id}`,
+		initialText: `${flash.value.title}\n${webUrl}/play/${flash.value.id}`,
 		instant: true,
 	});
 }
@@ -226,7 +226,7 @@ async function run() {
 			root.value = _root.value;
 		}),
 		THIS_ID: values.STR(flash.value.id),
-		THIS_URL: values.STR(`${url}/play/${flash.value.id}`),
+		THIS_URL: values.STR(`${webUrl}/play/${flash.value.id}`),
 	}, {
 		in: aiScriptReadline,
 		out: () => {
@@ -263,7 +263,7 @@ async function run() {
 async function reportAbuse() {
 	if (!flash.value) return;
 
-	const pageUrl = `${url}/play/${flash.value.id}`;
+	const pageUrl = `${webUrl}/play/${flash.value.id}`;
 
 	const { dispose } = await os.popupAsyncWithDialog(import('@/components/MkAbuseReportWindow.vue').then(x => x.default), {
 		user: flash.value.user,
diff --git a/packages/frontend/src/pages/gallery/post.vue b/packages/frontend/src/pages/gallery/post.vue
index 92cb663ee1..263cb4a338 100644
--- a/packages/frontend/src/pages/gallery/post.vue
+++ b/packages/frontend/src/pages/gallery/post.vue
@@ -64,7 +64,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { computed, watch, ref, defineAsyncComponent, markRaw } from 'vue';
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import type { MenuItem } from '@/types/menu.js';
 import MkButton from '@/components/MkButton.vue';
 import * as os from '@/os.js';
@@ -110,7 +110,7 @@ function fetchPost() {
 
 function copyLink() {
 	if (!post.value) return;
-	copyToClipboard(`${url}/gallery/${post.value.id}`);
+	copyToClipboard(`${webUrl}/gallery/${post.value.id}`);
 }
 
 function share() {
@@ -118,14 +118,14 @@ function share() {
 	navigator.share({
 		title: post.value.title,
 		text: post.value.description ?? undefined,
-		url: `${url}/gallery/${post.value.id}`,
+		url: `${webUrl}/gallery/${post.value.id}`,
 	});
 }
 
 function shareWithNote() {
 	if (!post.value) return;
 	os.post({
-		initialText: `${post.value.title} ${url}/gallery/${post.value.id}`,
+		initialText: `${post.value.title} ${webUrl}/gallery/${post.value.id}`,
 	});
 }
 
@@ -165,7 +165,7 @@ function edit() {
 async function reportAbuse() {
 	if (!post.value) return;
 
-	const pageUrl = `${url}/gallery/${post.value.id}`;
+	const pageUrl = `${webUrl}/gallery/${post.value.id}`;
 
 	const { dispose } = await os.popupAsyncWithDialog(import('@/components/MkAbuseReportWindow.vue').then(x => x.default), {
 		user: post.value.user,
diff --git a/packages/frontend/src/pages/note.vue b/packages/frontend/src/pages/note.vue
index 2bbd7b2511..263ac1004e 100644
--- a/packages/frontend/src/pages/note.vue
+++ b/packages/frontend/src/pages/note.vue
@@ -47,7 +47,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { computed, watch, ref, markRaw } from 'vue';
 import * as Misskey from 'misskey-js';
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import MkNoteDetailed from '@/components/MkNoteDetailed.vue';
 import MkNotesTimeline from '@/components/MkNotesTimeline.vue';
 import MkRemoteCaution from '@/components/MkRemoteCaution.vue';
@@ -142,7 +142,7 @@ function fetchNote() {
 				message: err.id === 'fbcc002d-37d9-4944-a6b0-d9e29f2d33ab' ? i18n.ts.thisContentsAreMarkedAsSigninRequiredByAuthor : i18n.ts.signinOrContinueOnRemote,
 				openOnRemote: {
 					type: 'lookup',
-					url: `https://${host}/notes/${props.noteId}`,
+					url: `https://${webHost}/notes/${props.noteId}`,
 				},
 			});
 		}
diff --git a/packages/frontend/src/pages/page-editor/page-editor.vue b/packages/frontend/src/pages/page-editor/page-editor.vue
index 85871c993c..046394a7e8 100644
--- a/packages/frontend/src/pages/page-editor/page-editor.vue
+++ b/packages/frontend/src/pages/page-editor/page-editor.vue
@@ -24,7 +24,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				</MkInput>
 
 				<MkInput v-model="name">
-					<template #prefix>{{ url }}/@{{ author?.username ?? '???' }}/pages/</template>
+					<template #prefix>{{ webUrl }}/@{{ author?.username ?? '???' }}/pages/</template>
 					<template #label>{{ i18n.ts._pages.url }}</template>
 				</MkInput>
 
@@ -60,7 +60,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { computed, provide, watch, ref } from 'vue';
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import XBlocks from './page-editor.blocks.vue';
 import { genId } from '@/utility/id.js';
 import MkButton from '@/components/MkButton.vue';
diff --git a/packages/frontend/src/pages/page.vue b/packages/frontend/src/pages/page.vue
index 212c8140c8..9364c349b0 100644
--- a/packages/frontend/src/pages/page.vue
+++ b/packages/frontend/src/pages/page.vue
@@ -99,7 +99,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { computed, watch, ref, defineAsyncComponent, markRaw } from 'vue';
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import type { MenuItem } from '@/types/menu.js';
 import XPage from '@/components/page/page.vue';
 import MkButton from '@/components/MkButton.vue';
@@ -188,14 +188,14 @@ function share(ev: PointerEvent) {
 function copyLink() {
 	if (!page.value) return;
 
-	copyToClipboard(`${url}/@${page.value.user.username}/pages/${page.value.name}`);
+	copyToClipboard(`${webUrl}/@${page.value.user.username}/pages/${page.value.name}`);
 }
 
 function shareWithNote() {
 	if (!page.value) return;
 
 	os.post({
-		initialText: `${page.value.title || page.value.name}\n${url}/@${page.value.user.username}/pages/${page.value.name}`,
+		initialText: `${page.value.title || page.value.name}\n${webUrl}/@${page.value.user.username}/pages/${page.value.name}`,
 		instant: true,
 	});
 }
@@ -206,7 +206,7 @@ function shareWithNavigator() {
 	navigator.share({
 		title: page.value.title ?? page.value.name,
 		text: page.value.summary ?? undefined,
-		url: `${url}/@${page.value.user.username}/pages/${page.value.name}`,
+		url: `${webUrl}/@${page.value.user.username}/pages/${page.value.name}`,
 	});
 }
 
@@ -248,7 +248,7 @@ function pin(pin: boolean) {
 async function reportAbuse() {
 	if (!page.value) return;
 
-	const pageUrl = `${url}/@${props.username}/pages/${props.pageName}`;
+	const pageUrl = `${webUrl}/@${props.username}/pages/${props.pageName}`;
 
 	const { dispose } = await os.popupAsyncWithDialog(import('@/components/MkAbuseReportWindow.vue').then(x => x.default), {
 		user: page.value.user,
diff --git a/packages/frontend/src/pages/qr.show.vue b/packages/frontend/src/pages/qr.show.vue
index 28f80e0963..be5793a13f 100644
--- a/packages/frontend/src/pages/qr.show.vue
+++ b/packages/frontend/src/pages/qr.show.vue
@@ -29,7 +29,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 import tinycolor from 'tinycolor2';
 import QRCodeStyling from 'qr-code-styling';
 import { computed, ref, shallowRef, watch, onMounted, onUnmounted, useTemplateRef } from 'vue';
-import { url, host } from '@@/js/config.js';
+import { webUrl, localHost } from '@@/js/config.js';
 import type { Directive } from 'vue';
 import { instance } from '@/instance.js';
 import { ensureSignin } from '@/i.js';
@@ -40,7 +40,7 @@ import { i18n } from '@/i18n.js';
 
 const $i = ensureSignin();
 
-const acct = computed(() => `@${$i.username}@${host}`);
+const acct = computed(() => `@${$i.username}@${localHost}`);
 const userProfileUrl = computed(() => userPage($i, undefined, true));
 const shareData = computed(() => ({
 	title: i18n.tsx._qr.shareTitle({ name: userName($i), acct: acct.value }),
@@ -64,7 +64,7 @@ const qrCodeInstance = new QRCodeStyling({
 	height: 600,
 	margin: 42,
 	type: 'canvas',
-	data: `${url}/users/${$i.id}`,
+	data: `${webUrl}/users/${$i.id}`,
 	image: instance.iconUrl ? getStaticImageUrl(instance.iconUrl) : '/favicon.ico',
 	qrOptions: {
 		typeNumber: 0,
diff --git a/packages/frontend/src/pages/reversi/game.board.vue b/packages/frontend/src/pages/reversi/game.board.vue
index 5988604652..ca8cb5193d 100644
--- a/packages/frontend/src/pages/reversi/game.board.vue
+++ b/packages/frontend/src/pages/reversi/game.board.vue
@@ -146,7 +146,7 @@ import { computed, onActivated, onDeactivated, onMounted, onUnmounted, ref, shal
 import * as Misskey from 'misskey-js';
 import * as Reversi from 'misskey-reversi';
 import { useInterval } from '@@/js/use-interval.js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import MkButton from '@/components/MkButton.vue';
 import MkFolder from '@/components/MkFolder.vue';
 import MkSwitch from '@/components/MkSwitch.vue';
@@ -445,7 +445,7 @@ function autoplay() {
 
 function share() {
 	os.post({
-		initialText: `#MisskeyReversi\n${url}/reversi/g/${game.value.id}`,
+		initialText: `#MisskeyReversi\n${webUrl}/reversi/g/${game.value.id}`,
 		instant: true,
 	});
 }
diff --git a/packages/frontend/src/pages/reversi/game.vue b/packages/frontend/src/pages/reversi/game.vue
index 926d825b66..c71a461993 100644
--- a/packages/frontend/src/pages/reversi/game.vue
+++ b/packages/frontend/src/pages/reversi/game.vue
@@ -20,7 +20,7 @@ import { useStream } from '@/stream.js';
 import { $i } from '@/i.js';
 import { useRouter } from '@/router.js';
 import * as os from '@/os.js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { i18n } from '@/i18n.js';
 import { useInterval } from '@@/js/use-interval.js';
 
@@ -43,7 +43,7 @@ function start(_game: Misskey.entities.ReversiGameDetailed) {
 
 	if (shareWhenStart.value) {
 		misskeyApi('notes/create', {
-			text: `${i18n.ts._reversi.iStartedAGame}\n${url}/reversi/g/${props.gameId}`,
+			text: `${i18n.ts._reversi.iStartedAGame}\n${webUrl}/reversi/g/${props.gameId}`,
 			visibility: 'home',
 		});
 	}
diff --git a/packages/frontend/src/pages/search.note.vue b/packages/frontend/src/pages/search.note.vue
index ab36f2e6c5..cb6fc81f52 100644
--- a/packages/frontend/src/pages/search.note.vue
+++ b/packages/frontend/src/pages/search.note.vue
@@ -110,7 +110,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { computed, markRaw, ref, shallowRef, toRef } from 'vue';
-import { host as localHost } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import type * as Misskey from 'misskey-js';
 import { $i } from '@/i.js';
 import { i18n } from '@/i18n.js';
@@ -208,7 +208,7 @@ type SearchParams = {
 };
 
 const fixHostIfLocal = (target: string | null | undefined) => {
-	if (!target || target === localHost) return '.';
+	if (!target || target === webHost) return '.';
 	return target;
 };
 
diff --git a/packages/frontend/src/pages/settings/2fa.qrdialog.vue b/packages/frontend/src/pages/settings/2fa.qrdialog.vue
index 780040f699..884bad36b8 100644
--- a/packages/frontend/src/pages/settings/2fa.qrdialog.vue
+++ b/packages/frontend/src/pages/settings/2fa.qrdialog.vue
@@ -106,7 +106,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { hostname, port } from '@@/js/config';
+import { localHostname, port } from '@@/js/config';
 import { useTemplateRef, ref } from 'vue';
 import MkButton from '@/components/MkButton.vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';
@@ -162,7 +162,7 @@ function downloadBackupCodes() {
 		const txtBlob = new Blob([backupCodes.value.join('\n')], { type: 'text/plain' });
 		const dummya = window.document.createElement('a');
 		dummya.href = URL.createObjectURL(txtBlob);
-		dummya.download = `${$i.username}@${hostname}` + (port !== '' ? `_${port}` : '') + '-2fa-backup-codes.txt';
+		dummya.download = `${$i.username}@${localHostname}` + (port !== '' ? `_${port}` : '') + '-2fa-backup-codes.txt';
 		dummya.click();
 	}
 }
diff --git a/packages/frontend/src/pages/theme-editor.vue b/packages/frontend/src/pages/theme-editor.vue
index 2d2b8ed292..b2a13fe4f8 100644
--- a/packages/frontend/src/pages/theme-editor.vue
+++ b/packages/frontend/src/pages/theme-editor.vue
@@ -78,7 +78,7 @@ import tinycolor from 'tinycolor2';
 import JSON5 from 'json5';
 import lightTheme from '@@/themes/_light.json5';
 import darkTheme from '@@/themes/_dark.json5';
-import { host } from '@@/js/config.js';
+import { localHost } from '@@/js/config.js';
 import type { Theme } from '@/theme.js';
 import { genId } from '@/utility/id.js';
 import MkButton from '@/components/MkButton.vue';
diff --git a/packages/frontend/src/pages/welcome.setup.vue b/packages/frontend/src/pages/welcome.setup.vue
index 3a4a558605..61e9420fb1 100644
--- a/packages/frontend/src/pages/welcome.setup.vue
+++ b/packages/frontend/src/pages/welcome.setup.vue
@@ -60,7 +60,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 					<MkInput v-model="username" pattern="^[a-zA-Z0-9_]{1,20}$" :spellcheck="false" required data-cy-admin-username>
 						<template #label>{{ i18n.ts.username }} <div v-tooltip:dialog="i18n.ts.usernameInfo" class="_button _help"><i class="ti ti-help-circle"></i></div></template>
 						<template #prefix>@</template>
-						<template #suffix>@{{ host }}</template>
+						<template #suffix>@{{ localHost }}</template>
 					</MkInput>
 					<MkInput v-model="password" type="password" data-cy-admin-password>
 						<template #label>{{ i18n.ts.password }}</template>
@@ -125,7 +125,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { ref } from 'vue';
-import { host, version } from '@@/js/config.js';
+import { localHost, version } from '@@/js/config.js';
 import MkButton from '@/components/MkButton.vue';
 import MkInput from '@/components/MkInput.vue';
 import * as os from '@/os.js';