ストリーミングが不安定な問題を修正

src/client/pages/instance/metrics.vue

@@ -90,7 +90,7 @@ export default defineComponent({
 			stats: null,
 			serverInfo: null,
 			connection: null,
-			queueConnection: os.stream.useChannel('queueStats'),
+			queueConnection: markRaw(os.stream.useChannel('queueStats')),
 			memUsage: 0,
 			chartCpuMem: null,
 			chartNet: null,
@@ -121,7 +121,7 @@ export default defineComponent({
 		os.api('admin/server-info', {}).then(res => {
 			this.serverInfo = res;
 
-			this.connection = os.stream.useChannel('serverStats');
+			this.connection = markRaw(os.stream.useChannel('serverStats'));
 			this.connection.on('stats', this.onStats);
 			this.connection.on('statsLog', this.onStatsLog);
 			this.connection.send('requestLog', {

src/client/pages/instance/queue.vue

@@ -11,7 +11,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, markRaw } from 'vue';
 import MkButton from '@client/components/ui/button.vue';
 import XQueue from './queue.chart.vue';
 import FormBase from '@client/components/form/base.vue';
@@ -35,7 +35,7 @@ export default defineComponent({
 				title: this.$ts.jobQueue,
 				icon: 'fas fa-clipboard-list',
 			},
-			connection: os.stream.useChannel('queueStats'),
+			connection: markRaw(os.stream.useChannel('queueStats')),
 		}
 	},
 

src/client/pages/messaging/index.vue

@@ -37,7 +37,7 @@
 </template>
 
 <script lang="ts">
-import { defineAsyncComponent, defineComponent } from 'vue';
+import { defineAsyncComponent, defineComponent, markRaw } from 'vue';
 import { getAcct } from '@/misc/acct';
 import MkButton from '@client/components/ui/button.vue';
 import { acct } from '../../filters/user';
@@ -63,7 +63,7 @@ export default defineComponent({
 	},
 
 	mounted() {
-		this.connection = os.stream.useChannel('messagingIndex');
+		this.connection = markRaw(os.stream.useChannel('messagingIndex'));
 
 		this.connection.on('message', this.onMessage);
 		this.connection.on('read', this.onRead);

src/client/pages/messaging/messaging-room.vue

@@ -36,7 +36,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent } from 'vue';
+import { computed, defineComponent, markRaw } from 'vue';
 import XList from '@client/components/date-separated-list.vue';
 import XMessage from './messaging-room.message.vue';
 import XForm from './messaging-room.form.vue';
@@ -141,10 +141,10 @@ const Component = defineComponent({
 				this.group = group;
 			}
 
-			this.connection = os.stream.useChannel('messaging', {
+			this.connection = markRaw(os.stream.useChannel('messaging', {
 				otherparty: this.user ? this.user.id : undefined,
 				group: this.group ? this.group.id : undefined,
-			});
+			}));
 
 			this.connection.on('message', this.onMessage);
 			this.connection.on('read', this.onRead);

src/client/pages/reversi/game.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, markRaw } from 'vue';
 import GameSetting from './game.setting.vue';
 import GameBoard from './game.board.vue';
 import * as os from '@client/os';
@@ -61,9 +61,9 @@ export default defineComponent({
 				if (this.connection) {
 					this.connection.dispose();
 				}
-				this.connection = os.stream.useChannel('gamesReversiGame', {
+				this.connection = markRaw(os.stream.useChannel('gamesReversiGame', {
 					gameId: this.game.id
-				});
+				}));
 				this.connection.on('started', this.onStarted);
 			});
 		},

src/client/pages/reversi/index.vue

@@ -60,7 +60,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, markRaw } from 'vue';
 import * as os from '@client/os';
 import MkButton from '@client/components/ui/button.vue';
 import MkFolder from '@client/components/ui/folder.vue';
@@ -92,7 +92,7 @@ export default defineComponent({
 
 	mounted() {
 		if (this.$i) {
-			this.connection = os.stream.useChannel('gamesReversi');
+			this.connection = markRaw(os.stream.useChannel('gamesReversi'));
 
 			this.connection.on('invited', this.onInvited);