fix(MisskeyGateway): 処理をクライアント側で行うように

pages/mi-web.vue

@@ -1,5 +1,6 @@
 <template>
     <GMisskeyGateway
+        v-if="path"
         :action="actionConfig"
         :branding="{
             heading: $t('_goToMisskey.heading'),
@@ -10,6 +11,7 @@
 
 <script setup lang="ts">
 import WindowIco from 'bi/window.svg';
+import { parseQuery } from 'ufo';
 
 definePageMeta({
     layout: 'blank',
@@ -21,19 +23,11 @@ useHead({
     ],
 });
 
-const { meta, query } = useRoute();
+const { meta } = useRoute();
 const { t } = useI18n();
 
 // 遷移用パス
-const path = computed(() => {
-    if (!query.path || query.path.length == 0) return undefined;
-
-    if (Array.isArray(query.path)) {
-        return query.path[0] as string;
-    } else {
-        return query.path;
-    }
-});
+const path = ref<string | null>(null);
 
 const actionConfig = computed(() => {
     return {
@@ -42,6 +36,15 @@ const actionConfig = computed(() => {
     };
 });
 
+if (process.client) {
+    const query = parseQuery(location.search);
+    if (Array.isArray(query.path)) {
+        path.value = query.path[0] as string;
+    } else {
+        path.value = query.path;
+    }
+}
+
 meta.title = t('_goToMisskey.title');
 meta.scrollButton = false;
 </script>

pages/share.vue

@@ -7,6 +7,7 @@
     ></MkAnimBg>
     <GMisskeyGateway
         class="relative"
+        v-if="filteredQuery"
         :action="{
             type: 'link',
             path: `/share?${stringifyQuery(filteredQuery)}`,
@@ -16,7 +17,7 @@
 </template>
 
 <script setup lang="ts">
-import { stringifyQuery } from 'ufo';
+import { stringifyQuery, parseQuery } from 'ufo';
 
 definePageMeta({
     layout: 'blank',
@@ -28,26 +29,36 @@ useHead({
     ],
 });
 
-const { meta, query } = useRoute();
+const { meta } = useRoute();
 
-const manualInstance = (Array.isArray(query.manualInstance) ? query.manualInstance[0] : query.manualInstance) ?? undefined;
+const manualInstance = ref<string | undefined>();
 
-const filteredQuery = computed(() => ({
-    ...query,
-    replyId: undefined,
-    renoteId: undefined,
-    visibleUserIds: undefined,
-    fileIds: undefined,
-    manualInstance: undefined,
-}));
+const filteredQuery = ref<Record<string, any>>({});
 
 const isCanvasLoaded = ref(false);
 const showAnimBg = ref(false);
 
-if (process.client && window.innerWidth >= 768) {
-    showAnimBg.value = true;
+if (process.client) {
+    const query = parseQuery(location.search.slice(1));
+
+    filteredQuery.value = {
+        ...query,
+        replyId: undefined,
+        renoteId: undefined,
+        visibleUserIds: undefined,
+        fileIds: undefined,
+        manualInstance: undefined,
+    };
+
+    manualInstance.value = Array.isArray(query.manualInstance) ? query.manualInstance[0] : query.manualInstance ?? undefined;
 }
 
+onMounted(() => {
+    if (window.innerWidth >= 768) {
+        showAnimBg.value = true;
+    }
+});
+
 const { t } = useI18n();
 
 meta.title = t('_share.title');