split url into webUrl and localUrl (like mastodon)

137 files changed, 377 insertions, 345 deletions

diff --git a/packages/backend/src/GlobalModule.ts b/packages/backend/src/GlobalModule.ts
index 435bd8dd45..eaaaf1e284 100644
--- a/packages/backend/src/GlobalModule.ts
+++ b/packages/backend/src/GlobalModule.ts
@@ -75,7 +75,7 @@ const $redisForSub: Provider = {
 	provide: DI.redisForSub,
 	useFactory: (config: Config) => {
 		const redis = new Redis.Redis(config.redisForPubsub);
-		redis.subscribe(config.host);
+		redis.subscribe(config.webHost);
 		return redis;
 	},
 	inject: [DI.config],
diff --git a/packages/backend/src/boot/master.ts b/packages/backend/src/boot/master.ts
index 041f58e509..94a3fe2aff 100644
--- a/packages/backend/src/boot/master.ts
+++ b/packages/backend/src/boot/master.ts
@@ -120,7 +120,7 @@ export async function masterMain() {
 	if (envOption.onlyQueue) {
 		bootLogger.succ('Queue started', null, true);
 	} else {
-		bootLogger.succ(config.socket ? `Now listening on socket ${config.socket} on ${config.url}` : `Now listening on port ${config.port} on ${config.url}`, null, true);
+		bootLogger.succ(config.socket ? `Now listening on socket ${config.socket} on ${config.webUrl}` : `Now listening on port ${config.port} on ${config.webUrl}`, null, true);
 	}
 }
 
diff --git a/packages/backend/src/config.ts b/packages/backend/src/config.ts
index 4cd82bed87..8dafe91d26 100644
--- a/packages/backend/src/config.ts
+++ b/packages/backend/src/config.ts
@@ -26,6 +26,8 @@ type RedisOptionsSource = Partial<RedisOptions> & {
  */
 type Source = {
 	url?: string;
+	localUrl?: string;
+	webUrl?: string;
 	port?: number;
 	socket?: string;
 	trustProxy?: FastifyServerOptions['trustProxy'];
@@ -118,7 +120,8 @@ type Source = {
 };
 
 export type Config = {
-	url: string;
+	localUrl: string;
+	webUrl: string;
 	port: number;
 	socket: string | undefined;
 	trustProxy: NonNullable<FastifyServerOptions['trustProxy']>;
@@ -180,8 +183,10 @@ export type Config = {
 	version: string;
 	publishTarballInsteadOfProvideRepositoryUrl: boolean;
 	setupPassword: string | undefined;
-	host: string;
-	hostname: string;
+	localHost: string;
+	localHostname: string;
+	webHost: string;
+	webHostname: string;
 	scheme: string;
 	wsScheme: string;
 	apiUrl: string;
@@ -259,11 +264,14 @@ export function loadConfig(): Config {
 
 	const config = JSON.parse(fs.readFileSync(compiledConfigFilePath, 'utf-8')) as Source;
 
-	const url = tryCreateUrl(config.url ?? process.env.MISSKEY_URL ?? '');
+	const localUrl = tryCreateUrl(config.url ?? config.localUrl ?? process.env.MISSKEY_URL ?? '');
+	const webUrl = tryCreateUrl(config.webUrl ?? process.env.MISSKEY_WEB_URL ?? localUrl ?? '');
 	const version = meta.version;
-	const host = url.host;
-	const hostname = url.hostname;
-	const scheme = url.protocol.replace(/:$/, '');
+	const localHost = localUrl.host;
+	const localHostname = localUrl.hostname;
+	const webHost = webUrl.host;
+	const webHostname = webUrl.hostname;
+	const scheme = webUrl.protocol.replace(/:$/, '');
 	const wsScheme = scheme.replace('http', 'ws');
 
 	const dbDb = config.db.db ?? process.env.DATABASE_DB ?? '';
@@ -273,14 +281,15 @@ export function loadConfig(): Config {
 	const externalMediaProxy = config.mediaProxy ?
 		config.mediaProxy.endsWith('/') ? config.mediaProxy.substring(0, config.mediaProxy.length - 1) : config.mediaProxy
 		: null;
-	const internalMediaProxy = `${scheme}://${host}/proxy`;
-	const redis = convertRedisOptions(config.redis, host);
+	const internalMediaProxy = `${scheme}://${webHost}/proxy`;
+	const redis = convertRedisOptions(config.redis, localHost);
 
 	return {
 		version,
 		publishTarballInsteadOfProvideRepositoryUrl: !!config.publishTarballInsteadOfProvideRepositoryUrl,
 		setupPassword: config.setupPassword,
-		url: url.origin,
+		localUrl: localUrl.origin,
+		webUrl: webUrl.origin,
 		port: config.port ?? parseInt(process.env.PORT ?? '', 10),
 		socket: config.socket,
 		trustProxy: config.trustProxy ?? [
@@ -294,24 +303,26 @@ export function loadConfig(): Config {
 		chmodSocket: config.chmodSocket,
 		disableHsts: config.disableHsts,
 		enableIpRateLimit: config.enableIpRateLimit ?? true,
-		host,
-		hostname,
+		localHost,
+		localHostname,
+		webHost,
+		webHostname,
 		scheme,
 		wsScheme,
-		wsUrl: `${wsScheme}://${host}`,
-		apiUrl: `${scheme}://${host}/api`,
-		authUrl: `${scheme}://${host}/auth`,
-		driveUrl: `${scheme}://${host}/files`,
+		wsUrl: `${wsScheme}://${webHost}`,
+		apiUrl: `${scheme}://${webHost}/api`,
+		authUrl: `${scheme}://${webHost}/auth`,
+		driveUrl: `${scheme}://${webHost}/files`,
 		db: { ...config.db, db: dbDb, user: dbUser, pass: dbPass },
 		dbReplications: config.dbReplications,
 		dbSlaves: config.dbSlaves,
 		fulltextSearch: config.fulltextSearch,
 		meilisearch: config.meilisearch,
 		redis,
-		redisForPubsub: config.redisForPubsub ? convertRedisOptions(config.redisForPubsub, host) : redis,
-		redisForJobQueue: config.redisForJobQueue ? convertRedisOptions(config.redisForJobQueue, host) : redis,
-		redisForTimelines: config.redisForTimelines ? convertRedisOptions(config.redisForTimelines, host) : redis,
-		redisForReactions: config.redisForReactions ? convertRedisOptions(config.redisForReactions, host) : redis,
+		redisForPubsub: config.redisForPubsub ? convertRedisOptions(config.redisForPubsub, webHost) : redis,
+		redisForJobQueue: config.redisForJobQueue ? convertRedisOptions(config.redisForJobQueue, webHost) : redis,
+		redisForTimelines: config.redisForTimelines ? convertRedisOptions(config.redisForTimelines, webHost) : redis,
+		redisForReactions: config.redisForReactions ? convertRedisOptions(config.redisForReactions, webHost) : redis,
 		sentryForBackend: config.sentryForBackend,
 		sentryForFrontend: config.sentryForFrontend,
 		id: config.id,
@@ -336,7 +347,7 @@ export function loadConfig(): Config {
 		videoThumbnailGenerator: config.videoThumbnailGenerator ?
 			config.videoThumbnailGenerator.endsWith('/') ? config.videoThumbnailGenerator.substring(0, config.videoThumbnailGenerator.length - 1) : config.videoThumbnailGenerator
 			: null,
-		userAgent: `Misskey/${version} (${config.url})`,
+		userAgent: `Misskey/${version} (${config.localUrl})`,
 		frontendEntry: frontendManifest['src/_boot_.ts'],
 		frontendManifestExists: frontendManifestExists,
 		frontendEmbedEntry: frontendEmbedManifest['src/boot.ts'],
diff --git a/packages/backend/src/core/ChatService.ts b/packages/backend/src/core/ChatService.ts
index 5cd336a097..b1a79090aa 100644
--- a/packages/backend/src/core/ChatService.ts
+++ b/packages/backend/src/core/ChatService.ts
@@ -379,7 +379,7 @@ export class ChatService {
 			if (this.userEntityService.isLocalUser(toUser)) this.globalEventService.publishChatUserStream(message.toUserId, message.fromUserId, 'deleted', message.id);
 
 			if (this.userEntityService.isLocalUser(fromUser) && this.userEntityService.isRemoteUser(toUser)) {
-				//const activity = this.apRendererService.addContext(this.apRendererService.renderDelete(this.apRendererService.renderTombstone(`${this.config.url}/notes/${message.id}`), fromUser));
+				//const activity = this.apRendererService.addContext(this.apRendererService.renderDelete(this.apRendererService.renderTombstone(`${this.config.webUrl}/notes/${message.id}`), fromUser));
 				//this.queueService.deliver(fromUser, activity, toUser.inbox);
 			}
 		} else if (message.toRoomId) {
diff --git a/packages/backend/src/core/EmailService.ts b/packages/backend/src/core/EmailService.ts
index 384704b252..eb5490101b 100644
--- a/packages/backend/src/core/EmailService.ts
+++ b/packages/backend/src/core/EmailService.ts
@@ -42,8 +42,8 @@ export class EmailService {
 	public async sendEmail(to: string, subject: string, html: string, text: string) {
 		if (!this.meta.enableEmail) return;
 
-		const iconUrl = `${this.config.url}/static-assets/mi-white.png`;
-		const emailSettingUrl = `${this.config.url}/settings/email`;
+		const iconUrl = `${this.config.webUrl}/static-assets/mi-white.png`;
+		const emailSettingUrl = `${this.config.webUrl}/settings/email`;
 
 		const enableAuth = this.meta.smtpUser != null && this.meta.smtpUser !== '';
 
@@ -135,7 +135,7 @@ export class EmailService {
 			</footer>
 		</main>
 		<nav>
-			<a href="${ this.config.url }">${ this.config.host }</a>
+			<a href="${ this.config.webUrl }">${ this.config.webHost }</a>
 		</nav>
 	</body>
 </html>`;
diff --git a/packages/backend/src/core/GlobalEventService.ts b/packages/backend/src/core/GlobalEventService.ts
index da5982abf6..a6d6baf2cb 100644
--- a/packages/backend/src/core/GlobalEventService.ts
+++ b/packages/backend/src/core/GlobalEventService.ts
@@ -351,7 +351,7 @@ export class GlobalEventService {
 			{ type: type, body: null } :
 			{ type: type, body: value };
 
-		this.redisForPub.publish(this.config.host, JSON.stringify({
+		this.redisForPub.publish(this.config.webHost, JSON.stringify({
 			channel: channel,
 			message: message,
 		}));
diff --git a/packages/backend/src/core/InternalStorageService.ts b/packages/backend/src/core/InternalStorageService.ts
index 4fb8a93e49..f189d55d11 100644
--- a/packages/backend/src/core/InternalStorageService.ts
+++ b/packages/backend/src/core/InternalStorageService.ts
@@ -39,14 +39,14 @@ export class InternalStorageService {
 	public saveFromPath(key: string, srcPath: string) {
 		fs.mkdirSync(path, { recursive: true });
 		fs.copyFileSync(srcPath, this.resolvePath(key));
-		return `${this.config.url}/files/${key}`;
+		return `${this.config.webUrl}/files/${key}`;
 	}
 
 	@bindThis
 	public saveFromBuffer(key: string, data: Buffer) {
 		fs.mkdirSync(path, { recursive: true });
 		fs.writeFileSync(this.resolvePath(key), data);
-		return `${this.config.url}/files/${key}`;
+		return `${this.config.webUrl}/files/${key}`;
 	}
 
 	@bindThis
diff --git a/packages/backend/src/core/MfmService.ts b/packages/backend/src/core/MfmService.ts
index 274966d921..b633839de8 100644
--- a/packages/backend/src/core/MfmService.ts
+++ b/packages/backend/src/core/MfmService.ts
@@ -357,7 +357,7 @@ export class MfmService {
 			},
 
 			hashtag: (node) => {
-				return `<a href="${escapeHtml(`${this.config.url}/tags/${encodeURIComponent(node.props.hashtag)}`)}" rel="tag">#${escapeHtml(node.props.hashtag)}</a>`;
+				return `<a href="${escapeHtml(`${this.config.webUrl}/tags/${encodeURIComponent(node.props.hashtag)}`)}" rel="tag">#${escapeHtml(node.props.hashtag)}</a>`;
 			},
 
 			inlineCode: (node) => {
@@ -386,7 +386,7 @@ export class MfmService {
 				const remoteUserInfo = mentionedRemoteUsers.find(remoteUser => remoteUser.username.toLowerCase() === username.toLowerCase() && remoteUser.host?.toLowerCase() === host?.toLowerCase());
 				const href = remoteUserInfo
 					? (remoteUserInfo.url ? remoteUserInfo.url : remoteUserInfo.uri)
-					: `${this.config.url}/${acct.endsWith(`@${this.config.url}`) ? acct.substring(0, acct.length - this.config.url.length - 1) : acct}`;
+					: `${this.config.webUrl}/${acct.endsWith(`@${this.config.localUrl}`) ? acct.substring(0, acct.length - this.config.localUrl.length - 1) : acct}`;
 				try {
 					const url = new URL(href);
 					return `<a href="${escapeHtml(url.href)}" class="u-url mention">${escapeHtml(acct)}</a>`;
diff --git a/packages/backend/src/core/NoteCreateService.ts b/packages/backend/src/core/NoteCreateService.ts
index 748f2cbad9..7fb5515959 100644
--- a/packages/backend/src/core/NoteCreateService.ts
+++ b/packages/backend/src/core/NoteCreateService.ts
@@ -950,7 +950,7 @@ export class NoteCreateService implements OnApplicationShutdown {
 		if (data.localOnly) return null;
 
 		const content = this.isRenote(data) && !this.isQuote(data)
-			? this.apRendererService.renderAnnounce(data.renote.uri ? data.renote.uri : `${this.config.url}/notes/${data.renote.id}`, note)
+			? this.apRendererService.renderAnnounce(data.renote.uri ? data.renote.uri : `${this.config.webUrl}/notes/${data.renote.id}`, note)
 			: this.apRendererService.renderCreate(await this.apRendererService.renderNote(note, false), note);
 
 		return this.apRendererService.addContext(content);
diff --git a/packages/backend/src/core/NoteDeleteService.ts b/packages/backend/src/core/NoteDeleteService.ts
index af1f0eda9a..dee115b548 100644
--- a/packages/backend/src/core/NoteDeleteService.ts
+++ b/packages/backend/src/core/NoteDeleteService.ts
@@ -84,8 +84,8 @@ export class NoteDeleteService {
 				}
 
 				const content = this.apRendererService.addContext(renote
-					? this.apRendererService.renderUndo(this.apRendererService.renderAnnounce(renote.uri ?? `${this.config.url}/notes/${renote.id}`, note), user)
-					: this.apRendererService.renderDelete(this.apRendererService.renderTombstone(`${this.config.url}/notes/${note.id}`), user));
+					? this.apRendererService.renderUndo(this.apRendererService.renderAnnounce(renote.uri ?? `${this.config.webUrl}/notes/${renote.id}`, note), user)
+					: this.apRendererService.renderDelete(this.apRendererService.renderTombstone(`${this.config.webUrl}/notes/${note.id}`), user));
 
 				this.deliverToConcerned(user, note, content);
 			}
diff --git a/packages/backend/src/core/NotePiningService.ts b/packages/backend/src/core/NotePiningService.ts
index d38b48b65d..3665dd5f03 100644
--- a/packages/backend/src/core/NotePiningService.ts
+++ b/packages/backend/src/core/NotePiningService.ts
@@ -117,8 +117,8 @@ export class NotePiningService {
 
 		if (!this.userEntityService.isLocalUser(user)) return;
 
-		const target = `${this.config.url}/users/${user.id}/collections/featured`;
-		const item = `${this.config.url}/notes/${noteId}`;
+		const target = `${this.config.webUrl}/users/${user.id}/collections/featured`;
+		const item = `${this.config.webUrl}/notes/${noteId}`;
 		const content = this.apRendererService.addContext(isAddition ? this.apRendererService.renderAdd(user, target, item) : this.apRendererService.renderRemove(user, target, item));
 
 		this.apDeliverManagerService.deliverToFollowers(user, content);
diff --git a/packages/backend/src/core/PushNotificationService.ts b/packages/backend/src/core/PushNotificationService.ts
index 9333c1ebc5..e9ded5f282 100644
--- a/packages/backend/src/core/PushNotificationService.ts
+++ b/packages/backend/src/core/PushNotificationService.ts
@@ -77,7 +77,7 @@ export class PushNotificationService implements OnApplicationShutdown {
 		if (!this.meta.enableServiceWorker || this.meta.swPublicKey == null || this.meta.swPrivateKey == null) return;
 
 		// アプリケーションの連絡先と、サーバーサイドの鍵ペアの情報を登録
-		push.setVapidDetails(this.config.url,
+		push.setVapidDetails(this.config.webUrl,
 			this.meta.swPublicKey,
 			this.meta.swPrivateKey);
 
diff --git a/packages/backend/src/core/RemoteUserResolveService.ts b/packages/backend/src/core/RemoteUserResolveService.ts
index a2f1b73cdb..55c03e9777 100644
--- a/packages/backend/src/core/RemoteUserResolveService.ts
+++ b/packages/backend/src/core/RemoteUserResolveService.ts
@@ -56,7 +56,7 @@ export class RemoteUserResolveService {
 
 		host = this.utilityService.toPuny(host);
 
-		if (host === this.utilityService.toPuny(this.config.host)) {
+		if (host === this.utilityService.toPuny(this.config.localHost)) {
 			this.logger.info(`return local user: ${usernameLower}`);
 			return await this.usersRepository.findOneBy({ usernameLower, host: IsNull() }).then(u => {
 				if (u == null) {
diff --git a/packages/backend/src/core/UserFollowingService.ts b/packages/backend/src/core/UserFollowingService.ts
index e7a6be99fb..9d2ab73fe8 100644
--- a/packages/backend/src/core/UserFollowingService.ts
+++ b/packages/backend/src/core/UserFollowingService.ts
@@ -536,7 +536,7 @@ export class UserFollowingService implements OnModuleInit {
 		}
 
 		if (this.userEntityService.isLocalUser(follower) && this.userEntityService.isRemoteUser(followee)) {
-			const content = this.apRendererService.addContext(this.apRendererService.renderFollow(follower as MiPartialLocalUser, followee as MiPartialRemoteUser, requestId ?? `${this.config.url}/follows/${followRequest.id}`));
+			const content = this.apRendererService.addContext(this.apRendererService.renderFollow(follower as MiPartialLocalUser, followee as MiPartialRemoteUser, requestId ?? `${this.config.webUrl}/follows/${followRequest.id}`));
 			this.queueService.deliver(follower, content, followee.inbox, false);
 		}
 	}
diff --git a/packages/backend/src/core/UserSearchService.ts b/packages/backend/src/core/UserSearchService.ts
index 4be7bd9bdb..15245c39b7 100644
--- a/packages/backend/src/core/UserSearchService.ts
+++ b/packages/backend/src/core/UserSearchService.ts
@@ -198,7 +198,7 @@ export class UserSearchService {
 		}
 
 		if (params.host) {
-			if (params.host === this.config.hostname || params.host === '.') {
+			if (params.host === this.config.localHostname || params.host === '.') {
 				userQuery.andWhere('user.host IS NULL');
 			} else {
 				userQuery.andWhere('user.host LIKE :host', {
diff --git a/packages/backend/src/core/UtilityService.ts b/packages/backend/src/core/UtilityService.ts
index e3ceebccae..38390d0a2c 100644
--- a/packages/backend/src/core/UtilityService.ts
+++ b/packages/backend/src/core/UtilityService.ts
@@ -26,18 +26,20 @@ export class UtilityService {
 
 	@bindThis
 	public getFullApAccount(username: string, host: string | null): string {
-		return host ? `${username}@${this.toPuny(host)}` : `${username}@${this.toPuny(this.config.host)}`;
+		return host ? `${username}@${this.toPuny(host)}` : `${username}@${this.toPuny(this.config.localHost)}`;
 	}
 
 	@bindThis
 	public isSelfHost(host: string | null): boolean {
 		if (host == null) return true;
-		return this.toPuny(this.config.host) === this.toPuny(host);
+		return (this.toPuny(this.config.localHost) === this.toPuny(host)) ||
+			(this.toPuny(this.config.webHost) === this.toPuny(host))
 	}
 
 	@bindThis
 	public isUriLocal(uri: string): boolean {
-		return this.punyHost(uri) === this.toPuny(this.config.host);
+		return (this.punyHost(uri) === this.toPuny(this.config.localHost)) ||
+			(this.punyHost(uri) === this.toPuny(this.config.webHost))
 	}
 
 	// メールアドレスのバリデーションを行う
diff --git a/packages/backend/src/core/WebAuthnService.ts b/packages/backend/src/core/WebAuthnService.ts
index 31c8d67c60..f0dc9dc104 100644
--- a/packages/backend/src/core/WebAuthnService.ts
+++ b/packages/backend/src/core/WebAuthnService.ts
@@ -46,9 +46,9 @@ export class WebAuthnService {
 	@bindThis
 	public getRelyingParty(): { origin: string; rpId: string; rpName: string; rpIcon?: string; } {
 		return {
-			origin: this.config.url,
-			rpId: this.config.hostname,
-			rpName: this.meta.name ?? this.config.host,
+			origin: this.config.webUrl,
+			rpId: this.config.webHostname,
+			rpName: this.meta.name ?? this.config.webHost,
 			rpIcon: this.meta.iconUrl ?? undefined,
 		};
 	}
diff --git a/packages/backend/src/core/activitypub/ApDbResolverService.ts b/packages/backend/src/core/activitypub/ApDbResolverService.ts
index 5c16744a77..69933aaef6 100644
--- a/packages/backend/src/core/activitypub/ApDbResolverService.ts
+++ b/packages/backend/src/core/activitypub/ApDbResolverService.ts
@@ -65,9 +65,9 @@ export class ApDbResolverService implements OnApplicationShutdown {
 		const separator = '/';
 
 		const uri = new URL(getApId(value));
-		if (this.utilityService.toPuny(uri.host) !== this.utilityService.toPuny(this.config.host)) {
+		if ((this.utilityService.toPuny(uri.host) !== this.utilityService.toPuny(this.config.localHost)) &&
+				(this.utilityService.toPuny(uri.host) !== this.utilityService.toPuny(this.config.webHost)))
 			return { local: false, uri: uri.href };
-		}
 
 		const [, type, id, ...rest] = uri.pathname.split(separator);
 		return {
diff --git a/packages/backend/src/core/activitypub/ApInboxService.ts b/packages/backend/src/core/activitypub/ApInboxService.ts
index ff47ca930d..1173c4bcce 100644
--- a/packages/backend/src/core/activitypub/ApInboxService.ts
+++ b/packages/backend/src/core/activitypub/ApInboxService.ts
@@ -549,7 +549,7 @@ export class ApInboxService {
 		const uris = getApIds(activity.object);
 
 		const userIds = uris
-			.filter(uri => uri.startsWith(this.config.url + '/users/'))
+			.filter(uri => uri.startsWith(this.config.webUrl + '/users/'))
 			.map(uri => uri.split('/').at(-1))
 			.filter(x => x != null);
 		const users = await this.usersRepository.findBy({
diff --git a/packages/backend/src/core/activitypub/ApRendererService.ts b/packages/backend/src/core/activitypub/ApRendererService.ts
index 8c461b6031..d50d72d188 100644
--- a/packages/backend/src/core/activitypub/ApRendererService.ts
+++ b/packages/backend/src/core/activitypub/ApRendererService.ts
@@ -110,7 +110,7 @@ export class ApRendererService {
 		}
 
 		return {
-			id: `${this.config.url}/notes/${note.id}/activity`,
+			id: `${this.config.webUrl}/notes/${note.id}/activity`,
 			actor: this.userEntityService.genLocalUserUri(note.userId),
 			type: 'Announce',
 			published: this.idService.parse(note.id).date.toISOString(),
@@ -133,7 +133,7 @@ export class ApRendererService {
 
 		return {
 			type: 'Block',
-			id: `${this.config.url}/blocks/${block.id}`,
+			id: `${this.config.webUrl}/blocks/${block.id}`,
 			actor: this.userEntityService.genLocalUserUri(block.blockerId),
 			object: block.blockee.uri,
 		};
@@ -142,7 +142,7 @@ export class ApRendererService {
 	@bindThis
 	public renderCreate(object: IObject, note: MiNote): ICreate {
 		const activity: ICreate = {
-			id: `${this.config.url}/notes/${note.id}/activity`,
+			id: `${this.config.webUrl}/notes/${note.id}/activity`,
 			actor: this.userEntityService.genLocalUserUri(note.userId),
 			type: 'Create',
 			published: this.idService.parse(note.id).date.toISOString(),
@@ -179,7 +179,7 @@ export class ApRendererService {
 	@bindThis
 	public renderEmoji(emoji: MiEmoji): IApEmoji {
 		return {
-			id: `${this.config.url}/emojis/${emoji.name}`,
+			id: `${this.config.webUrl}/emojis/${emoji.name}`,
 			type: 'Emoji',
 			name: `:${emoji.name}:`,
 			updated: emoji.updatedAt != null ? emoji.updatedAt.toISOString() : new Date().toISOString(),
@@ -209,7 +209,7 @@ export class ApRendererService {
 	@bindThis
 	public renderFollowRelay(relay: MiRelay, relayActor: MiLocalUser): IFollow {
 		return {
-			id: `${this.config.url}/activities/follow-relay/${relay.id}`,
+			id: `${this.config.webUrl}/activities/follow-relay/${relay.id}`,
 			type: 'Follow',
 			actor: this.userEntityService.genLocalUserUri(relayActor.id),
 			object: 'https://www.w3.org/ns/activitystreams#Public',
@@ -233,7 +233,7 @@ export class ApRendererService {
 		requestId?: string,
 	): IFollow {
 		return {
-			id: requestId ?? `${this.config.url}/follows/${follower.id}/${followee.id}`,
+			id: requestId ?? `${this.config.webUrl}/follows/${follower.id}/${followee.id}`,
 			type: 'Follow',
 			actor: this.userEntityService.getUserUri(follower),
 			object: this.userEntityService.getUserUri(followee),
@@ -244,7 +244,7 @@ export class ApRendererService {
 	public renderHashtag(tag: string): IApHashtag {
 		return {
 			type: 'Hashtag',
-			href: `${this.config.url}/tags/${encodeURIComponent(tag)}`,
+			href: `${this.config.webUrl}/tags/${encodeURIComponent(tag)}`,
 			name: `#${tag}`,
 		};
 	}
@@ -294,7 +294,7 @@ export class ApRendererService {
 	@bindThis
 	public renderKey(user: MiLocalUser, key: MiUserKeypair, postfix?: string): IKey {
 		return {
-			id: `${this.config.url}/users/${user.id}${postfix ?? '/publickey'}`,
+			id: `${this.config.webUrl}/users/${user.id}${postfix ?? '/publickey'}`,
 			type: 'Key',
 			owner: this.userEntityService.genLocalUserUri(user.id),
 			publicKeyPem: createPublicKey(key.publicKey).export({
@@ -310,9 +310,9 @@ export class ApRendererService {
 
 		const object: ILike = {
 			type: 'Like',
-			id: `${this.config.url}/likes/${noteReaction.id}`,
-			actor: `${this.config.url}/users/${noteReaction.userId}`,
-			object: note.uri ? note.uri : `${this.config.url}/notes/${noteReaction.noteId}`,
+			id: `${this.config.webUrl}/likes/${noteReaction.id}`,
+			actor: `${this.config.webUrl}/users/${noteReaction.userId}`,
+			object: note.uri ? note.uri : `${this.config.webUrl}/notes/${noteReaction.noteId}`,
 			content: reaction,
 			_misskey_reaction: reaction,
 		};
@@ -344,7 +344,7 @@ export class ApRendererService {
 		const actor = this.userEntityService.getUserUri(src);
 		const target = this.userEntityService.getUserUri(dst);
 		return {
-			id: `${this.config.url}/moves/${src.id}/${dst.id}`,
+			id: `${this.config.webUrl}/moves/${src.id}/${dst.id}`,
 			actor,
 			type: 'Move',
 			object: actor,
@@ -376,7 +376,7 @@ export class ApRendererService {
 						if (dive) {
 							inReplyTo = await this.renderNote(inReplyToNote, false);
 						} else {
-							inReplyTo = `${this.config.url}/notes/${inReplyToNote.id}`;
+							inReplyTo = `${this.config.webUrl}/notes/${inReplyToNote.id}`;
 						}
 					}
 				}
@@ -391,7 +391,7 @@ export class ApRendererService {
 			const renote = await this.notesRepository.findOneBy({ id: note.renoteId });
 
 			if (renote) {
-				quote = renote.uri ? renote.uri : `${this.config.url}/notes/${renote.id}`;
+				quote = renote.uri ? renote.uri : `${this.config.webUrl}/notes/${renote.id}`;
 			}
 		}
 
@@ -467,7 +467,7 @@ export class ApRendererService {
 		} as const : {};
 
 		return {
-			id: `${this.config.url}/notes/${note.id}`,
+			id: `${this.config.webUrl}/notes/${note.id}`,
 			type: 'Note',
 			attributedTo,
 			summary: summary ?? undefined,
@@ -548,9 +548,9 @@ export class ApRendererService {
 			followers: `${id}/followers`,
 			following: `${id}/following`,
 			featured: `${id}/collections/featured`,
-			sharedInbox: `${this.config.url}/inbox`,
-			endpoints: { sharedInbox: `${this.config.url}/inbox` },
-			url: `${this.config.url}/@${user.username}`,
+			sharedInbox: `${this.config.webUrl}/inbox`,
+			endpoints: { sharedInbox: `${this.config.webUrl}/inbox` },
+			url: `${this.config.webUrl}/@${user.username}`,
 			preferredUsername: user.username,
 			name: user.name,
 			summary: profile.description ? this.mfmService.toHtml(mfm.parse(profile.description)) : null,
@@ -592,7 +592,7 @@ export class ApRendererService {
 	public renderQuestion(user: { id: MiUser['id'] }, note: MiNote, poll: MiPoll): IQuestion {
 		return {
 			type: 'Question',
-			id: `${this.config.url}/questions/${note.id}`,
+			id: `${this.config.webUrl}/questions/${note.id}`,
 			actor: this.userEntityService.genLocalUserUri(user.id),
 			content: note.text ?? '',
 			[poll.multiple ? 'anyOf' : 'oneOf']: poll.choices.map((text, i) => ({
@@ -649,7 +649,7 @@ export class ApRendererService {
 	@bindThis
 	public renderUpdate(object: string | IObject, user: { id: MiUser['id'] }): IUpdate {
 		return {
-			id: `${this.config.url}/users/${user.id}#updates/${new Date().getTime()}`,
+			id: `${this.config.webUrl}/users/${user.id}#updates/${new Date().getTime()}`,
 			actor: this.userEntityService.genLocalUserUri(user.id),
 			type: 'Update',
 			to: ['https://www.w3.org/ns/activitystreams#Public'],
@@ -661,13 +661,13 @@ export class ApRendererService {
 	@bindThis
 	public renderVote(user: { id: MiUser['id'] }, vote: MiPollVote, note: MiNote, poll: MiPoll, pollOwner: MiRemoteUser): ICreate {
 		return {
-			id: `${this.config.url}/users/${user.id}#votes/${vote.id}/activity`,
+			id: `${this.config.webUrl}/users/${user.id}#votes/${vote.id}/activity`,
 			actor: this.userEntityService.genLocalUserUri(user.id),
 			type: 'Create',
 			to: [pollOwner.uri],
 			published: new Date().toISOString(),
 			object: {
-				id: `${this.config.url}/users/${user.id}#votes/${vote.id}`,
+				id: `${this.config.webUrl}/users/${user.id}#votes/${vote.id}`,
 				type: 'Note',
 				attributedTo: this.userEntityService.genLocalUserUri(user.id),
 				to: [pollOwner.uri],
@@ -680,7 +680,7 @@ export class ApRendererService {
 	@bindThis
 	public addContext<T extends IObject>(x: T): T & { '@context': any; id: string; } {
 		if (typeof x === 'object' && x.id == null) {
-			x.id = `${this.config.url}/${randomUUID()}`;
+			x.id = `${this.config.webUrl}/${randomUUID()}`;
 		}
 
 		return Object.assign({ '@context': CONTEXT }, x as T & { id: string });
@@ -692,7 +692,7 @@ export class ApRendererService {
 
 		const jsonLd = this.jsonLdService.use();
 		jsonLd.debug = false;
-		activity = await jsonLd.signRsaSignature2017(activity, keypair.privateKey, `${this.config.url}/users/${user.id}#main-key`);
+		activity = await jsonLd.signRsaSignature2017(activity, keypair.privateKey, `${this.config.webUrl}/users/${user.id}#main-key`);
 
 		return activity;
 	}
diff --git a/packages/backend/src/core/activitypub/ApRequestService.ts b/packages/backend/src/core/activitypub/ApRequestService.ts
index d14b82dc92..df10d076cd 100644
--- a/packages/backend/src/core/activitypub/ApRequestService.ts
+++ b/packages/backend/src/core/activitypub/ApRequestService.ts
@@ -163,7 +163,7 @@ export class ApRequestService {
 		const req = ApRequestCreator.createSignedPost({
 			key: {
 				privateKeyPem: keypair.privateKey,
-				keyId: `${this.config.url}/users/${user.id}#main-key`,
+				keyId: `${this.config.webUrl}/users/${user.id}#main-key`,
 			},
 			url,
 			body,
@@ -192,7 +192,7 @@ export class ApRequestService {
 		const req = ApRequestCreator.createSignedGet({
 			key: {
 				privateKeyPem: keypair.privateKey,
-				keyId: `${this.config.url}/users/${user.id}#main-key`,
+				keyId: `${this.config.webUrl}/users/${user.id}#main-key`,
 			},
 			url,
 			additionalHeaders: {
diff --git a/packages/backend/src/core/activitypub/models/ApPersonService.ts b/packages/backend/src/core/activitypub/models/ApPersonService.ts
index ebe8e9c964..5336177965 100644
--- a/packages/backend/src/core/activitypub/models/ApPersonService.ts
+++ b/packages/backend/src/core/activitypub/models/ApPersonService.ts
@@ -233,7 +233,7 @@ export class ApPersonService implements OnModuleInit {
 		if (cached) return cached;
 
 		// URIがこのサーバーを指しているならデータベースからフェッチ
-		if (uri.startsWith(`${this.config.url}/`)) {
+		if (uri.startsWith(`${this.config.webUrl}/`) || uri.startsWith(`${this.config.localUrl}/`)) {
 			const id = uri.split('/').pop();
 			const u = await this.usersRepository.findOneBy({ id }) as MiLocalUser | null;
 			if (u) this.cacheService.uriPersonCache.set(uri, u);
@@ -305,7 +305,8 @@ export class ApPersonService implements OnModuleInit {
 		if (typeof uri !== 'string') throw new Error('uri is not string');
 
 		const host = this.utilityService.punyHost(uri);
-		if (host === this.utilityService.toPuny(this.config.host)) {
+		if ((host === this.utilityService.toPuny(this.config.localHost)) ||
+				(host === this.utilityService.toPuny(this.config.webHost))) {
 			throw new StatusError('cannot resolve local user', 400, 'cannot resolve local user');
 		}
 
diff --git a/packages/backend/src/core/entities/DriveFileEntityService.ts b/packages/backend/src/core/entities/DriveFileEntityService.ts
index 1865d494c4..10e333c04b 100644
--- a/packages/backend/src/core/entities/DriveFileEntityService.ts
+++ b/packages/backend/src/core/entities/DriveFileEntityService.ts
@@ -123,7 +123,7 @@ export class DriveFileEntityService {
 			const key = file.webpublicAccessKey;
 
 			if (key && !key.match('/')) {	// 古いものはここにオブジェクトストレージキーが入ってるので除外
-				const url = `${this.config.url}/files/${key}`;
+				const url = `${this.config.webUrl}/files/${key}`;
 				if (mode === 'avatar') return this.getProxiedUrl(file.uri, 'avatar');
 				return url;
 			}
diff --git a/packages/backend/src/core/entities/MetaEntityService.ts b/packages/backend/src/core/entities/MetaEntityService.ts
index 8e56ddbc02..29790c79a0 100644
--- a/packages/backend/src/core/entities/MetaEntityService.ts
+++ b/packages/backend/src/core/entities/MetaEntityService.ts
@@ -74,7 +74,7 @@ export class MetaEntityService {
 
 			name: instance.name,
 			shortName: instance.shortName,
-			uri: this.config.url,
+			uri: this.config.webUrl,
 			description: instance.description,
 			langs: instance.langs,
 			tosUrl: instance.termsOfServiceUrl,
diff --git a/packages/backend/src/core/entities/UserEntityService.ts b/packages/backend/src/core/entities/UserEntityService.ts
index 0f4051e7b8..eae9ade0d2 100644
--- a/packages/backend/src/core/entities/UserEntityService.ts
+++ b/packages/backend/src/core/entities/UserEntityService.ts
@@ -383,10 +383,10 @@ export class UserEntityService implements OnModuleInit {
 
 	@bindThis
 	public getIdenticonUrl(user: MiUser): string {
-		if ((user.host == null || user.host === this.config.host) && user.username.includes('.') && this.meta.iconUrl) { // ローカルのシステムアカウントの場合
+		if ((user.host == null || user.host === this.config.localHost) && user.username.includes('.') && this.meta.iconUrl) { // ローカルのシステムアカウントの場合
 			return this.meta.iconUrl;
 		} else {
-			return `${this.config.url}/identicon/${user.username.toLowerCase()}@${user.host ?? this.config.host}`;
+			return `${this.config.webUrl}/identicon/${user.username.toLowerCase()}@${user.host ?? this.config.localHost}`;
 		}
 	}
 
@@ -398,7 +398,7 @@ export class UserEntityService implements OnModuleInit {
 
 	@bindThis
 	public genLocalUserUri(userId: string): string {
-		return `${this.config.url}/users/${userId}`;
+		return `${this.config.webUrl}/users/${userId}`;
 	}
 
 	public async pack<S extends 'MeDetailed' | 'UserDetailedNotMe' | 'UserDetailed' | 'UserLite' = 'UserLite'>(
diff --git a/packages/backend/src/queue/processors/ExportCustomEmojisProcessorService.ts b/packages/backend/src/queue/processors/ExportCustomEmojisProcessorService.ts
index 53ecd2d180..5a7bef824f 100644
--- a/packages/backend/src/queue/processors/ExportCustomEmojisProcessorService.ts
+++ b/packages/backend/src/queue/processors/ExportCustomEmojisProcessorService.ts
@@ -75,7 +75,7 @@ export class ExportCustomEmojisProcessorService {
 			});
 		};
 
-		await writeMeta(`{"metaVersion":2,"host":"${this.config.host}","exportedAt":"${new Date().toString()}","emojis":[`);
+		await writeMeta(`{"metaVersion":2,"host":"${this.config.webHost}","exportedAt":"${new Date().toString()}","emojis":[`);
 
 		const customEmojis = await this.emojisRepository.find({
 			where: {
diff --git a/packages/backend/src/queue/processors/SystemWebhookDeliverProcessorService.ts b/packages/backend/src/queue/processors/SystemWebhookDeliverProcessorService.ts
index f6bef52684..0d85812587 100644
--- a/packages/backend/src/queue/processors/SystemWebhookDeliverProcessorService.ts
+++ b/packages/backend/src/queue/processors/SystemWebhookDeliverProcessorService.ts
@@ -41,13 +41,13 @@ export class SystemWebhookDeliverProcessorService {
 				method: 'POST',
 				headers: {
 					'User-Agent': 'Misskey-Hooks',
-					'X-Misskey-Host': this.config.host,
+					'X-Misskey-Host': this.config.webHost,
 					'X-Misskey-Hook-Id': job.data.webhookId,
 					'X-Misskey-Hook-Secret': job.data.secret,
 					'Content-Type': 'application/json',
 				},
 				body: JSON.stringify({
-					server: this.config.url,
+					server: this.config.webUrl,
 					hookId: job.data.webhookId,
 					eventId: job.data.eventId,
 					createdAt: job.data.createdAt,
diff --git a/packages/backend/src/queue/processors/UserWebhookDeliverProcessorService.ts b/packages/backend/src/queue/processors/UserWebhookDeliverProcessorService.ts
index 9ec630ef70..3d764125af 100644
--- a/packages/backend/src/queue/processors/UserWebhookDeliverProcessorService.ts
+++ b/packages/backend/src/queue/processors/UserWebhookDeliverProcessorService.ts
@@ -41,13 +41,13 @@ export class UserWebhookDeliverProcessorService {
 				method: 'POST',
 				headers: {
 					'User-Agent': 'Misskey-Hooks',
-					'X-Misskey-Host': this.config.host,
+					'X-Misskey-Host': this.config.webHost,
 					'X-Misskey-Hook-Id': job.data.webhookId,
 					'X-Misskey-Hook-Secret': job.data.secret,
 					'Content-Type': 'application/json',
 				},
 				body: JSON.stringify({
-					server: this.config.url,
+					server: this.config.webUrl,
 					hookId: job.data.webhookId,
 					userId: job.data.userId,
 					eventId: job.data.eventId,
diff --git a/packages/backend/src/server/ActivityPubServerService.ts b/packages/backend/src/server/ActivityPubServerService.ts
index 54ffeecc6b..8e582eafa4 100644
--- a/packages/backend/src/server/ActivityPubServerService.ts
+++ b/packages/backend/src/server/ActivityPubServerService.ts
@@ -99,7 +99,7 @@ export class ActivityPubServerService {
 	private async packActivity(note: MiNote): Promise<any> {
 		if (isRenote(note) && !isQuote(note)) {
 			const renote = await this.notesRepository.findOneByOrFail({ id: note.renoteId });
-			return this.apRendererService.renderAnnounce(renote.uri ? renote.uri : `${this.config.url}/notes/${renote.id}`, note);
+			return this.apRendererService.renderAnnounce(renote.uri ? renote.uri : `${this.config.webUrl}/notes/${renote.id}`, note);
 		}
 
 		return this.apRendererService.renderCreate(await this.apRendererService.renderNote(note, false), note);
@@ -122,7 +122,7 @@ export class ActivityPubServerService {
 		}
 
 		if (signature.params.headers.indexOf('host') === -1
-			|| request.headers.host !== this.config.host) {
+			|| (request.headers.host !== this.config.localHost && request.headers.host !== this.config.webHost)) {
 			// Host not specified or not match.
 			reply.code(401);
 			return;
@@ -223,7 +223,7 @@ export class ActivityPubServerService {
 		//#endregion
 
 		const limit = 10;
-		const partOf = `${this.config.url}/users/${userId}/followers`;
+		const partOf = `${this.config.webUrl}/users/${userId}/followers`;
 
 		if (page) {
 			const query = {
@@ -320,7 +320,7 @@ export class ActivityPubServerService {
 		//#endregion
 
 		const limit = 10;
-		const partOf = `${this.config.url}/users/${userId}/following`;
+		const partOf = `${this.config.webUrl}/users/${userId}/following`;
 
 		if (page) {
 			const query = {
@@ -403,7 +403,7 @@ export class ActivityPubServerService {
 		const renderedNotes = await Promise.all(pinnedNotes.map(note => this.apRendererService.renderNote(note)));
 
 		const rendered = this.apRendererService.renderOrderedCollection(
-			`${this.config.url}/users/${userId}/collections/featured`,
+			`${this.config.webUrl}/users/${userId}/collections/featured`,
 			renderedNotes.length,
 			undefined,
 			undefined,
@@ -460,7 +460,7 @@ export class ActivityPubServerService {
 		}
 
 		const limit = 20;
-		const partOf = `${this.config.url}/users/${userId}/outbox`;
+		const partOf = `${this.config.webUrl}/users/${userId}/outbox`;
 
 		if (page) {
 			const notes = this.meta.enableFanoutTimeline ? await this.fanoutTimelineEndpointService.getMiNotes({
diff --git a/packages/backend/src/server/FileServerService.ts b/packages/backend/src/server/FileServerService.ts
index f5034d0733..249c4f33cc 100644
--- a/packages/backend/src/server/FileServerService.ts
+++ b/packages/backend/src/server/FileServerService.ts
@@ -98,7 +98,7 @@ export class FileServerService {
 					.catch(err => this.errorHandler(request, reply, err));
 			});
 			fastify.get<{ Params: { key: string; } }>('/files/:key/*', async (request, reply) => {
-				return await reply.redirect(`${this.config.url}/files/${request.params.key}`, 301);
+				return await reply.redirect(`${this.config.webUrl}/files/${request.params.key}`, 301);
 			});
 			done();
 		});
diff --git a/packages/backend/src/server/NodeinfoServerService.ts b/packages/backend/src/server/NodeinfoServerService.ts
index 93c36f5365..69afa9bb77 100644
--- a/packages/backend/src/server/NodeinfoServerService.ts
+++ b/packages/backend/src/server/NodeinfoServerService.ts
@@ -38,10 +38,10 @@ export class NodeinfoServerService {
 	public getLinks() {
 		return [{
 			rel: 'http://nodeinfo.diaspora.software/ns/schema/2.1',
-			href: this.config.url + nodeinfo2_1path,
+			href: this.config.webUrl + nodeinfo2_1path,
 		}, {
 			rel: 'http://nodeinfo.diaspora.software/ns/schema/2.0',
-			href: this.config.url + nodeinfo2_0path,
+			href: this.config.webUrl + nodeinfo2_0path,
 		}];
 	}
 
diff --git a/packages/backend/src/server/ServerService.ts b/packages/backend/src/server/ServerService.ts
index ef9ac81f95..5c11e1012a 100644
--- a/packages/backend/src/server/ServerService.ts
+++ b/packages/backend/src/server/ServerService.ts
@@ -82,7 +82,7 @@ export class ServerService implements OnApplicationShutdown {
 
 		// HSTS
 		// 6months (15552000sec)
-		if (this.config.url.startsWith('https') && !this.config.disableHsts) {
+		if (this.config.webUrl.startsWith('https') && !this.config.disableHsts) {
 			fastify.addHook('onRequest', (request, reply, done) => {
 				reply.header('strict-transport-security', 'max-age=15552000; preload');
 				done();
@@ -123,7 +123,7 @@ export class ServerService implements OnApplicationShutdown {
 				}
 
 				const effectiveLocation = process.env.NODE_ENV === 'production' ? location : location.replace(/^http:\/\//, 'https://');
-				if (effectiveLocation.startsWith(`https://${this.config.host}/`)) {
+				if (effectiveLocation.startsWith(`https://${this.config.webHost}/`)) {
 					done();
 					return;
 				}
@@ -213,7 +213,7 @@ export class ServerService implements OnApplicationShutdown {
 			const user = await this.usersRepository.findOne({
 				where: {
 					usernameLower: username.toLowerCase(),
-					host: (host == null) || (host === this.config.host) ? IsNull() : host,
+					host: (host == null) || (host === this.config.localHost) ? IsNull() : host,
 					isSuspended: false,
 				},
 			});
diff --git a/packages/backend/src/server/WellKnownServerService.ts b/packages/backend/src/server/WellKnownServerService.ts
index ebfd1a421d..2f99ed0ee0 100644
--- a/packages/backend/src/server/WellKnownServerService.ts
+++ b/packages/backend/src/server/WellKnownServerService.ts
@@ -78,7 +78,7 @@ export class WellKnownServerService {
 			return XRD({ element: 'Link', attributes: {
 				rel: 'lrdd',
 				type: xrd,
-				template: `${this.config.url}${webFingerPath}?resource={uri}`,
+				template: `${this.config.webUrl}${webFingerPath}?resource={uri}`,
 			} });
 		});
 
@@ -93,7 +93,7 @@ export class WellKnownServerService {
 				links: [{
 					rel: 'lrdd',
 					type: jrd,
-					template: `${this.config.url}${webFingerPath}?resource={uri}`,
+					template: `${this.config.webUrl}${webFingerPath}?resource={uri}`,
 				}],
 			};
 		});
@@ -129,15 +129,15 @@ fastify.get('/.well-known/change-password', async (request, reply) => {
 			});
 
 			const generateQuery = (resource: string): FindOptionsWhere<MiUser> | number =>
-				resource.startsWith(`${this.config.url.toLowerCase()}/users/`) ?
+				resource.startsWith(`${this.config.webUrl.toLowerCase()}/users/`) ?
 					fromId(resource.split('/').pop()!) :
 					fromAcct(Acct.parse(
-						resource.startsWith(`${this.config.url.toLowerCase()}/@`) ? resource.split('/').pop()! :
+						resource.startsWith(`${this.config.webUrl.toLowerCase()}/@`) ? resource.split('/').pop()! :
 						resource.startsWith('acct:') ? resource.slice('acct:'.length) :
 						resource));
 
 			const fromAcct = (acct: Acct.Acct): FindOptionsWhere<MiUser> | number =>
-				!acct.host || acct.host === this.config.host.toLowerCase() ? {
+				!acct.host || acct.host === this.config.localHost.toLowerCase() ? {
 					usernameLower: acct.username.toLowerCase(),
 					host: IsNull(),
 					isSuspended: false,
@@ -162,7 +162,7 @@ fastify.get('/.well-known/change-password', async (request, reply) => {
 				return;
 			}
 
-			const subject = `acct:${user.username}@${this.config.host}`;
+			const subject = `acct:${user.username}@${this.config.localHost}`;
 			const self = {
 				rel: 'self',
 				type: 'application/activity+json',
@@ -171,11 +171,11 @@ fastify.get('/.well-known/change-password', async (request, reply) => {
 			const profilePage = {
 				rel: 'http://webfinger.net/rel/profile-page',
 				type: 'text/html',
-				href: `${this.config.url}/@${user.username}`,
+				href: `${this.config.webUrl}/@${user.username}`,
 			};
 			const subscribe = {
 				rel: 'http://ostatus.org/schema/1.0/subscribe',
-				template: `${this.config.url}/authorize-follow?acct={uri}`,
+				template: `${this.config.webUrl}/authorize-follow?acct={uri}`,
 			};
 
 			vary(reply.raw, 'Accept');
diff --git a/packages/backend/src/server/api/SigninApiService.ts b/packages/backend/src/server/api/SigninApiService.ts
index 5c9d16a95a..2e40743b62 100644
--- a/packages/backend/src/server/api/SigninApiService.ts
+++ b/packages/backend/src/server/api/SigninApiService.ts
@@ -82,7 +82,7 @@ export class SigninApiService {
 		}>,
 		reply: FastifyReply,
 	) {
-		reply.header('Access-Control-Allow-Origin', this.config.url);
+		reply.header('Access-Control-Allow-Origin', this.config.webUrl);
 		reply.header('Access-Control-Allow-Credentials', 'true');
 
 		const body = request.body;
diff --git a/packages/backend/src/server/api/SigninWithPasskeyApiService.ts b/packages/backend/src/server/api/SigninWithPasskeyApiService.ts
index 6feb4c3afa..b4386fba7e 100644
--- a/packages/backend/src/server/api/SigninWithPasskeyApiService.ts
+++ b/packages/backend/src/server/api/SigninWithPasskeyApiService.ts
@@ -61,7 +61,7 @@ export class SigninWithPasskeyApiService {
 		}>,
 		reply: FastifyReply,
 	) {
-		reply.header('Access-Control-Allow-Origin', this.config.url);
+		reply.header('Access-Control-Allow-Origin', this.config.webUrl);
 		reply.header('Access-Control-Allow-Credentials', 'true');
 
 		const body = request.body;
diff --git a/packages/backend/src/server/api/SignupApiService.ts b/packages/backend/src/server/api/SignupApiService.ts
index b419c51ef1..bfdf8859a7 100644
--- a/packages/backend/src/server/api/SignupApiService.ts
+++ b/packages/backend/src/server/api/SignupApiService.ts
@@ -198,7 +198,7 @@ export class SignupApiService {
 				password: hash,
 			});
 
-			const link = `${this.config.url}/signup-complete/${code}`;
+			const link = `${this.config.webUrl}/signup-complete/${code}`;
 
 			this.emailService.sendEmail(emailAddress!, 'Signup',
 				`To complete signup, please click this link:<br><a href="${link}">${link}</a>`,
diff --git a/packages/backend/src/server/api/endpoints/admin/meta.ts b/packages/backend/src/server/api/endpoints/admin/meta.ts
index 5beed3a7e8..20897c1af1 100644
--- a/packages/backend/src/server/api/endpoints/admin/meta.ts
+++ b/packages/backend/src/server/api/endpoints/admin/meta.ts
@@ -627,7 +627,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 				version: this.config.version,
 				name: instance.name,
 				shortName: instance.shortName,
-				uri: this.config.url,
+				uri: this.config.webUrl,
 				description: instance.description,
 				langs: instance.langs,
 				tosUrl: instance.termsOfServiceUrl,
diff --git a/packages/backend/src/server/api/endpoints/i/2fa/register.ts b/packages/backend/src/server/api/endpoints/i/2fa/register.ts
index b6c837eda7..7699063288 100644
--- a/packages/backend/src/server/api/endpoints/i/2fa/register.ts
+++ b/packages/backend/src/server/api/endpoints/i/2fa/register.ts
@@ -94,7 +94,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 				secret,
 				digits: 6,
 				label: me.username,
-				issuer: this.config.host,
+				issuer: this.config.webHost,
 			});
 			const url = totp.toString();
 			const qr = await QRCode.toDataURL(url);
@@ -104,7 +104,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 				url,
 				secret: secret.base32,
 				label: me.username,
-				issuer: this.config.host,
+				issuer: this.config.webHost,
 			};
 		});
 	}
diff --git a/packages/backend/src/server/api/endpoints/i/update-email.ts b/packages/backend/src/server/api/endpoints/i/update-email.ts
index c2f4281f36..620f854373 100644
--- a/packages/backend/src/server/api/endpoints/i/update-email.ts
+++ b/packages/backend/src/server/api/endpoints/i/update-email.ts
@@ -131,7 +131,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 					emailVerifyCode: code,
 				});
 
-				const link = `${this.config.url}/verify-email/${code}`;
+				const link = `${this.config.webUrl}/verify-email/${code}`;
 
 				this.emailService.sendEmail(ps.email, 'Email verification',
 					`To verify email, please click this link:<br><a href="${link}">${link}</a>`,
diff --git a/packages/backend/src/server/api/endpoints/i/update.ts b/packages/backend/src/server/api/endpoints/i/update.ts
index 5207d9f2b0..2b84d67e7c 100644
--- a/packages/backend/src/server/api/endpoints/i/update.ts
+++ b/packages/backend/src/server/api/endpoints/i/update.ts
@@ -571,7 +571,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 
 			const doc = htmlParser.parse(html);
 
-			const myLink = `${this.config.url}/@${user.username}`;
+			const myLink = `${this.config.webUrl}/@${user.username}`;
 
 			const aEls = Array.from(doc.getElementsByTagName('a'));
 			const linkEls = Array.from(doc.getElementsByTagName('link'));
diff --git a/packages/backend/src/server/api/endpoints/request-reset-password.ts b/packages/backend/src/server/api/endpoints/request-reset-password.ts
index 86fe6a2e6e..9f4acec44e 100644
--- a/packages/backend/src/server/api/endpoints/request-reset-password.ts
+++ b/packages/backend/src/server/api/endpoints/request-reset-password.ts
@@ -89,7 +89,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 				token,
 			});
 
-			const link = `${this.config.url}/reset-password/${token}`;
+			const link = `${this.config.webUrl}/reset-password/${token}`;
 
 			this.emailService.sendEmail(ps.email, 'Password reset requested',
 				`To reset password, please click this link:<br><a href="${link}">${link}</a>`,
diff --git a/packages/backend/src/server/file/FileServerProxyHandler.ts b/packages/backend/src/server/file/FileServerProxyHandler.ts
index 41e8e47ba5..c606d54891 100644
--- a/packages/backend/src/server/file/FileServerProxyHandler.ts
+++ b/packages/backend/src/server/file/FileServerProxyHandler.ts
@@ -260,8 +260,8 @@ export class FileServerProxyHandler {
 	}
 
 	private async getStreamAndTypeFromUrl(url: string): Promise<ProxySource> {
-		if (url.startsWith(`${this.config.url}/files/`)) {
-			const key = url.replace(`${this.config.url}/files/`, '').split('/').shift();
+		if (url.startsWith(`${this.config.webUrl}/files/`)) {
+			const key = url.replace(`${this.config.webUrl}/files/`, '').split('/').shift();
 			if (!key) throw new StatusError('Invalid File Key', 400, 'Invalid File Key');
 
 			return await this.fileResolver.resolveFileByAccessKey(key);
diff --git a/packages/backend/src/server/oauth/OAuth2ProviderService.ts b/packages/backend/src/server/oauth/OAuth2ProviderService.ts
index 840c34b806..2682aeace8 100644
--- a/packages/backend/src/server/oauth/OAuth2ProviderService.ts
+++ b/packages/backend/src/server/oauth/OAuth2ProviderService.ts
@@ -341,7 +341,7 @@ export class OAuth2ProviderService {
 		// "Authorization servers MUST support PKCE [RFC7636]."
 		this.#server.grant(oauth2Pkce.extensions());
 		this.#server.grant(oauth2orize.grant.code({
-			modes: getQueryMode(config.url),
+			modes: getQueryMode(config.webUrl),
 		}, (client, redirectUri, token, ares, areq, locals, done) => {
 			(async (): Promise<OmitFirstElement<Parameters<typeof done>>> => {
 				this.#logger.info(`Checking the user before sending authorization code to ${client.id}`);
@@ -431,9 +431,9 @@ export class OAuth2ProviderService {
 	// https://indieauth.spec.indieweb.org/#indieauth-server-metadata
 	public generateRFC8414() {
 		return {
-			issuer: this.config.url,
-			authorization_endpoint: new URL('/oauth/authorize', this.config.url),
-			token_endpoint: new URL('/oauth/token', this.config.url),
+			issuer: this.config.webUrl,
+			authorization_endpoint: new URL('/oauth/authorize', this.config.webUrl),
+			token_endpoint: new URL('/oauth/token', this.config.webUrl),
 			scopes_supported: kinds,
 			response_types_supported: ['code'],
 			grant_types_supported: ['authorization_code'],
@@ -521,7 +521,7 @@ export class OAuth2ProviderService {
 		}) as ValidateFunctionArity2));
 		fastify.use('/authorize', this.#server.errorHandler({
 			mode: 'indirect',
-			modes: getQueryMode(this.config.url),
+			modes: getQueryMode(this.config.webUrl),
 		}));
 		fastify.use('/authorize', this.#server.errorHandler());
 
diff --git a/packages/backend/src/server/web/ClientServerService.ts b/packages/backend/src/server/web/ClientServerService.ts
index 24bc619e79..ea567a53f2 100644
--- a/packages/backend/src/server/web/ClientServerService.ts
+++ b/packages/backend/src/server/web/ClientServerService.ts
@@ -156,10 +156,10 @@ export class ClientServerService {
 		let manifest = {
 			// 空文字列の場合右辺を使いたいため
 			// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-			'short_name': this.meta.shortName || this.meta.name || this.config.host,
+			'short_name': this.meta.shortName || this.meta.name || this.config.webHost,
 			// 空文字列の場合右辺を使いたいため
 			// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-			'name': this.meta.name || this.config.host,
+			'name': this.meta.name || this.config.webHost,
 			'start_url': '/',
 			'display': 'standalone',
 			'background_color': '#313a42',
@@ -213,7 +213,7 @@ export class ClientServerService {
 
 	@bindThis
 	public createServer(fastify: FastifyInstance, options: FastifyPluginOptions, done: (err?: Error) => void) {
-		const configUrl = new URL(this.config.url);
+		const configUrl = new URL(this.config.webUrl);
 
 		fastify.addHook('onRequest', (request, reply, done) => {
 			// クリックジャッキング防止のためiFrameの中に入れられないようにする
@@ -407,8 +407,8 @@ export class ClientServerService {
 			content += `<ShortName>${name}</ShortName>`;
 			content += `<Description>${name} Search</Description>`;
 			content += '<InputEncoding>UTF-8</InputEncoding>';
-			content += `<Image width="16" height="16" type="image/x-icon">${this.config.url}/favicon.ico</Image>`;
-			content += `<Url type="text/html" template="${this.config.url}/search?q={searchTerms}"/>`;
+			content += `<Image width="16" height="16" type="image/x-icon">${this.config.webUrl}/favicon.ico</Image>`;
+			content += `<Url type="text/html" template="${this.config.webUrl}/search?q={searchTerms}"/>`;
 			content += '</OpenSearchDescription>';
 
 			reply.header('Content-Type', 'application/opensearchdescription+xml');
diff --git a/packages/backend/src/server/web/FeedService.ts b/packages/backend/src/server/web/FeedService.ts
index eae7645321..9c386d3a4f 100644
--- a/packages/backend/src/server/web/FeedService.ts
+++ b/packages/backend/src/server/web/FeedService.ts
@@ -42,7 +42,7 @@ export class FeedService {
 	@bindThis
 	public async packFeed(user: MiUser) {
 		const author = {
-			link: `${this.config.url}/@${user.username}`,
+			link: `${this.config.webUrl}/@${user.username}`,
 			name: user.name ?? user.username,
 		};
 
@@ -60,7 +60,7 @@ export class FeedService {
 
 		const feed = new Feed({
 			id: author.link,
-			title: `${author.name} (@${user.username}@${this.config.host})`,
+			title: `${author.name} (@${user.username}@${this.config.localHost})`,
 			updated: notes.length !== 0 ? this.idService.parse(notes[0].id).date : undefined,
 			generator: 'Misskey',
 			description: `${user.notesCount} Notes, ${profile.followingVisibility === 'public' ? user.followingCount : '?'} Following, ${profile.followersVisibility === 'public' ? user.followersCount : '?'} Followers${profile.description ? ` · ${profile.description}` : ''}`,
@@ -83,7 +83,7 @@ export class FeedService {
 
 			feed.addItem({
 				title: `New note by ${author.name}`,
-				link: `${this.config.url}/notes/${note.id}`,
+				link: `${this.config.webUrl}/notes/${note.id}`,
 				date: this.idService.parse(note.id).date,
 				description: note.cw ?? undefined,
 				content: text ? this.mfmService.toHtml(mfmParse(text), JSON.parse(note.mentionedRemoteUsers)) ?? undefined : undefined,
diff --git a/packages/backend/src/server/web/HtmlTemplateService.ts b/packages/backend/src/server/web/HtmlTemplateService.ts
index 8ff985530d..ffb8f7df9f 100644
--- a/packages/backend/src/server/web/HtmlTemplateService.ts
+++ b/packages/backend/src/server/web/HtmlTemplateService.ts
@@ -86,7 +86,8 @@ export class HtmlTemplateService {
 			serverErrorImageUrl: this.meta.serverErrorImageUrl ?? 'https://xn--931a.moe/assets/error.jpg',
 			infoImageUrl: this.meta.infoImageUrl ?? 'https://xn--931a.moe/assets/info.jpg',
 			notFoundImageUrl: this.meta.notFoundImageUrl ?? 'https://xn--931a.moe/assets/not-found.jpg',
-			instanceUrl: this.config.url,
+			instanceUrl: this.config.webUrl,
+			localUrl: this.config.localUrl,
 			metaJson: htmlSafeJsonStringify(await this.metaEntityService.packDetailed(this.meta)),
 			now: Date.now(),
 			federationEnabled: this.meta.federation !== 'none',
diff --git a/packages/backend/src/server/web/views/_.ts b/packages/backend/src/server/web/views/_.ts
index ac7418f362..7476c218a9 100644
--- a/packages/backend/src/server/web/views/_.ts
+++ b/packages/backend/src/server/web/views/_.ts
@@ -34,6 +34,7 @@ export type CommonData = MinimumCommonData & {
 	infoImageUrl: string;
 	notFoundImageUrl: string;
 	instanceUrl: string;
+	localUrl: string;
 	now: number;
 	federationEnabled: boolean;
 	frontendBootloaderJs: string | null;
diff --git a/packages/backend/src/server/web/views/announcement.tsx b/packages/backend/src/server/web/views/announcement.tsx
index bc1c808177..70105732a5 100644
--- a/packages/backend/src/server/web/views/announcement.tsx
+++ b/packages/backend/src/server/web/views/announcement.tsx
@@ -18,7 +18,7 @@ export function AnnouncementPage(props: CommonProps<{
 				<meta property="og:type" content="article" />
 				<meta property="og:title" content={props.announcement.title} />
 				<meta property="og:description" content={description} />
-				<meta property="og:url" content={`${props.config.url}/announcements/${props.announcement.id}`} />
+				<meta property="og:url" content={`${props.config.webUrl}/announcements/${props.announcement.id}`} />
 				{props.announcement.imageUrl ? (
 					<>
 						<meta property="og:image" content={props.announcement.imageUrl} />
diff --git a/packages/backend/src/server/web/views/base-embed.tsx b/packages/backend/src/server/web/views/base-embed.tsx
index 011b66592e..6de70152b6 100644
--- a/packages/backend/src/server/web/views/base-embed.tsx
+++ b/packages/backend/src/server/web/views/base-embed.tsx
@@ -41,6 +41,7 @@ export function BaseEmbed(props: PropsWithChildren<CommonProps<{
 					<meta name="theme-color-orig" content={props.themeColor ?? '#86b300'} />
 					<meta property="og:site_name" content={props.instanceName || 'Misskey'} />
 					<meta property="instance_url" content={props.instanceUrl} />
+					<meta property="local_url" content={props.localUrl} />
 					<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover" />
 					<meta name="format-detection" content="telephone=no,date=no,address=no,email=no,url=no" />
 					<link rel="icon" href={props.icon ?? '/favicon.ico'} />
diff --git a/packages/backend/src/server/web/views/base.tsx b/packages/backend/src/server/web/views/base.tsx
index 6fa3395fb8..59dcc27f1e 100644
--- a/packages/backend/src/server/web/views/base.tsx
+++ b/packages/backend/src/server/web/views/base.tsx
@@ -43,12 +43,13 @@ export function Layout(props: PropsWithChildren<CommonProps<{
 					<meta name="theme-color-orig" content={props.themeColor ?? '#86b300'} />
 					<meta property="og:site_name" content={props.instanceName || 'Misskey'} />
 					<meta property="instance_url" content={props.instanceUrl} />
+					<meta property="local_url" content={props.localUrl} />
 					<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover" />
 					<meta name="format-detection" content="telephone=no,date=no,address=no,email=no,url=no" />
 					<link rel="icon" href={props.icon || '/favicon.ico'} />
 					<link rel="apple-touch-icon" href={props.appleTouchIcon || '/apple-touch-icon.png'} />
 					<link rel="manifest" href="/manifest.json" />
-					<link rel="search" type="application/opensearchdescription+xml" title={props.title || 'Misskey'} href={`${props.config.url}/opensearch.xml`} />
+					<link rel="search" type="application/opensearchdescription+xml" title={props.title || 'Misskey'} href={`${props.config.webUrl}/opensearch.xml`} />
 					{props.serverErrorImageUrl != null ? <link rel="prefetch" as="image" href={props.serverErrorImageUrl} /> : null}
 					{props.infoImageUrl != null ? <link rel="prefetch" as="image" href={props.infoImageUrl} /> : null}
 					{props.notFoundImageUrl != null ? <link rel="prefetch" as="image" href={props.notFoundImageUrl} /> : null}
diff --git a/packages/backend/src/server/web/views/channel.tsx b/packages/backend/src/server/web/views/channel.tsx
index 7d8123ea85..9bbf2c6a15 100644
--- a/packages/backend/src/server/web/views/channel.tsx
+++ b/packages/backend/src/server/web/views/channel.tsx
@@ -17,7 +17,7 @@ export function ChannelPage(props: CommonProps<{
 				<meta property="og:type" content="website" />
 				<meta property="og:title" content={props.channel.name} />
 				{props.channel.description != null ? <meta property="og:description" content={props.channel.description} /> : null}
-				<meta property="og:url" content={`${props.config.url}/channels/${props.channel.id}`} />
+				<meta property="og:url" content={`${props.config.webUrl}/channels/${props.channel.id}`} />
 				{props.channel.bannerUrl ? (
 					<>
 						<meta property="og:image" content={props.channel.bannerUrl} />
diff --git a/packages/backend/src/server/web/views/clip.tsx b/packages/backend/src/server/web/views/clip.tsx
index c3cc505e35..208ed176d8 100644
--- a/packages/backend/src/server/web/views/clip.tsx
+++ b/packages/backend/src/server/web/views/clip.tsx
@@ -18,7 +18,7 @@ export function ClipPage(props: CommonProps<{
 				<meta property="og:type" content="article" />
 				<meta property="og:title" content={props.clip.name} />
 				{props.clip.description != null ? <meta property="og:description" content={props.clip.description} /> : null}
-				<meta property="og:url" content={`${props.config.url}/clips/${props.clip.id}`} />
+				<meta property="og:url" content={`${props.config.webUrl}/clips/${props.clip.id}`} />
 				{props.clip.user.avatarUrl ? (
 					<>
 						<meta property="og:image" content={props.clip.user.avatarUrl} />
diff --git a/packages/backend/src/server/web/views/flash.tsx b/packages/backend/src/server/web/views/flash.tsx
index 25a6b2c0ae..6942bcd5e0 100644
--- a/packages/backend/src/server/web/views/flash.tsx
+++ b/packages/backend/src/server/web/views/flash.tsx
@@ -18,7 +18,7 @@ export function FlashPage(props: CommonProps<{
 				<meta property="og:type" content="article" />
 				<meta property="og:title" content={props.flash.title} />
 				<meta property="og:description" content={props.flash.summary} />
-				<meta property="og:url" content={`${props.config.url}/play/${props.flash.id}`} />
+				<meta property="og:url" content={`${props.config.webUrl}/play/${props.flash.id}`} />
 				{props.flash.user.avatarUrl ? (
 					<>
 						<meta property="og:image" content={props.flash.user.avatarUrl} />
diff --git a/packages/backend/src/server/web/views/gallery-post.tsx b/packages/backend/src/server/web/views/gallery-post.tsx
index 2bec2de930..3528dc9a20 100644
--- a/packages/backend/src/server/web/views/gallery-post.tsx
+++ b/packages/backend/src/server/web/views/gallery-post.tsx
@@ -18,7 +18,7 @@ export function GalleryPostPage(props: CommonProps<{
 				<meta property="og:type" content="article" />
 				<meta property="og:title" content={props.galleryPost.title} />
 				{props.galleryPost.description != null ? <meta property="og:description" content={props.galleryPost.description} /> : null}
-				<meta property="og:url" content={`${props.config.url}/gallery/${props.galleryPost.id}`} />
+				<meta property="og:url" content={`${props.config.webUrl}/gallery/${props.galleryPost.id}`} />
 				{props.galleryPost.isSensitive && props.galleryPost.user.avatarUrl ? (
 					<>
 						<meta property="og:image" content={props.galleryPost.user.avatarUrl} />
diff --git a/packages/backend/src/server/web/views/info-card.tsx b/packages/backend/src/server/web/views/info-card.tsx
index 27be4c69e8..bcc28a5110 100644
--- a/packages/backend/src/server/web/views/info-card.tsx
+++ b/packages/backend/src/server/web/views/info-card.tsx
@@ -21,13 +21,13 @@ export function InfoCardPage(props: CommonPropsMinimum<{
 					<meta charset="UTF-8" />
 					<meta name="application-name" content="Misskey" />
 					<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-					<title safe>{props.meta.name ?? props.config.url}</title>
+					<title safe>{props.meta.name ?? props.config.webUrl}</title>
 					<link rel="stylesheet" href="/static-assets/misc/info-card.css" />
 				</head>
 				<body>
-					<a id="a" href={props.config.url} target="_blank" rel="noopener noreferrer">
+					<a id="a" href={props.config.webUrl} target="_blank" rel="noopener noreferrer">
 						<header id="banner" style={props.meta.bannerUrl != null ? `background-image: url(${props.meta.bannerUrl});` : ''}>
-							<div id="title" safe>{props.meta.name ?? props.config.url}</div>
+							<div id="title" safe>{props.meta.name ?? props.config.webUrl}</div>
 						</header>
 					</a>
 					<div id="content">
diff --git a/packages/backend/src/server/web/views/note.tsx b/packages/backend/src/server/web/views/note.tsx
index 803c3d2537..85657eb1ed 100644
--- a/packages/backend/src/server/web/views/note.tsx
+++ b/packages/backend/src/server/web/views/note.tsx
@@ -26,7 +26,7 @@ export function NotePage(props: CommonProps<{
 				<meta property="og:type" content="article" />
 				<meta property="og:title" content={title} />
 				<meta property="og:description" content={summary} />
-				<meta property="og:url" content={`${props.config.url}/notes/${props.note.id}`} />
+				<meta property="og:url" content={`${props.config.webUrl}/notes/${props.note.id}`} />
 				{videos.map(video => (
 					<>
 						<meta property="og:video:url" content={video.url} />
@@ -74,7 +74,7 @@ export function NotePage(props: CommonProps<{
 
 				{props.federationEnabled ? (
 					<>
-						{props.note.user.host == null ? <link rel="alternate" type="application/activity+json" href={`${props.config.url}/notes/${props.note.id}`} /> : null}
+						{props.note.user.host == null ? <link rel="alternate" type="application/activity+json" href={`${props.config.webUrl}/notes/${props.note.id}`} /> : null}
 						{props.note.uri != null ? <link rel="alternate" type="application/activity+json" href={props.note.uri} /> : null}
 					</>
 				) : null}
diff --git a/packages/backend/src/server/web/views/page.tsx b/packages/backend/src/server/web/views/page.tsx
index d0484612df..f523173a49 100644
--- a/packages/backend/src/server/web/views/page.tsx
+++ b/packages/backend/src/server/web/views/page.tsx
@@ -18,7 +18,7 @@ export function PagePage(props: CommonProps<{
 				<meta property="og:type" content="article" />
 				<meta property="og:title" content={props.page.title} />
 				{props.page.summary != null ? <meta property="og:description" content={props.page.summary} /> : null}
-				<meta property="og:url" content={`${props.config.url}/pages/${props.page.id}`} />
+				<meta property="og:url" content={`${props.config.webUrl}/pages/${props.page.id}`} />
 				{props.page.eyeCatchingImage != null ? (
 					<>
 						<meta property="og:image" content={props.page.eyeCatchingImage.thumbnailUrl ?? props.page.eyeCatchingImage.url} />
diff --git a/packages/backend/src/server/web/views/reversi-game.tsx b/packages/backend/src/server/web/views/reversi-game.tsx
index 22609311fd..d969b47575 100644
--- a/packages/backend/src/server/web/views/reversi-game.tsx
+++ b/packages/backend/src/server/web/views/reversi-game.tsx
@@ -19,7 +19,7 @@ export function ReversiGamePage(props: CommonProps<{
 				<meta property="og:type" content="article" />
 				<meta property="og:title" content={title} />
 				<meta property="og:description" content={description} />
-				<meta property="og:url" content={`${props.config.url}/reversi/g/${props.reversiGame.id}`} />
+				<meta property="og:url" content={`${props.config.webUrl}/reversi/g/${props.reversiGame.id}`} />
 				<meta property="twitter:card" content="summary" />
 			</>
 		);
diff --git a/packages/backend/src/server/web/views/user.tsx b/packages/backend/src/server/web/views/user.tsx
index 76c2633ab9..023af2fdd0 100644
--- a/packages/backend/src/server/web/views/user.tsx
+++ b/packages/backend/src/server/web/views/user.tsx
@@ -26,7 +26,7 @@ export function UserPage(props: CommonProps<{
 				<meta property="og:type" content="blog" />
 				<meta property="og:title" content={title} />
 				{props.user.description != null ? <meta property="og:description" content={props.user.description} /> : null}
-				<meta property="og:url" content={`${props.config.url}/@${props.user.username}`} />
+				<meta property="og:url" content={`${props.config.webUrl}/@${props.user.username}`} />
 				<meta property="og:image" content={props.user.avatarUrl} />
 				<meta property="twitter:card" content="summary" />
 			</>
@@ -48,7 +48,7 @@ export function UserPage(props: CommonProps<{
 
 				{props.sub == null && props.federationEnabled ? (
 					<>
-						{props.user.host == null ? <link rel="alternate" type="application/activity+json" href={`${props.config.url}/users/${props.user.id}`} /> : null}
+						{props.user.host == null ? <link rel="alternate" type="application/activity+json" href={`${props.config.webUrl}/users/${props.user.id}`} /> : null}
 						{props.user.uri != null ? <link rel="alternate" type="application/activity+json" href={props.user.uri} /> : null}
 						{props.profile.url != null ? <link rel="alternate" type="text/html" href={props.profile.url} /> : null}
 					</>
diff --git a/packages/backend/test/e2e/2fa.ts b/packages/backend/test/e2e/2fa.ts
index 48e1bababb..f1f6cd1eb7 100644
--- a/packages/backend/test/e2e/2fa.ts
+++ b/packages/backend/test/e2e/2fa.ts
@@ -53,7 +53,7 @@ describe('2要素認証', () => {
 
 	const rpIdHash = (): Buffer => {
 		return crypto.createHash('sha256')
-			.update(Buffer.from(config.host, 'utf-8'))
+			.update(Buffer.from(config.webHost, 'utf-8'))
 			.digest();
 	};
 
@@ -103,7 +103,7 @@ describe('2要素認証', () => {
 					clientDataJSON: Buffer.from(JSON.stringify({
 						type: 'webauthn.create',
 						challenge: param.creationOptions.challenge,
-						origin: config.scheme + '://' + config.host,
+						origin: config.scheme + '://' + config.webHost,
 						androidPackageName: 'org.mozilla.firefox',
 					}), 'utf-8').toString('base64url'),
 					attestationObject: cbor.encode({
@@ -147,7 +147,7 @@ describe('2要素認証', () => {
 		const clientDataJSONBuffer = Buffer.from(JSON.stringify({
 			type: 'webauthn.get',
 			challenge: param.requestOptions.challenge,
-			origin: config.scheme + '://' + config.host,
+			origin: config.scheme + '://' + config.webHost,
 			androidPackageName: 'org.mozilla.firefox',
 		}), 'utf-8');
 		const hashedclientDataJSON = crypto.createHash('sha256')
@@ -189,7 +189,7 @@ describe('2要素認証', () => {
 		assert.notEqual(registerResponse.body.url, undefined);
 		assert.notEqual(registerResponse.body.secret, undefined);
 		assert.strictEqual(registerResponse.body.label, username);
-		assert.strictEqual(registerResponse.body.issuer, config.host);
+		assert.strictEqual(registerResponse.body.issuer, config.webHost);
 
 		const doneResponse = await api('i/2fa/done', {
 			token: otpToken(registerResponse.body.secret),
diff --git a/packages/backend/test/e2e/move.ts b/packages/backend/test/e2e/move.ts
index fd798bdb25..b873570a9b 100644
--- a/packages/backend/test/e2e/move.ts
+++ b/packages/backend/test/e2e/move.ts
@@ -34,7 +34,7 @@ describe('Account Move', () => {
 		jq = await jobQueue();
 
 		const config = loadConfig();
-		url = new URL(config.url);
+		url = new URL(config.webUrl);
 		const connection = await initTestDb(false);
 		root = await signup({ username: 'root' });
 		alice = await signup({ username: 'alice' });
diff --git a/packages/backend/test/unit/server/FileServerService.ts b/packages/backend/test/unit/server/FileServerService.ts
index c88175c5c7..e4bde36d17 100644
--- a/packages/backend/test/unit/server/FileServerService.ts
+++ b/packages/backend/test/unit/server/FileServerService.ts
@@ -109,7 +109,7 @@ describe('FileServerService', () => {
 		size?: number;
 	}) {
 		const accessKey = params.accessKey;
-		const url = params.uri ?? `${config.url}/files/${accessKey}`;
+		const url = params.uri ?? `${config.webUrl}/files/${accessKey}`;
 		await driveFilesRepository.insert({
 			id: idService.gen(),
 			userId: null,
@@ -582,7 +582,7 @@ describe('FileServerService', () => {
 			});
 
 			expect(res.statusCode).toBe(301);
-			expect(res.headers.location).toBe(`${config.url}/files/testkey`);
+			expect(res.headers.location).toBe(`${config.webUrl}/files/testkey`);
 			expect(res.headers['content-security-policy']).toBe('default-src \'none\'; img-src \'self\'; media-src \'self\'; style-src \'unsafe-inline\'');
 		});
 	});
@@ -755,7 +755,7 @@ describe('FileServerService', () => {
 
 			const res = await fastify.inject({
 				method: 'GET',
-				url: `/proxy/any?url=${encodeURIComponent(`${config.url}/files/${accessKey}`)}&origin=1`,
+				url: `/proxy/any?url=${encodeURIComponent(`${config.webUrl}/files/${accessKey}`)}&origin=1`,
 				headers: {
 					'user-agent': 'Mozilla/5.0',
 				},
diff --git a/packages/backend/test/utils.ts b/packages/backend/test/utils.ts
index f91fb7f9b1..2ac69256e0 100644
--- a/packages/backend/test/utils.ts
+++ b/packages/backend/test/utils.ts
@@ -39,8 +39,8 @@ export type SystemWebhookPayload = {
 
 const config = loadConfig();
 export const port = config.port;
-export const origin = config.url;
-export const host = new URL(config.url).host;
+export const origin = config.webUrl;
+export const host = new URL(config.webUrl).host;
 
 export const WEBHOOK_HOST = 'http://localhost:15080';
 export const WEBHOOK_PORT = 15080;
diff --git a/packages/frontend-embed/src/boot.ts b/packages/frontend-embed/src/boot.ts
index 961cbcef66..65c4106888 100644
--- a/packages/frontend-embed/src/boot.ts
+++ b/packages/frontend-embed/src/boot.ts
@@ -22,7 +22,7 @@ import { applyTheme, assertIsTheme } from '@/theme.js';
 import { fetchCustomEmojis } from '@/custom-emojis.js';
 import { DI } from '@/di.js';
 import { serverMetadata } from '@/server-metadata.js';
-import { url, version, lang } from '@@/js/config.js';
+import { webUrl, version, lang } from '@@/js/config.js';
 import { parseEmbedParams } from '@@/js/embed-page.js';
 import { postMessageToParentWindow, setIframeId } from '@/post-message.js';
 import { serverContext } from '@/server-context.js';
@@ -101,7 +101,7 @@ const app = createApp(
 	defineAsyncComponent(() => import('@/ui.vue')),
 );
 
-app.provide(DI.mediaProxy, new MediaProxy(serverMetadata, url));
+app.provide(DI.mediaProxy, new MediaProxy(serverMetadata, webUrl));
 
 app.provide(DI.serverMetadata, serverMetadata);
 
diff --git a/packages/frontend-embed/src/components/EmAcct.vue b/packages/frontend-embed/src/components/EmAcct.vue
index ff794d9b6e..2a8bd0ccc8 100644
--- a/packages/frontend-embed/src/components/EmAcct.vue
+++ b/packages/frontend-embed/src/components/EmAcct.vue
@@ -13,12 +13,12 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import * as Misskey from 'misskey-js';
 import { toUnicode } from 'punycode.js';
-import { host as hostRaw } from '@@/js/config.js';
+import { localHost } from '@@/js/config.js';
 
 defineProps<{
 	user: Misskey.entities.UserLite;
 	detail?: boolean;
 }>();
 
-const host = toUnicode(hostRaw);
+const host = toUnicode(localHost);
 </script>
diff --git a/packages/frontend-embed/src/components/EmLink.vue b/packages/frontend-embed/src/components/EmLink.vue
index aec9b33072..945e73e5cd 100644
--- a/packages/frontend-embed/src/components/EmLink.vue
+++ b/packages/frontend-embed/src/components/EmLink.vue
@@ -16,7 +16,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { ref } from 'vue';
 import EmA from './EmA.vue';
-import { url as local } from '@@/js/config.js';
+import { webUrl as local } from '@@/js/config.js';
 
 const props = withDefaults(defineProps<{
 	url: string;
diff --git a/packages/frontend-embed/src/components/EmMention.vue b/packages/frontend-embed/src/components/EmMention.vue
index 0a8ac9c05a..6ea9c6a1aa 100644
--- a/packages/frontend-embed/src/components/EmMention.vue
+++ b/packages/frontend-embed/src/components/EmMention.vue
@@ -16,7 +16,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 import { toUnicode } from 'punycode.js';
 import { } from 'vue';
 import tinycolor from 'tinycolor2';
-import { host as localHost } from '@@/js/config.js';
+import { localHost } from '@@/js/config.js';
 
 const props = defineProps<{
 	username: string;
diff --git a/packages/frontend-embed/src/components/EmMfm.ts b/packages/frontend-embed/src/components/EmMfm.ts
index 5b9a53bbc2..962965ca0d 100644
--- a/packages/frontend-embed/src/components/EmMfm.ts
+++ b/packages/frontend-embed/src/components/EmMfm.ts
@@ -7,7 +7,7 @@ import { h, provide } from 'vue';
 import type { VNode, SetupContext } from 'vue';
 import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
-import { host } from '@@/js/config.js';
+import { localHost } from '@@/js/config.js';
 import EmUrl from '@/components/EmUrl.vue';
 import EmTime from '@/components/EmTime.vue';
 import EmLink from '@/components/EmLink.vue';
@@ -347,7 +347,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
 			case 'mention': {
 				return [h(EmMention, {
 					key: Math.random(),
-					host: (token.props.host == null && props.author && props.author.host != null ? props.author.host : token.props.host) ?? host,
+					host: (token.props.host == null && props.author && props.author.host != null ? props.author.host : token.props.host) ?? localHost,
 					username: token.props.username,
 				})];
 			}
diff --git a/packages/frontend-embed/src/components/EmNote.vue b/packages/frontend-embed/src/components/EmNote.vue
index f5b064c293..09112f4e43 100644
--- a/packages/frontend-embed/src/components/EmNote.vue
+++ b/packages/frontend-embed/src/components/EmNote.vue
@@ -66,7 +66,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						/>
 					</div>
 					<div v-if="appearNote.files && appearNote.files.length > 0">
-						<EmMediaList :mediaList="appearNote.files" :originalEntityUrl="`${url}/notes/${appearNote.id}`"/>
+						<EmMediaList :mediaList="appearNote.files" :originalEntityUrl="`${webUrl}/notes/${appearNote.id}`"/>
 					</div>
 					<EmPoll v-if="appearNote.poll" :noteId="appearNote.id" :poll="appearNote.poll" :readOnly="true" :class="$style.poll"/>
 					<div v-if="appearNote.renote" :class="$style.quote"><EmNoteSimple :note="appearNote.renote" :class="$style.quoteNote"/></div>
@@ -109,7 +109,7 @@ import { computed, inject, ref, shallowRef } from 'vue';
 import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
 import { shouldCollapsed } from '@@/js/collapsed.js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import I18n from '@/components/I18n.vue';
 import EmNoteSub from '@/components/EmNoteSub.vue';
 import EmNoteHeader from '@/components/EmNoteHeader.vue';
diff --git a/packages/frontend-embed/src/components/EmNoteDetailed.vue b/packages/frontend-embed/src/components/EmNoteDetailed.vue
index b39b47c065..d74577b262 100644
--- a/packages/frontend-embed/src/components/EmNoteDetailed.vue
+++ b/packages/frontend-embed/src/components/EmNoteDetailed.vue
@@ -49,7 +49,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						<div :class="$style.noteHeaderUsername"><EmAcct :user="appearNote.user"/></div>
 					</div>
 					<div :class="$style.noteHeaderInfo">
-						<a :href="url" :class="$style.noteHeaderInstanceIconLink" target="_blank" rel="noopener noreferrer">
+						<a :href="webUrl" :class="$style.noteHeaderInstanceIconLink" target="_blank" rel="noopener noreferrer">
 							<img :src="serverMetadata.iconUrl || '/favicon.ico'" alt="" :class="$style.noteHeaderInstanceIcon"/>
 						</a>
 					</div>
@@ -75,7 +75,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				/>
 				<a v-if="appearNote.renote != null" :class="$style.rn">RN:</a>
 				<div v-if="appearNote.files && appearNote.files.length > 0">
-					<EmMediaList :mediaList="appearNote.files" :originalEntityUrl="`${url}/notes/${appearNote.id}`"/>
+					<EmMediaList :mediaList="appearNote.files" :originalEntityUrl="`${webUrl}/notes/${appearNote.id}`"/>
 				</div>
 				<EmPoll v-if="appearNote.poll" ref="pollViewer" :noteId="appearNote.id" :poll="appearNote.poll" :readOnly="true" :class="$style.poll"/>
 				<div v-if="appearNote.renote" :class="$style.quote"><EmNoteSimple :note="appearNote.renote" :class="$style.quoteNote"/></div>
@@ -146,7 +146,7 @@ import { notePage } from '@/utils.js';
 import { i18n } from '@/i18n.js';
 import { DI } from '@/di.js';
 import { shouldCollapsed } from '@@/js/collapsed.js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import EmMfm from '@/components/EmMfm.js';
 
 const props = defineProps<{
diff --git a/packages/frontend-embed/src/components/EmSubNoteContent.vue b/packages/frontend-embed/src/components/EmSubNoteContent.vue
index 61815ddfd8..e5cdce5c08 100644
--- a/packages/frontend-embed/src/components/EmSubNoteContent.vue
+++ b/packages/frontend-embed/src/components/EmSubNoteContent.vue
@@ -14,7 +14,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	</div>
 	<details v-if="note.files && note.files.length > 0">
 		<summary>({{ i18n.tsx.withNFiles({ n: note.files.length }) }})</summary>
-		<EmMediaList :mediaList="note.files" :originalEntityUrl="`${url}/notes/${note.id}`"/>
+		<EmMediaList :mediaList="note.files" :originalEntityUrl="`${webUrl}/notes/${note.id}`"/>
 	</details>
 	<details v-if="note.poll">
 		<summary>{{ i18n.ts.poll }}</summary>
@@ -35,7 +35,7 @@ import * as Misskey from 'misskey-js';
 import EmMediaList from '@/components/EmMediaList.vue';
 import EmPoll from '@/components/EmPoll.vue';
 import { i18n } from '@/i18n.js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { shouldCollapsed } from '@@/js/collapsed.js';
 import EmA from '@/components/EmA.vue';
 import EmMfm from '@/components/EmMfm.js';
diff --git a/packages/frontend-embed/src/components/EmUrl.vue b/packages/frontend-embed/src/components/EmUrl.vue
index 2dbbe90858..a3bd74270a 100644
--- a/packages/frontend-embed/src/components/EmUrl.vue
+++ b/packages/frontend-embed/src/components/EmUrl.vue
@@ -27,7 +27,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 import { ref } from 'vue';
 import { toUnicode as decodePunycode } from 'punycode.js';
 import EmA from './EmA.vue';
-import { url as local } from '@@/js/config.js';
+import { webUrl as local } from '@@/js/config.js';
 
 function safeURIDecode(str: string): string {
 	try {
diff --git a/packages/frontend-embed/src/pages/clip.vue b/packages/frontend-embed/src/pages/clip.vue
index a65f38aa7d..33d1013281 100644
--- a/packages/frontend-embed/src/pages/clip.vue
+++ b/packages/frontend-embed/src/pages/clip.vue
@@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 					<div class="_nowrap"><a :href="`/clips/${clip.id}`" target="_blank" rel="noopener">{{ clip.name }}</a></div>
 					<div :class="$style.sub">{{ i18n.tsx.fromX({ x: instanceName }) }}</div>
 				</div>
-				<a :href="url" :class="$style.instanceIconLink" target="_blank" rel="noopener noreferrer">
+				<a :href="webUrl" :class="$style.instanceIconLink" target="_blank" rel="noopener noreferrer">
 					<img
 						:class="$style.instanceIcon"
 						:src="serverMetadata.iconUrl || '/favicon.ico'"
@@ -41,7 +41,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 import { ref, computed, inject, useTemplateRef } from 'vue';
 import * as Misskey from 'misskey-js';
 import { scrollToTop } from '@@/js/scroll.js';
-import { url, instanceName } from '@@/js/config.js';
+import { webUrl, instanceName } from '@@/js/config.js';
 import { isLink } from '@@/js/is-link.js';
 import { defaultEmbedParams } from '@@/js/embed-page.js';
 import type { Paging } from '@/components/EmPagination.vue';
diff --git a/packages/frontend-embed/src/pages/tag.vue b/packages/frontend-embed/src/pages/tag.vue
index 8c6cd32bab..ab9f005106 100644
--- a/packages/frontend-embed/src/pages/tag.vue
+++ b/packages/frontend-embed/src/pages/tag.vue
@@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 					<div class="_nowrap"><a :href="`/tags/${tag}`" target="_blank" rel="noopener">#{{ tag }}</a></div>
 					<div :class="$style.sub">{{ i18n.tsx.fromX({ x: instanceName }) }}</div>
 				</div>
-				<a :href="url" :class="$style.instanceIconLink" target="_blank" rel="noopener noreferrer">
+				<a :href="webUrl" :class="$style.instanceIconLink" target="_blank" rel="noopener noreferrer">
 					<img
 						:class="$style.instanceIcon"
 						:src="serverMetadata.iconUrl || '/favicon.ico'"
@@ -40,7 +40,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script setup lang="ts">
 import { computed, inject, useTemplateRef } from 'vue';
 import { scrollToTop } from '@@/js/scroll.js';
-import { url, instanceName } from '@@/js/config.js';
+import { webUrl, instanceName } from '@@/js/config.js';
 import { isLink } from '@@/js/is-link.js';
 import { defaultEmbedParams } from '@@/js/embed-page.js';
 import type { Paging } from '@/components/EmPagination.vue';
diff --git a/packages/frontend-embed/src/pages/user-timeline.vue b/packages/frontend-embed/src/pages/user-timeline.vue
index 4b5daf54da..c99c2f4b21 100644
--- a/packages/frontend-embed/src/pages/user-timeline.vue
+++ b/packages/frontend-embed/src/pages/user-timeline.vue
@@ -22,7 +22,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 					</I18n>
 					<div :class="$style.sub">{{ i18n.tsx.fromX({ x: instanceName }) }}</div>
 				</div>
-				<a :href="url" :class="$style.instanceIconLink" target="_blank" rel="noopener noreferrer">
+				<a :href="webUrl" :class="$style.instanceIconLink" target="_blank" rel="noopener noreferrer">
 					<img
 						:class="$style.instanceIcon"
 						:src="serverMetadata.iconUrl || '/favicon.ico'"
@@ -47,7 +47,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script setup lang="ts">
 import { ref, computed, inject, useTemplateRef } from 'vue';
 import * as Misskey from 'misskey-js';
-import { url, instanceName } from '@@/js/config.js';
+import { webUrl, instanceName } from '@@/js/config.js';
 import { defaultEmbedParams } from '@@/js/embed-page.js';
 import { scrollToTop } from '@@/js/scroll.js';
 import { isLink } from '@@/js/is-link.js';
diff --git a/packages/frontend-embed/src/utils.ts b/packages/frontend-embed/src/utils.ts
index 939648aa38..c307b1588d 100644
--- a/packages/frontend-embed/src/utils.ts
+++ b/packages/frontend-embed/src/utils.ts
@@ -4,7 +4,7 @@
  */
 
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 
 export const acct = (user: Misskey.Acct) => {
 	return Misskey.acct.toString(user);
@@ -15,7 +15,7 @@ export const userName = (user: Misskey.entities.User) => {
 };
 
 export const userPage = (user: Misskey.Acct, path?: string, absolute = false) => {
-	return `${absolute ? url : ''}/@${acct(user)}${(path ? `/${path}` : '')}`;
+	return `${absolute ? webUrl : ''}/@${acct(user)}${(path ? `/${path}` : '')}`;
 };
 
 export const notePage = (note: Misskey.entities.Note) => {
diff --git a/packages/frontend-shared/js/config.ts b/packages/frontend-shared/js/config.ts
index 8021c4f022..caa13780e3 100644
--- a/packages/frontend-shared/js/config.ts
+++ b/packages/frontend-shared/js/config.ts
@@ -5,18 +5,22 @@
 
 // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
 const address = new URL(window.document.querySelector<HTMLMetaElement>('meta[property="instance_url"]')?.content || window.location.href);
+const localAddress = new URL(window.document.querySelector<HTMLMetaElement>('meta[property="local_url"]')?.content || window.location.href);
 const siteName = window.document.querySelector<HTMLMetaElement>('meta[property="og:site_name"]')?.content;
 
-export const host = address.host;
-export const hostname = address.hostname;
-export const url = address.origin;
+export const webHost = address.host;
+export const webHostname = address.hostname;
+export const webUrl = address.origin;
+export const localHost = localAddress.host;
+export const localHostname = localAddress.hostname;
+export const localUrl = localAddress.origin;
 export const port = address.port;
 export const apiUrl = window.location.origin + '/api';
 export const wsOrigin = window.location.origin;
 export const lang = localStorage.getItem('lang') ?? 'en-US';
 export const langs = _LANGS_;
 export const version = _VERSION_;
-export const instanceName = (siteName === 'Misskey' || siteName == null) ? host : siteName;
+export const instanceName = (siteName === 'Misskey' || siteName == null) ? webHost : siteName;
 export const ui = localStorage.getItem('ui');
 export const debug = localStorage.getItem('debug') === 'true';
 export const isSafeMode = localStorage.getItem('isSafeMode') === 'true';
diff --git a/packages/frontend/src/accounts.ts b/packages/frontend/src/accounts.ts
index 862ef4e113..849b90efaa 100644
--- a/packages/frontend/src/accounts.ts
+++ b/packages/frontend/src/accounts.ts
@@ -5,7 +5,7 @@
 
 import { defineAsyncComponent, ref } from 'vue';
 import * as Misskey from 'misskey-js';
-import { apiUrl, host } from '@@/js/config.js';
+import { apiUrl, localHost } from '@@/js/config.js';
 import type { MenuItem } from '@/types/menu.js';
 import { showSuspendedDialog } from '@/utility/show-suspended-dialog.js';
 import { i18n } from '@/i18n.js';
@@ -131,7 +131,7 @@ export function updateCurrentAccount(accountData: Misskey.entities.MeDetailed) {
 	for (const [key, value] of Object.entries(accountData)) {
 		($i[key as keyof typeof accountData] as any) = value;
 	}
-	store.set('accountInfos', { ...store.s.accountInfos, [host + '/' + $i.id]: $i });
+	store.set('accountInfos', { ...store.s.accountInfos, [localHost + '/' + $i.id]: $i });
 	$i.token = token;
 	miLocalStorage.setItem('account', JSON.stringify($i));
 }
@@ -142,7 +142,7 @@ export function updateCurrentAccountPartial(accountData: Partial<Misskey.entitie
 		($i[key as keyof typeof accountData] as any) = value;
 	}
 
-	store.set('accountInfos', { ...store.s.accountInfos, [host + '/' + $i.id]: $i });
+	store.set('accountInfos', { ...store.s.accountInfos, [localHost + '/' + $i.id]: $i });
 
 	miLocalStorage.setItem('account', JSON.stringify($i));
 }
@@ -152,7 +152,7 @@ export async function refreshCurrentAccount() {
 	const me = $i;
 	return fetchAccount($i.token, $i.id).then(updateCurrentAccount).catch(reason => {
 		if (reason === isAccountDeleted) {
-			removeAccount(host, me.id);
+			removeAccount(localHost, me.id);
 			if (Object.keys(store.s.accountTokens).length > 0) {
 				login(Object.values(store.s.accountTokens)[0]);
 			} else {
@@ -181,7 +181,7 @@ export async function login(token: AccountWithToken['token'], redirect?: string)
 		token,
 	}));
 
-	await addAccount(host, me, token);
+	await addAccount(localHost, me, token);
 
 	if (redirect) {
 		// 他のタブは再読み込みするだけ
@@ -296,7 +296,7 @@ export async function getAccountMenu(opts: {
 		});
 
 		if (opts.includeCurrentAccount) {
-			menuItems.push(createItem(host, $i.id, $i.username, $i, $i.token));
+			menuItems.push(createItem(localHost, $i.id, $i.username, $i, $i.token));
 		}
 
 		menuItems.push(...accountItems);
@@ -319,7 +319,7 @@ export async function getAccountMenu(opts: {
 				action: () => {
 					getAccountWithSignupDialog().then(res => {
 						if (res != null) {
-							switchAccount(host, res.id);
+							switchAccount(localHost, res.id);
 						}
 					});
 				},
@@ -332,7 +332,7 @@ export async function getAccountMenu(opts: {
 		});
 	} else {
 		if (opts.includeCurrentAccount) {
-			menuItems.push(createItem(host, $i.id, $i.username, $i, $i.token));
+			menuItems.push(createItem(localHost, $i.id, $i.username, $i, $i.token));
 		}
 
 		menuItems.push(...accountItems);
@@ -346,7 +346,7 @@ export function getAccountWithSigninDialog(): Promise<{ id: string, token: strin
 		const { dispose } = popup(defineAsyncComponent(() => import('@/components/MkSigninDialog.vue')), {}, {
 			done: async (res: Misskey.entities.SigninFlowResponse & { finished: true }) => {
 				const user = await fetchAccount(res.i, res.id, true);
-				await addAccount(host, user, res.i);
+				await addAccount(localHost, user, res.i);
 				resolve({ id: res.id, token: res.i });
 			},
 			cancelled: () => {
@@ -365,7 +365,7 @@ export function getAccountWithSignupDialog(): Promise<{ id: string, token: strin
 			done: async (res: Misskey.entities.SignupResponse) => {
 				const user = JSON.parse(JSON.stringify(res));
 				delete user.token;
-				await addAccount(host, user, res.token);
+				await addAccount(localHost, user, res.token);
 				resolve({ id: res.id, token: res.token });
 			},
 			cancelled: () => {
diff --git a/packages/frontend/src/aiscript/api.ts b/packages/frontend/src/aiscript/api.ts
index 3a476787fe..4cc7c88963 100644
--- a/packages/frontend/src/aiscript/api.ts
+++ b/packages/frontend/src/aiscript/api.ts
@@ -5,7 +5,7 @@
 
 import { errors, utils, values } from '@syuilo/aiscript';
 import * as Misskey from 'misskey-js';
-import { url, lang } from '@@/js/config.js';
+import { webUrl, lang } from '@@/js/config.js';
 import { assertStringAndIsIn } from './common.js';
 import * as os from '@/os.js';
 import { misskeyApi } from '@/utility/misskey-api.js';
@@ -39,7 +39,7 @@ export function createAiScriptEnv(opts: { storageKey: string, token?: string })
 		USER_USERNAME: $i ? values.STR($i.username) : values.NULL,
 		CUSTOM_EMOJIS: utils.jsToVal(customEmojis.value),
 		LOCALE: values.STR(lang),
-		SERVER_URL: values.STR(url),
+		SERVER_URL: values.STR(webUrl),
 		'Mk:dialog': values.FN_NATIVE(async ([_title, _text, _type]) => {
 			let title: string | undefined = undefined;
 			let text: string | undefined = undefined;
diff --git a/packages/frontend/src/components/MkAccountMoved.vue b/packages/frontend/src/components/MkAccountMoved.vue
index cb8032c019..e101c04793 100644
--- a/packages/frontend/src/components/MkAccountMoved.vue
+++ b/packages/frontend/src/components/MkAccountMoved.vue
@@ -16,7 +16,7 @@ import { ref } from 'vue';
 import * as Misskey from 'misskey-js';
 import MkMention from './MkMention.vue';
 import { i18n } from '@/i18n.js';
-import { host as localHost } from '@@/js/config.js';
+import { localHost } from '@@/js/config.js';
 import { misskeyApi } from '@/utility/misskey-api.js';
 
 const user = ref<Misskey.entities.UserLite>();
diff --git a/packages/frontend/src/components/MkDonation.vue b/packages/frontend/src/components/MkDonation.vue
index 0e0da64750..b7ee704b47 100644
--- a/packages/frontend/src/components/MkDonation.vue
+++ b/packages/frontend/src/components/MkDonation.vue
@@ -19,13 +19,23 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<div :class="$style.text">
 			<I18n :src="i18n.ts.pleaseDonate" tag="span">
 				<template #host>
-					{{ instance.name ?? host }}
+					{{ instance.name ?? webHost }}
 				</template>
 			</I18n>
 			<div style="margin-top: 0.2em;">
 				<MkLink target="_blank" url="https://misskey-hub.net/docs/for-users/resources/donate/">{{ i18n.ts.learnMore }}</MkLink>
 			</div>
 		</div>
+		<div v-if="instance.donationUrl" :class="$style.text">
+			<I18n :src="i18n.ts.pleaseDonateInstance" tag="span">
+				<template #host>
+					{{ instance.name ?? webHost }}
+				</template>
+			</I18n>
+			<div style="margin-top: 0.2em;">
+				<MkLink target="_blank" :url="instance.donationUrl">{{ i18n.ts.learnMore }}</MkLink>
+			</div>
+		</div>
 		<div class="_buttons">
 			<MkButton @click="close">{{ i18n.ts.remindMeLater }}</MkButton>
 			<MkButton @click="neverShow">{{ i18n.ts.neverShow }}</MkButton>
@@ -38,7 +48,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import MkButton from '@/components/MkButton.vue';
 import MkLink from '@/components/MkLink.vue';
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import { i18n } from '@/i18n.js';
 import * as os from '@/os.js';
 import { miLocalStorage } from '@/local-storage.js';
diff --git a/packages/frontend/src/components/MkEmbedCodeGenDialog.vue b/packages/frontend/src/components/MkEmbedCodeGenDialog.vue
index 9002669378..1f9ccfbbbe 100644
--- a/packages/frontend/src/components/MkEmbedCodeGenDialog.vue
+++ b/packages/frontend/src/components/MkEmbedCodeGenDialog.vue
@@ -86,7 +86,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script setup lang="ts">
 import { useTemplateRef, ref, computed, nextTick, onMounted, onDeactivated, onUnmounted } from 'vue';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { embedRouteWithScrollbar } from '@@/js/embed-page.js';
 import type { EmbeddableEntity, EmbedParams } from '@@/js/embed-page.js';
 import MkModalWindow from '@/components/MkModalWindow.vue';
@@ -149,7 +149,7 @@ const embedPreviewUrl = computed(() => {
 		const maxHeight = parseInt(paramClass.get('maxHeight')!);
 		paramClass.set('maxHeight', maxHeight === 0 ? '500' : Math.min(maxHeight, 700).toString()); // プレビューであまりにも縮小されると見づらいため、700pxまでに制限
 	}
-	return `${url}/embed/${props.entity}/${props.id}${paramClass.toString() ? '?' + paramClass.toString() : ''}`;
+	return `${webUrl}/embed/${props.entity}/${props.id}${paramClass.toString() ? '?' + paramClass.toString() : ''}`;
 });
 
 const isEmbedWithScrollbar = computed(() => embedRouteWithScrollbar.includes(props.entity));
diff --git a/packages/frontend/src/components/MkFollowButton.vue b/packages/frontend/src/components/MkFollowButton.vue
index 72a24411c1..f13baa88db 100644
--- a/packages/frontend/src/components/MkFollowButton.vue
+++ b/packages/frontend/src/components/MkFollowButton.vue
@@ -37,7 +37,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { onBeforeUnmount, onMounted, ref } from 'vue';
 import * as Misskey from 'misskey-js';
-import { host } from '@@/js/config.js';
+import { localHost } from '@@/js/config.js';
 import * as os from '@/os.js';
 import { misskeyApi } from '@/utility/misskey-api.js';
 import { useStream } from '@/stream.js';
@@ -84,7 +84,7 @@ async function onClick() {
 	const isLoggedIn = await pleaseLogin({
 		openOnRemote: {
 			type: 'web',
-			path: `/@${props.user.username}@${props.user.host ?? host}`,
+			path: `/@${props.user.username}@${props.user.host ?? localHost}`,
 		},
 	});
 	if (!isLoggedIn) return;
diff --git a/packages/frontend/src/components/MkLink.vue b/packages/frontend/src/components/MkLink.vue
index 163f172f57..fc685f5486 100644
--- a/packages/frontend/src/components/MkLink.vue
+++ b/packages/frontend/src/components/MkLink.vue
@@ -16,7 +16,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { defineAsyncComponent, ref } from 'vue';
-import { url as local } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { maybeMakeRelative } from '@@/js/url.js';
 import type { MkABehavior } from '@/components/global/MkA.vue';
 import { useTooltip } from '@/composables/use-tooltip.js';
@@ -30,7 +30,7 @@ const props = withDefaults(defineProps<{
 }>(), {
 });
 
-const maybeRelativeUrl = maybeMakeRelative(props.url, local);
+const maybeRelativeUrl = maybeMakeRelative(props.url, webUrl);
 const self = maybeRelativeUrl !== props.url;
 const attr = self ? 'to' : 'href';
 const target = self ? null : '_blank';
diff --git a/packages/frontend/src/components/MkMention.vue b/packages/frontend/src/components/MkMention.vue
index f2cf33eb65..3aa7b96772 100644
--- a/packages/frontend/src/components/MkMention.vue
+++ b/packages/frontend/src/components/MkMention.vue
@@ -16,7 +16,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { toUnicode } from 'punycode.js';
 import { computed } from 'vue';
-import { host as localHost } from '@@/js/config.js';
+import { localHost } from '@@/js/config.js';
 import type { MkABehavior } from '@/components/global/MkA.vue';
 import { $i } from '@/i.js';
 import { getStaticImageUrl } from '@/utility/media-proxy.js';
diff --git a/packages/frontend/src/components/MkNote.vue b/packages/frontend/src/components/MkNote.vue
index c78cc44425..ffca11120e 100644
--- a/packages/frontend/src/components/MkNote.vue
+++ b/packages/frontend/src/components/MkNote.vue
@@ -201,7 +201,7 @@ import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
 import { isLink } from '@@/js/is-link.js';
 import { shouldCollapsed } from '@@/js/collapsed.js';
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import type { Ref } from 'vue';
 import type { MenuItem } from '@/types/menu.js';
 import type { OpenOnRemoteOptions } from '@/utility/please-login.js';
@@ -324,7 +324,7 @@ const renoteCollapsed = ref(
 
 const pleaseLoginContext = computed<OpenOnRemoteOptions>(() => ({
 	type: 'lookup',
-	url: `https://${host}/notes/${appearNote.id}`,
+	url: `https://${webHost}/notes/${appearNote.id}`,
 }));
 
 /* eslint-disable no-redeclare */
diff --git a/packages/frontend/src/components/MkNoteDetailed.vue b/packages/frontend/src/components/MkNoteDetailed.vue
index 083e3e5da0..2b56a8635d 100644
--- a/packages/frontend/src/components/MkNoteDetailed.vue
+++ b/packages/frontend/src/components/MkNoteDetailed.vue
@@ -235,7 +235,7 @@ import { computed, inject, markRaw, provide, ref, useTemplateRef } from 'vue';
 import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
 import { isLink } from '@@/js/is-link.js';
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import type { OpenOnRemoteOptions } from '@/utility/please-login.js';
 import type { Keymap } from '@/utility/hotkey.js';
 import MkNoteSub from '@/components/MkNoteSub.vue';
@@ -344,7 +344,7 @@ useGlobalEvent('noteDeleted', (noteId) => {
 
 const pleaseLoginContext = computed<OpenOnRemoteOptions>(() => ({
 	type: 'lookup',
-	url: `https://${host}/notes/${appearNote.id}`,
+	url: `https://${webHost}/notes/${appearNote.id}`,
 }));
 
 const keymap = {
diff --git a/packages/frontend/src/components/MkPageWindow.vue b/packages/frontend/src/components/MkPageWindow.vue
index d21e09a984..4ced057e0a 100644
--- a/packages/frontend/src/components/MkPageWindow.vue
+++ b/packages/frontend/src/components/MkPageWindow.vue
@@ -31,7 +31,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { computed, onMounted, onUnmounted, provide, ref, useTemplateRef } from 'vue';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import type { PageMetadata } from '@/page.js';
 import RouterView from '@/components/global/RouterView.vue';
 import MkWindow from '@/components/MkWindow.vue';
@@ -133,14 +133,14 @@ const contextmenu = computed(() => ([{
 	icon: 'ti ti-external-link',
 	text: i18n.ts.openInNewTab,
 	action: () => {
-		window.open(url + windowRouter.getCurrentFullPath(), '_blank', 'noopener');
+		window.open(webUrl + windowRouter.getCurrentFullPath(), '_blank', 'noopener');
 		windowEl.value?.close();
 	},
 }, {
 	icon: 'ti ti-link',
 	text: i18n.ts.copyLink,
 	action: () => {
-		copyToClipboard(url + windowRouter.getCurrentFullPath());
+		copyToClipboard(webUrl + windowRouter.getCurrentFullPath());
 	},
 }]));
 
diff --git a/packages/frontend/src/components/MkPoll.vue b/packages/frontend/src/components/MkPoll.vue
index 31567d2b84..373142823d 100644
--- a/packages/frontend/src/components/MkPoll.vue
+++ b/packages/frontend/src/components/MkPoll.vue
@@ -29,7 +29,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { computed, ref, watch } from 'vue';
 import * as Misskey from 'misskey-js';
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import type { OpenOnRemoteOptions } from '@/utility/please-login.js';
 import { sum } from '@/utility/array.js';
 import { pleaseLogin } from '@/utility/please-login.js';
@@ -84,7 +84,7 @@ if (!closed.value) {
 
 const pleaseLoginContext = computed<OpenOnRemoteOptions>(() => ({
 	type: 'lookup',
-	url: `https://${host}/notes/${props.noteId}`,
+	url: `https://${webHost}/notes/${props.noteId}`,
 }));
 
 const vote = async (id: number) => {
diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue
index d709286041..b0e665acf2 100644
--- a/packages/frontend/src/components/MkPostForm.vue
+++ b/packages/frontend/src/components/MkPostForm.vue
@@ -119,7 +119,7 @@ import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
 import insertTextAtCursor from 'insert-text-at-cursor';
 import { toASCII } from 'punycode.js';
-import { host, url } from '@@/js/config.js';
+import { localHost, webUrl } from '@@/js/config.js';
 import MkUploaderItems from './MkUploaderItems.vue';
 import type { ShallowRef } from 'vue';
 import type { PostFormProps } from '@/types/post-form.js';
@@ -355,7 +355,7 @@ if (props.mention) {
 	text.value += ' ';
 }
 
-if (replyTargetNote.value && (replyTargetNote.value.user.username !== $i.username || (replyTargetNote.value.user.host != null && replyTargetNote.value.user.host !== host))) {
+if (replyTargetNote.value && (replyTargetNote.value.user.username !== $i.username || (replyTargetNote.value.user.host != null && replyTargetNote.value.user.host !== localHost))) {
 	text.value = `@${replyTargetNote.value.user.username}${replyTargetNote.value.user.host != null ? '@' + toASCII(replyTargetNote.value.user.host) : ''} `;
 }
 
@@ -371,7 +371,7 @@ if (replyTargetNote.value && replyTargetNote.value.text != null) {
 				`@${x.username}@${toASCII(otherHost)}`;
 
 		// 自分は除外
-		if ($i.username === x.username && (x.host == null || x.host === host)) continue;
+		if ($i.username === x.username && (x.host == null || x.host === localHost)) continue;
 
 		// 重複は除外
 		if (text.value.includes(`${mention} `)) continue;
@@ -769,7 +769,7 @@ async function onPaste(ev: ClipboardEvent) {
 
 	const paste = ev.clipboardData.getData('text');
 
-	if (!renoteTargetNote.value && !quoteId.value && paste.startsWith(url + '/notes/')) {
+	if (!renoteTargetNote.value && !quoteId.value && paste.startsWith(webUrl + '/notes/')) {
 		ev.preventDefault();
 
 		const { canceled } = await os.confirm({
@@ -1119,7 +1119,7 @@ async function post(ev?: PointerEvent) {
 				'https://open.spotify.com/track/7anfcaNPQWlWCwyCHmZqNy',
 				'https://open.spotify.com/track/5Odr16TvEN4my22K9nbH7l',
 				'https://open.spotify.com/album/5bOlxyl4igOrp2DwVQxBco',
-			].some(url => text.includes(url))) {
+			].some(webUrl => text.includes(webUrl))) {
 				claimAchievement('brainDiver');
 			}
 
diff --git a/packages/frontend/src/components/MkPreview.vue b/packages/frontend/src/components/MkPreview.vue
index c589cd9685..dd3c1bbf48 100644
--- a/packages/frontend/src/components/MkPreview.vue
+++ b/packages/frontend/src/components/MkPreview.vue
@@ -41,7 +41,7 @@ import { chooseDriveFile } from '@/utility/drive.js';
 
 const text = ref('');
 const flag = ref(true);
-const mfm = ref(`Hello world! This is an @example mention. BTW you are @${$i ? $i.username : 'guest'}.\nAlso, here is ${config.url} and [example link](${config.url}). for more details, see https://example.com.\nAs you know #misskey is open-source software.`);
+const mfm = ref(`Hello world! This is an @example mention. BTW you are @${$i ? $i.username : 'guest'}.\nAlso, here is ${config.webUrl} and [example link](${config.webUrl}). for more details, see https://example.com.\nAs you know #misskey is open-source software.`);
 
 const openDialog = async () => {
 	await os.alert({
diff --git a/packages/frontend/src/components/MkSignin.input.vue b/packages/frontend/src/components/MkSignin.input.vue
index 89ec6373cf..b3343ea805 100644
--- a/packages/frontend/src/components/MkSignin.input.vue
+++ b/packages/frontend/src/components/MkSignin.input.vue
@@ -57,7 +57,7 @@ import { ref } from 'vue';
 import { toUnicode } from 'punycode.js';
 
 import { query, extractDomain } from '@@/js/url.js';
-import { host as configHost } from '@@/js/config.js';
+import { localHost as configHost } from '@@/js/config.js';
 import type { OpenOnRemoteOptions } from '@/utility/please-login.js';
 import { i18n } from '@/i18n.js';
 import * as os from '@/os.js';
diff --git a/packages/frontend/src/components/MkSignupDialog.form.vue b/packages/frontend/src/components/MkSignupDialog.form.vue
index 68ba09980a..874f38e0ed 100644
--- a/packages/frontend/src/components/MkSignupDialog.form.vue
+++ b/packages/frontend/src/components/MkSignupDialog.form.vue
@@ -104,7 +104,7 @@ const emit = defineEmits<{
 	(ev: 'signupEmailPending'): void;
 }>();
 
-const host = toUnicode(config.host);
+const host = toUnicode(config.webHost);
 
 const hcaptcha = ref<Captcha | undefined>();
 const mcaptcha = ref<Captcha | undefined>();
diff --git a/packages/frontend/src/components/MkSourceCodeAvailablePopup.vue b/packages/frontend/src/components/MkSourceCodeAvailablePopup.vue
index 4c197ed43e..f4b80050bf 100644
--- a/packages/frontend/src/components/MkSourceCodeAvailablePopup.vue
+++ b/packages/frontend/src/components/MkSourceCodeAvailablePopup.vue
@@ -15,14 +15,14 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<div :class="$style.title">
 			<I18n :src="i18n.ts.aboutX" tag="span">
 				<template #x>
-					{{ instance.name ?? host }}
+					{{ instance.name ?? webHost }}
 				</template>
 			</I18n>
 		</div>
 		<div :class="$style.text">
 			<I18n :src="i18n.ts._aboutMisskey.thisIsModifiedVersion" tag="span">
 				<template #name>
-					{{ instance.name ?? host }}
+					{{ instance.name ?? webHost }}
 				</template>
 			</I18n>
 			<I18n :src="i18n.ts.correspondingSourceIsAvailable" tag="span">
@@ -41,7 +41,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import MkButton from '@/components/MkButton.vue';
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import { i18n } from '@/i18n.js';
 import { instance } from '@/instance.js';
 import { miLocalStorage } from '@/local-storage.js';
diff --git a/packages/frontend/src/components/MkTutorialDialog.vue b/packages/frontend/src/components/MkTutorialDialog.vue
index d6abbf6504..99aa04091c 100644
--- a/packages/frontend/src/components/MkTutorialDialog.vue
+++ b/packages/frontend/src/components/MkTutorialDialog.vue
@@ -133,7 +133,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 									<a href="https://misskey-hub.net/docs/for-users/" target="_blank" class="_link">{{ i18n.ts.help }}</a>
 								</template>
 							</I18n>
-							<div>{{ i18n.tsx._initialAccountSetting.haveFun({ name: instance.name ?? host }) }}</div>
+							<div>{{ i18n.tsx._initialAccountSetting.haveFun({ name: instance.name ?? webHost }) }}</div>
 							<div class="_buttonsCenter" style="margin-top: 16px;">
 								<MkButton v-if="initialPage !== 4" rounded @click="page--"><i class="ti ti-arrow-left"></i> {{ i18n.ts.goBack }}</MkButton>
 								<MkButton rounded primary gradate @click="close(false)">{{ i18n.ts.close }}</MkButton>
@@ -149,7 +149,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { ref, useTemplateRef, watch } from 'vue';
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import MkModalWindow from '@/components/MkModalWindow.vue';
 import MkButton from '@/components/MkButton.vue';
 import XNote from '@/components/MkTutorialDialog.Note.vue';
diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue
index 7c0c06398b..0be7bc2798 100644
--- a/packages/frontend/src/components/MkUrlPreview.vue
+++ b/packages/frontend/src/components/MkUrlPreview.vue
@@ -84,7 +84,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { defineAsyncComponent, onDeactivated, onUnmounted, ref } from 'vue';
-import { url as local } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { versatileLang } from '@@/js/intl-const.js';
 import type { summaly } from '@misskey-dev/summaly';
 import { i18n } from '@/i18n.js';
@@ -112,7 +112,7 @@ const props = withDefaults(defineProps<{
 const MOBILE_THRESHOLD = 500;
 const isMobile = ref(deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD);
 
-const maybeRelativeUrl = maybeMakeRelative(props.url, local);
+const maybeRelativeUrl = maybeMakeRelative(props.url, webUrl);
 const self = maybeRelativeUrl !== props.url;
 const attr = self ? 'to' : 'href';
 const target = self ? null : '_blank';
diff --git a/packages/frontend/src/components/MkUserSelectDialog.vue b/packages/frontend/src/components/MkUserSelectDialog.vue
index 057af49a36..319fd5a5c0 100644
--- a/packages/frontend/src/components/MkUserSelectDialog.vue
+++ b/packages/frontend/src/components/MkUserSelectDialog.vue
@@ -25,7 +25,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 					<template #label>{{ i18n.ts.username }}</template>
 					<template #prefix>@</template>
 				</MkInput>
-				<MkInput v-model="host" :datalist="[hostname]" @update:modelValue="search">
+				<MkInput v-model="host" :datalist="[localHostname]" @update:modelValue="search">
 					<template #label>{{ i18n.ts.host }}</template>
 					<template #prefix>@</template>
 				</MkInput>
@@ -63,7 +63,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { onMounted, ref, computed, useTemplateRef } from 'vue';
 import * as Misskey from 'misskey-js';
-import { host as currentHost, hostname } from '@@/js/config.js';
+import { localHostname } from '@@/js/config.js';
 import MkInput from '@/components/MkInput.vue';
 import FormSplit from '@/components/form/split.vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';
diff --git a/packages/frontend/src/components/MkUserSetupDialog.vue b/packages/frontend/src/components/MkUserSetupDialog.vue
index b4ef35c221..6fa31b4340 100644
--- a/packages/frontend/src/components/MkUserSetupDialog.vue
+++ b/packages/frontend/src/components/MkUserSetupDialog.vue
@@ -93,7 +93,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						<div class="_gaps" style="text-align: center;">
 							<i class="ti ti-bell-ringing-2" style="display: block; margin: auto; font-size: 3em; color: var(--MI_THEME-accent);"></i>
 							<div style="font-size: 120%;">{{ i18n.ts.pushNotification }}</div>
-							<div style="padding: 0 16px;">{{ i18n.tsx._initialAccountSetting.pushNotificationDescription({ name: instance.name ?? host }) }}</div>
+							<div style="padding: 0 16px;">{{ i18n.tsx._initialAccountSetting.pushNotificationDescription({ name: instance.name ?? webHost }) }}</div>
 							<MkPushNotificationAllowButton primary showOnlyToRegister style="margin: 0 auto;"/>
 							<div class="_buttonsCenter" style="margin-top: 16px;">
 								<MkButton rounded data-cy-user-setup-back @click="page--"><i class="ti ti-arrow-left"></i> {{ i18n.ts.goBack }}</MkButton>
@@ -110,7 +110,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						<div class="_gaps" style="text-align: center;">
 							<i class="ti ti-check" style="display: block; margin: auto; font-size: 3em; color: var(--MI_THEME-accent);"></i>
 							<div style="font-size: 120%;">{{ i18n.ts._initialAccountSetting.initialAccountSettingCompleted }}</div>
-							<div>{{ i18n.tsx._initialAccountSetting.youCanContinueTutorial({ name: instance.name ?? host }) }}</div>
+							<div>{{ i18n.tsx._initialAccountSetting.youCanContinueTutorial({ name: instance.name ?? webHost }) }}</div>
 							<div class="_buttonsCenter" style="margin-top: 16px;">
 								<MkButton rounded primary gradate data-cy-user-setup-continue @click="launchTutorial()">{{ i18n.ts._initialAccountSetting.startTutorial }} <i class="ti ti-arrow-right"></i></MkButton>
 							</div>
@@ -129,7 +129,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { ref, useTemplateRef, watch, nextTick, defineAsyncComponent } from 'vue';
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import MkModalWindow from '@/components/MkModalWindow.vue';
 import MkButton from '@/components/MkButton.vue';
 import XProfile from '@/components/MkUserSetupDialog.Profile.vue';
diff --git a/packages/frontend/src/components/global/MkA.vue b/packages/frontend/src/components/global/MkA.vue
index 7d2908d4be..92396ee8f5 100644
--- a/packages/frontend/src/components/global/MkA.vue
+++ b/packages/frontend/src/components/global/MkA.vue
@@ -15,7 +15,7 @@ export type MkABehavior = 'window' | 'browser' | null;
 
 <script lang="ts" setup>
 import { computed, inject, useTemplateRef } from 'vue';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import * as os from '@/os.js';
 import { copyToClipboard } from '@/utility/copy-to-clipboard.js';
 import { i18n } from '@/i18n.js';
@@ -76,7 +76,7 @@ function onContextmenu(ev: PointerEvent) {
 		icon: 'ti ti-link',
 		text: i18n.ts.copyLink,
 		action: () => {
-			copyToClipboard(`${url}${props.to}`);
+			copyToClipboard(`${webUrl}${props.to}`);
 		},
 	}], ev);
 }
diff --git a/packages/frontend/src/components/global/MkAcct.vue b/packages/frontend/src/components/global/MkAcct.vue
index ff794d9b6e..2a8bd0ccc8 100644
--- a/packages/frontend/src/components/global/MkAcct.vue
+++ b/packages/frontend/src/components/global/MkAcct.vue
@@ -13,12 +13,12 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import * as Misskey from 'misskey-js';
 import { toUnicode } from 'punycode.js';
-import { host as hostRaw } from '@@/js/config.js';
+import { localHost } from '@@/js/config.js';
 
 defineProps<{
 	user: Misskey.entities.UserLite;
 	detail?: boolean;
 }>();
 
-const host = toUnicode(hostRaw);
+const host = toUnicode(localHost);
 </script>
diff --git a/packages/frontend/src/components/global/MkAd.vue b/packages/frontend/src/components/global/MkAd.vue
index c592079f03..14a1c71e10 100644
--- a/packages/frontend/src/components/global/MkAd.vue
+++ b/packages/frontend/src/components/global/MkAd.vue
@@ -30,7 +30,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		</component>
 	</div>
 	<div v-else :class="$style.menu">
-		<div>Ads by {{ host }}</div>
+		<div>Ads by {{ webHost }}</div>
 		<!--<MkButton class="button" primary>{{ i18n.ts._ad.like }}</MkButton>-->
 		<MkButton v-if="chosen.ratio !== 0" :class="$style.menuButton" @click="reduceFrequency">{{ i18n.ts._ad.reduceFrequencyOfThisAd }}</MkButton>
 		<button class="_textButton" @click="toggleMenu">{{ i18n.ts._ad.back }}</button>
@@ -40,7 +40,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { ref, computed } from 'vue';
-import { url as local, host } from '@@/js/config.js';
+import { webUrl as local, webHost } from '@@/js/config.js';
 import { i18n } from '@/i18n.js';
 import { instance } from '@/instance.js';
 import MkButton from '@/components/MkButton.vue';
diff --git a/packages/frontend/src/components/global/MkMfm.ts b/packages/frontend/src/components/global/MkMfm.ts
index 706ea07417..2423703e12 100644
--- a/packages/frontend/src/components/global/MkMfm.ts
+++ b/packages/frontend/src/components/global/MkMfm.ts
@@ -6,7 +6,7 @@
 import { h } from 'vue';
 import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
-import { host } from '@@/js/config.js';
+import { localHost } from '@@/js/config.js';
 import type { VNode, SetupContext } from 'vue';
 import type { MkABehavior } from '@/components/global/MkA.vue';
 import MkUrl from '@/components/global/MkUrl.vue';
@@ -369,7 +369,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
 			case 'mention': {
 				return [h(MkMention, {
 					key: Math.random(),
-					host: (token.props.host == null && props.author && props.author.host != null ? props.author.host : token.props.host) ?? host,
+					host: (token.props.host == null && props.author && props.author.host != null ? props.author.host : token.props.host) ?? localHost,
 					username: token.props.username,
 					navigationBehavior: props.linkNavigationBehavior,
 				})];
diff --git a/packages/frontend/src/components/global/MkUrl.vue b/packages/frontend/src/components/global/MkUrl.vue
index 159af6f11e..b4c968cedf 100644
--- a/packages/frontend/src/components/global/MkUrl.vue
+++ b/packages/frontend/src/components/global/MkUrl.vue
@@ -27,7 +27,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { defineAsyncComponent, ref } from 'vue';
 import { toUnicode as decodePunycode } from 'punycode.js';
-import { url as local } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { maybeMakeRelative } from '@@/js/url.js';
 import type { MkABehavior } from '@/components/global/MkA.vue';
 import * as os from '@/os.js';
@@ -51,7 +51,7 @@ const props = withDefaults(defineProps<{
 	showUrlPreview: true,
 });
 
-const maybeRelativeUrl = maybeMakeRelative(props.url, local);
+const maybeRelativeUrl = maybeMakeRelative(props.url, webUrl);
 const self = maybeRelativeUrl !== props.url;
 const url = new URL(props.url);
 if (!['http:', 'https:'].includes(url.protocol)) throw new Error('invalid url');
diff --git a/packages/frontend/src/filters/user.ts b/packages/frontend/src/filters/user.ts
index d9bc316764..a69a27deb6 100644
--- a/packages/frontend/src/filters/user.ts
+++ b/packages/frontend/src/filters/user.ts
@@ -4,7 +4,7 @@
  */
 
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 
 export const acct = (user: Misskey.Acct) => {
 	return Misskey.acct.toString(user);
@@ -15,5 +15,5 @@ export const userName = (user: Misskey.entities.User) => {
 };
 
 export const userPage = (user: Misskey.Acct, path?: string, absolute = false) => {
-	return `${absolute ? url : ''}/@${acct(user)}${(path ? `/${path}` : '')}`;
+	return `${absolute ? webUrl : ''}/@${acct(user)}${(path ? `/${path}` : '')}`;
 };
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';
diff --git a/packages/frontend/src/preferences/manager.ts b/packages/frontend/src/preferences/manager.ts
index 7f3949f81b..2cc9b584fd 100644
--- a/packages/frontend/src/preferences/manager.ts
+++ b/packages/frontend/src/preferences/manager.ts
@@ -5,7 +5,7 @@
 
 import { customRef, ref, watch, onScopeDispose } from 'vue';
 import { EventEmitter } from 'eventemitter3';
-import { host, version } from '@@/js/config.js';
+import { localHost, version } from '@@/js/config.js';
 import { PREF_DEF } from './def.js';
 import type { Ref } from 'vue';
 import type { MenuItem } from '@/types/menu.js';
@@ -153,28 +153,28 @@ function normalizePreferences(preferences: PossiblyNonNormalizedPreferencesProfi
 			const v = getInitialPrefValue(key as keyof typeof PREF_DEF);
 			if (isAccountDependentKey(key as keyof typeof PREF_DEF)) {
 				data[key] = account ? [[makeScope({}), v, {}], [makeScope({
-					server: host,
+					server: localHost,
 					account: account.id,
 				}), v, {}]] : [[makeScope({}), v, {}]];
 			} else if (isServerDependentKey(key as keyof typeof PREF_DEF)) {
 				data[key] = [[makeScope({
-					server: host,
+					server: localHost,
 				}), v, {}]];
 			} else {
 				data[key] = [[makeScope({}), v, {}]];
 			}
 			continue;
 		} else {
-			if (account && isAccountDependentKey(key as keyof typeof PREF_DEF) && !records.some(([scope]) => parseScope(scope).server === host && parseScope(scope).account === account.id)) {
+			if (account && isAccountDependentKey(key as keyof typeof PREF_DEF) && !records.some(([scope]) => parseScope(scope).server === localHost && parseScope(scope).account === account.id)) {
 				data[key] = records.concat([[makeScope({
-					server: host,
+					server: localHost,
 					account: account.id,
 				}), getInitialPrefValue(key as keyof typeof PREF_DEF), {}]]);
 				continue;
 			}
-			if (account && isServerDependentKey(key as keyof typeof PREF_DEF) && !records.some(([scope]) => parseScope(scope).server === host)) {
+			if (account && isServerDependentKey(key as keyof typeof PREF_DEF) && !records.some(([scope]) => parseScope(scope).server === localHost)) {
 				data[key] = records.concat([[makeScope({
-					server: host,
+					server: localHost,
 				}), getInitialPrefValue(key as keyof typeof PREF_DEF), {}]]);
 				continue;
 			}
@@ -271,7 +271,7 @@ export class PreferencesManager extends EventEmitter<PreferencesManagerEvents> {
 
 		if (parseScope(record[0]).account == null && isAccountDependentKey(key) && currentAccount != null) {
 			this.profile.preferences[key].push([makeScope({
-				server: host,
+				server: localHost,
 				account: currentAccount.id,
 			}), v, {}]);
 			_save();
@@ -280,7 +280,7 @@ export class PreferencesManager extends EventEmitter<PreferencesManagerEvents> {
 
 		if (parseScope(record[0]).server == null && isServerDependentKey(key)) {
 			this.profile.preferences[key].push([makeScope({
-				server: host,
+				server: localHost,
 			}), v, {}]);
 			_save();
 			return;
@@ -399,10 +399,10 @@ export class PreferencesManager extends EventEmitter<PreferencesManagerEvents> {
 			return record;
 		}
 
-		const accountOverrideRecord = records.find(([scope, v]) => parseScope(scope).server === host && parseScope(scope).account === currentAccount.id);
+		const accountOverrideRecord = records.find(([scope, v]) => parseScope(scope).server === localHost && parseScope(scope).account === currentAccount.id);
 		if (accountOverrideRecord) return accountOverrideRecord;
 
-		const serverOverrideRecord = records.find(([scope, v]) => parseScope(scope).server === host && parseScope(scope).account == null);
+		const serverOverrideRecord = records.find(([scope, v]) => parseScope(scope).server === localHost && parseScope(scope).account == null);
 		if (serverOverrideRecord) return serverOverrideRecord;
 
 		const record = records.find(([scope, v]) => parseScope(scope).account == null);
@@ -416,7 +416,7 @@ export class PreferencesManager extends EventEmitter<PreferencesManagerEvents> {
 	public isAccountOverrided<K extends keyof PREF>(key: K): boolean {
 		const currentAccount = this.currentAccount; // TSを黙らせるため
 		if (currentAccount == null) return false;
-		return this.profile.preferences[key].some(([scope, v]) => parseScope(scope).server === host && parseScope(scope).account === currentAccount.id);
+		return this.profile.preferences[key].some(([scope, v]) => parseScope(scope).server === localHost && parseScope(scope).account === currentAccount.id);
 	}
 
 	public setAccountOverride<K extends keyof PREF>(key: K) {
@@ -427,7 +427,7 @@ export class PreferencesManager extends EventEmitter<PreferencesManagerEvents> {
 
 		const records = this.profile.preferences[key];
 		records.push([makeScope({
-			server: host,
+			server: localHost,
 			account: currentAccount.id,
 		}), this.s[key], {}]);
 
@@ -441,7 +441,7 @@ export class PreferencesManager extends EventEmitter<PreferencesManagerEvents> {
 
 		const records = this.profile.preferences[key];
 
-		const index = records.findIndex(([scope, v]) => parseScope(scope).server === host && parseScope(scope).account === currentAccount.id);
+		const index = records.findIndex(([scope, v]) => parseScope(scope).server === localHost && parseScope(scope).account === currentAccount.id);
 		if (index === -1) return;
 
 		records.splice(index, 1);
diff --git a/packages/frontend/src/ui/_common_/common.ts b/packages/frontend/src/ui/_common_/common.ts
index 7ad18fc2a8..e7ee19ae8f 100644
--- a/packages/frontend/src/ui/_common_/common.ts
+++ b/packages/frontend/src/ui/_common_/common.ts
@@ -4,10 +4,10 @@
  */
 
 import { defineAsyncComponent } from 'vue';
-import { host } from '@@/js/config.js';
 import type { MenuItem } from '@/types/menu.js';
 import * as os from '@/os.js';
 import { instance } from '@/instance.js';
+import { webHost } from '@@/js/config.js';
 import { i18n } from '@/i18n.js';
 import { $i } from '@/i.js';
 
@@ -54,7 +54,7 @@ export function openInstanceMenu(ev: PointerEvent) {
 	const menuItems: MenuItem[] = [];
 
 	menuItems.push({
-		text: instance.name ?? host,
+		text: instance.name ?? webHost,
 		type: 'label',
 	}, {
 		type: 'link',
diff --git a/packages/frontend/src/ui/_common_/titlebar.vue b/packages/frontend/src/ui/_common_/titlebar.vue
index 1b9d47ec40..f09ef1c480 100644
--- a/packages/frontend/src/ui/_common_/titlebar.vue
+++ b/packages/frontend/src/ui/_common_/titlebar.vue
@@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <div :class="$style.root">
 	<div :class="$style.title">
 		<img :src="instance.iconUrl || '/favicon.ico'" alt="" :class="$style.instanceIcon"/>
-		<span :class="$style.instanceTitle">{{ instance.name ?? host }}</span>
+		<span :class="$style.instanceTitle">{{ instance.name ?? webHost }}</span>
 	</div>
 	<div :class="$style.controls">
 		<span :class="$style.left">
@@ -20,7 +20,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import { ref } from 'vue';
 import { instance } from '@/instance.js';
 import { prefer } from '@/preferences.js';
diff --git a/packages/frontend/src/utility/get-embed-code.ts b/packages/frontend/src/utility/get-embed-code.ts
index 5817d7ece8..4487b74519 100644
--- a/packages/frontend/src/utility/get-embed-code.ts
+++ b/packages/frontend/src/utility/get-embed-code.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 import { defineAsyncComponent } from 'vue';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { defaultEmbedParams, embedRouteWithScrollbar } from '@@/js/embed-page.js';
 import type { EmbedParams, EmbeddableEntity } from '@@/js/embed-page.js';
 import { genId } from '@/utility/id.js';
@@ -54,8 +54,8 @@ export function getEmbedCode(path: string, params?: EmbedParams): string {
 	}
 
 	const iframeCode = [
-		`<iframe src="${url + path + paramString}" data-misskey-embed-id="${iframeId}" loading="lazy" referrerpolicy="strict-origin-when-cross-origin" style="border: none; width: 100%; max-width: 500px; height: 300px; color-scheme: light dark;"></iframe>`,
-		`<script defer src="${url}/embed.js"></script>`,
+		`<iframe src="${webUrl + path + paramString}" data-misskey-embed-id="${iframeId}" loading="lazy" referrerpolicy="strict-origin-when-cross-origin" style="border: none; width: 100%; max-width: 500px; height: 300px; color-scheme: light dark;"></iframe>`,
+		`<script defer src="${webUrl}/embed.js"></script>`,
 	];
 	return iframeCode.join('\n');
 }
diff --git a/packages/frontend/src/utility/get-note-menu.ts b/packages/frontend/src/utility/get-note-menu.ts
index 78176970f1..a630d3405a 100644
--- a/packages/frontend/src/utility/get-note-menu.ts
+++ b/packages/frontend/src/utility/get-note-menu.ts
@@ -4,7 +4,7 @@
  */
 
 import * as Misskey from 'misskey-js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { claimAchievement } from './achievements.js';
 import type { Ref, ShallowRef } from 'vue';
 import type { MenuItem } from '@/types/menu.js';
@@ -140,7 +140,7 @@ export function getAbuseNoteMenu(note: Misskey.entities.Note, text: string): Men
 		icon: 'ti ti-exclamation-circle',
 		text,
 		action: async (): Promise<void> => {
-			const localUrl = `${url}/notes/${note.id}`;
+			const localUrl = `${webUrl}/notes/${note.id}`;
 			let noteInfo = '';
 			if (note.url ?? note.uri != null) noteInfo = `Note: ${note.url ?? note.uri}\n`;
 			noteInfo += `Local Note: ${localUrl}\n`;
@@ -159,7 +159,7 @@ export function getCopyNoteLinkMenu(note: Misskey.entities.Note, text: string):
 		icon: 'ti ti-link',
 		text,
 		action: (): void => {
-			copyToClipboard(`${url}/notes/${note.id}`);
+			copyToClipboard(`${webUrl}/notes/${note.id}`);
 		},
 	};
 }
@@ -279,7 +279,7 @@ export function getNoteMenu(props: {
 		navigator.share({
 			title: i18n.tsx.noteOf({ user: appearNote.user.name ?? appearNote.user.username }),
 			text: appearNote.text ?? '',
-			url: `${url}/notes/${appearNote.id}`,
+			url: `${webUrl}/notes/${appearNote.id}`,
 		});
 	}
 
diff --git a/packages/frontend/src/utility/get-user-menu.ts b/packages/frontend/src/utility/get-user-menu.ts
index 9b2c53360c..fc77ec8e54 100644
--- a/packages/frontend/src/utility/get-user-menu.ts
+++ b/packages/frontend/src/utility/get-user-menu.ts
@@ -6,7 +6,7 @@
 import { toUnicode } from 'punycode.js';
 import { defineAsyncComponent, ref, watch } from 'vue';
 import * as Misskey from 'misskey-js';
-import { host, url } from '@@/js/config.js';
+import { localHost, webUrl } from '@@/js/config.js';
 import type { Router } from '@/router.js';
 import type { MenuItem } from '@/types/menu.js';
 import { i18n } from '@/i18n.js';
@@ -171,7 +171,7 @@ export function getUserMenu(user: Misskey.entities.UserDetailed, router: Router
 		icon: 'ti ti-at',
 		text: i18n.ts.copyUsername,
 		action: () => {
-			copyToClipboard(`@${user.username}@${user.host ?? host}`);
+			copyToClipboard(`@${user.username}@${user.host ?? localHost}`);
 		},
 	});
 
@@ -180,7 +180,7 @@ export function getUserMenu(user: Misskey.entities.UserDetailed, router: Router
 		text: i18n.ts.copyProfileUrl,
 		action: () => {
 			const canonical = user.host === null ? `@${user.username}` : `@${user.username}@${toUnicode(user.host)}`;
-			copyToClipboard(`${url}/${canonical}`);
+			copyToClipboard(`${webUrl}/${canonical}`);
 		},
 	});
 
@@ -188,7 +188,7 @@ export function getUserMenu(user: Misskey.entities.UserDetailed, router: Router
 		icon: 'ti ti-rss',
 		text: i18n.ts.copyRSS,
 		action: () => {
-			copyToClipboard(`${user.host ?? host}/@${user.username}.atom`);
+			copyToClipboard(`${user.host ?? localHost}/@${user.username}.atom`);
 		},
 	});
 
diff --git a/packages/frontend/src/utility/image-frame-renderer/ImageFrameRenderer.ts b/packages/frontend/src/utility/image-frame-renderer/ImageFrameRenderer.ts
index 591a94b855..0a33caf238 100644
--- a/packages/frontend/src/utility/image-frame-renderer/ImageFrameRenderer.ts
+++ b/packages/frontend/src/utility/image-frame-renderer/ImageFrameRenderer.ts
@@ -4,7 +4,7 @@
  */
 
 import QRCodeStyling from 'qr-code-styling';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import ExifReader from 'exifreader';
 import { FN_frame } from './frame.js';
 import { ImageCompositor } from '@/lib/ImageCompositor.js';
@@ -159,7 +159,7 @@ export class ImageFrameRenderer {
 					height: labelCanvasCtx.canvas.height,
 					margin: 0,
 					type: 'canvas',
-					data: `${url}/users/${$i.id}`,
+					data: `${webUrl}/users/${$i.id}`,
 					//image: $i.avatarUrl,
 					qrOptions: {
 						typeNumber: 0,
diff --git a/packages/frontend/src/utility/media-proxy.ts b/packages/frontend/src/utility/media-proxy.ts
index 78eba35ead..d93c0448d1 100644
--- a/packages/frontend/src/utility/media-proxy.ts
+++ b/packages/frontend/src/utility/media-proxy.ts
@@ -4,14 +4,14 @@
  */
 
 import { MediaProxy } from '@@/js/media-proxy.js';
-import { url } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { instance } from '@/instance.js';
 
 let _mediaProxy: MediaProxy | null = null;
 
 export function getProxiedImageUrl(...args: Parameters<MediaProxy['getProxiedImageUrl']>): string {
 	if (_mediaProxy == null) {
-		_mediaProxy = new MediaProxy(instance, url);
+		_mediaProxy = new MediaProxy(instance, webUrl);
 	}
 
 	return _mediaProxy.getProxiedImageUrl(...args);
@@ -19,7 +19,7 @@ export function getProxiedImageUrl(...args: Parameters<MediaProxy['getProxiedIma
 
 export function getProxiedImageUrlNullable(...args: Parameters<MediaProxy['getProxiedImageUrlNullable']>): string | null {
 	if (_mediaProxy == null) {
-		_mediaProxy = new MediaProxy(instance, url);
+		_mediaProxy = new MediaProxy(instance, webUrl);
 	}
 
 	return _mediaProxy.getProxiedImageUrlNullable(...args);
@@ -27,7 +27,7 @@ export function getProxiedImageUrlNullable(...args: Parameters<MediaProxy['getPr
 
 export function getStaticImageUrl(...args: Parameters<MediaProxy['getStaticImageUrl']>): string {
 	if (_mediaProxy == null) {
-		_mediaProxy = new MediaProxy(instance, url);
+		_mediaProxy = new MediaProxy(instance, webUrl);
 	}
 
 	return _mediaProxy.getStaticImageUrl(...args);
diff --git a/packages/frontend/src/utility/popout.ts b/packages/frontend/src/utility/popout.ts
index 7e0222c459..cf5de9e22f 100644
--- a/packages/frontend/src/utility/popout.ts
+++ b/packages/frontend/src/utility/popout.ts
@@ -7,7 +7,7 @@ import { appendQuery } from '@@/js/url.js';
 import * as config from '@@/js/config.js';
 
 export function popout(path: string, w?: HTMLElement) {
-	let url = path.startsWith('http://') || path.startsWith('https://') ? path : config.url + path;
+	let url = path.startsWith('http://') || path.startsWith('https://') ? path : config.webUrl + path;
 	url = appendQuery(url, 'zen');
 	if (w) {
 		const position = w.getBoundingClientRect();
diff --git a/packages/frontend/src/utility/url-preview.ts b/packages/frontend/src/utility/url-preview.ts
index 5ed809a5af..11936f7ae6 100644
--- a/packages/frontend/src/utility/url-preview.ts
+++ b/packages/frontend/src/utility/url-preview.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 import { computed } from 'vue';
-import { hostname } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import { instance } from '@/instance.js';
 import { prefer } from '@/preferences.js';
 
@@ -18,7 +18,7 @@ export function transformPlayerUrl(url: string): string {
 	if (urlObj.hostname === 'player.twitch.tv' || urlObj.hostname === 'clips.twitch.tv') {
 		// TwitchはCSPの制約あり
 		// https://dev.twitch.tv/docs/embed/video-and-clips/
-		urlParams.set('parent', hostname);
+		urlParams.set('parent', webHost);
 		urlParams.set('allowfullscreen', '');
 		urlParams.set('autoplay', 'true');
 	} else {
diff --git a/packages/frontend/src/utility/watermark/WatermarkRenderer.ts b/packages/frontend/src/utility/watermark/WatermarkRenderer.ts
index 32341a9e10..52460f0d58 100644
--- a/packages/frontend/src/utility/watermark/WatermarkRenderer.ts
+++ b/packages/frontend/src/utility/watermark/WatermarkRenderer.ts
@@ -4,7 +4,7 @@
  */
 
 import QRCodeStyling from 'qr-code-styling';
-import { url, host } from '@@/js/config.js';
+import { webUrl } from '@@/js/config.js';
 import { getProxiedImageUrl } from '../media-proxy.js';
 import { fn as fn_watermark } from './watermark.js';
 import { fn as fn_stripe } from '@/utility/image-compositor-functions/stripe.js';
@@ -300,7 +300,7 @@ async function createTextureFromQr(options: { data: string | null }, resolution
 		height: resolution,
 		margin: 42,
 		type: 'canvas',
-		data: options.data == null || options.data === '' ? `${url}/users/${$i.id}` : options.data,
+		data: options.data == null || options.data === '' ? `${webUrl}/users/${$i.id}` : options.data,
 		image: $i.avatarUrl,
 		qrOptions: {
 			typeNumber: 0,
diff --git a/packages/frontend/src/widgets/WidgetInstanceInfo.vue b/packages/frontend/src/widgets/WidgetInstanceInfo.vue
index 7e6a779cf0..18a50ff97a 100644
--- a/packages/frontend/src/widgets/WidgetInstanceInfo.vue
+++ b/packages/frontend/src/widgets/WidgetInstanceInfo.vue
@@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<div :class="$style.bodyContainer">
 			<div :class="$style.body">
 				<MkA :class="$style.name" to="/about" behavior="window">{{ instance.name }}</MkA>
-				<div :class="$style.host">{{ host }}</div>
+				<div :class="$style.host">{{ webHost }}</div>
 			</div>
 		</div>
 	</div>
@@ -20,7 +20,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { host } from '@@/js/config.js';
+import { webHost } from '@@/js/config.js';
 import { useWidgetPropsManager } from './widget.js';
 import type { WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget.js';
 import type { FormWithDefault, GetFormResultType } from '@/utility/form.js';
diff --git a/packages/frontend/src/widgets/WidgetRss.vue b/packages/frontend/src/widgets/WidgetRss.vue
index 2495c5a6e9..32e652bb04 100644
--- a/packages/frontend/src/widgets/WidgetRss.vue
+++ b/packages/frontend/src/widgets/WidgetRss.vue
@@ -22,7 +22,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { ref, watch, computed } from 'vue';
 import * as Misskey from 'misskey-js';
-import { url as base } from '@@/js/config.js';
+import { webUrl as base } from '@@/js/config.js';
 import { useInterval } from '@@/js/use-interval.js';
 import { useWidgetPropsManager } from './widget.js';
 import { i18n } from '@/i18n.js';
diff --git a/packages/frontend/src/widgets/WidgetRssTicker.vue b/packages/frontend/src/widgets/WidgetRssTicker.vue
index 9ed21e6d00..d9f7e88995 100644
--- a/packages/frontend/src/widgets/WidgetRssTicker.vue
+++ b/packages/frontend/src/widgets/WidgetRssTicker.vue
@@ -36,7 +36,7 @@ import type { FormWithDefault, GetFormResultType } from '@/utility/form.js';
 import MkContainer from '@/components/MkContainer.vue';
 import { shuffle } from '@/utility/shuffle.js';
 import { i18n } from '@/i18n.js';
-import { url as base } from '@@/js/config.js';
+import { webUrl as base } from '@@/js/config.js';
 import { useInterval } from '@@/js/use-interval.js';
 
 const name = 'rssTicker';