fix(frontend): pull to refreshするたびにストリーミング全体の再接続が行われるのを修正

This commit is contained in:
syuilo 2023-11-10 17:52:50 +09:00
parent 253c0c42e2
commit 689b88b942
6 changed files with 5 additions and 28 deletions

View file

@ -8,7 +8,7 @@ import { common } from './common.js';
import { version, ui, lang, updateLocale } from '@/config.js'; import { version, ui, lang, updateLocale } from '@/config.js';
import { i18n, updateI18n } from '@/i18n.js'; import { i18n, updateI18n } from '@/i18n.js';
import { confirm, alert, post, popup, toast } from '@/os.js'; import { confirm, alert, post, popup, toast } from '@/os.js';
import { useStream, isReloading } from '@/stream.js'; import { useStream } from '@/stream.js';
import * as sound from '@/scripts/sound.js'; import * as sound from '@/scripts/sound.js';
import { $i, refreshAccount, login, updateAccount, signout } from '@/account.js'; import { $i, refreshAccount, login, updateAccount, signout } from '@/account.js';
import { defaultStore, ColdDeviceStorage } from '@/store.js'; import { defaultStore, ColdDeviceStorage } from '@/store.js';
@ -39,7 +39,6 @@ export async function mainBoot() {
let reloadDialogShowing = false; let reloadDialogShowing = false;
stream.on('_disconnected_', async () => { stream.on('_disconnected_', async () => {
if (isReloading) return;
if (defaultStore.state.serverDisconnectedBehavior === 'reload') { if (defaultStore.state.serverDisconnectedBehavior === 'reload') {
location.reload(); location.reload();
} else if (defaultStore.state.serverDisconnectedBehavior === 'dialog') { } else if (defaultStore.state.serverDisconnectedBehavior === 'dialog') {

View file

@ -13,7 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-only
import { computed, provide, onUnmounted } from 'vue'; import { computed, provide, onUnmounted } from 'vue';
import MkNotes from '@/components/MkNotes.vue'; import MkNotes from '@/components/MkNotes.vue';
import MkPullToRefresh from '@/components/MkPullToRefresh.vue'; import MkPullToRefresh from '@/components/MkPullToRefresh.vue';
import { useStream, reloadStream } from '@/stream.js'; import { useStream } from '@/stream.js';
import * as sound from '@/scripts/sound.js'; import * as sound from '@/scripts/sound.js';
import { $i } from '@/account.js'; import { $i } from '@/account.js';
import { instance } from '@/instance.js'; import { instance } from '@/instance.js';
@ -201,7 +201,6 @@ function reloadTimeline() {
tlNotesCount = 0; tlNotesCount = 0;
tlComponent.pagingComponent?.reload().then(() => { tlComponent.pagingComponent?.reload().then(() => {
reloadStream();
res(); res();
}); });
}); });

View file

@ -9,9 +9,6 @@ import { $i } from '@/account.js';
import { url } from '@/config.js'; import { url } from '@/config.js';
let stream: Misskey.Stream | null = null; let stream: Misskey.Stream | null = null;
let timeoutHeartBeat: number | null = null;
export let isReloading: boolean = false;
export function useStream(): Misskey.Stream { export function useStream(): Misskey.Stream {
if (stream) return stream; if (stream) return stream;
@ -20,20 +17,7 @@ export function useStream(): Misskey.Stream {
token: $i.token, token: $i.token,
} : null)); } : null));
timeoutHeartBeat = window.setTimeout(heartbeat, 1000 * 60); window.setTimeout(heartbeat, 1000 * 60);
return stream;
}
export function reloadStream() {
if (!stream) return useStream();
if (timeoutHeartBeat) window.clearTimeout(timeoutHeartBeat);
isReloading = true;
stream.close();
stream.once('_connected_', () => isReloading = false);
stream.stream.reconnect();
timeoutHeartBeat = window.setTimeout(heartbeat, 1000 * 60);
return stream; return stream;
} }
@ -42,5 +26,5 @@ function heartbeat(): void {
if (stream != null && document.visibilityState === 'visible') { if (stream != null && document.visibilityState === 'visible') {
stream.heartbeat(); stream.heartbeat();
} }
timeoutHeartBeat = window.setTimeout(heartbeat, 1000 * 60); window.setTimeout(heartbeat, 1000 * 60);
} }

View file

@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup> <script lang="ts" setup>
import { onUnmounted } from 'vue'; import { onUnmounted } from 'vue';
import { useStream, isReloading } from '@/stream.js'; import { useStream } from '@/stream.js';
import { i18n } from '@/i18n.js'; import { i18n } from '@/i18n.js';
import MkButton from '@/components/MkButton.vue'; import MkButton from '@/components/MkButton.vue';
import * as os from '@/os.js'; import * as os from '@/os.js';
@ -26,7 +26,6 @@ const zIndex = os.claimZIndex('high');
let hasDisconnected = $ref(false); let hasDisconnected = $ref(false);
function onDisconnected() { function onDisconnected() {
if (isReloading) return;
hasDisconnected = true; hasDisconnected = true;
} }

View file

@ -16,7 +16,6 @@ import { } from 'vue';
import XColumn from './column.vue'; import XColumn from './column.vue';
import { Column } from './deck-store.js'; import { Column } from './deck-store.js';
import MkNotes from '@/components/MkNotes.vue'; import MkNotes from '@/components/MkNotes.vue';
import { reloadStream } from '@/stream.js';
defineProps<{ defineProps<{
column: Column; column: Column;
@ -36,7 +35,6 @@ const tlComponent: InstanceType<typeof MkNotes> = $ref();
function reloadTimeline() { function reloadTimeline() {
return new Promise<void>((res) => { return new Promise<void>((res) => {
tlComponent.pagingComponent?.reload().then(() => { tlComponent.pagingComponent?.reload().then(() => {
reloadStream();
res(); res();
}); });
}); });

View file

@ -16,7 +16,6 @@ import { } from 'vue';
import XColumn from './column.vue'; import XColumn from './column.vue';
import { Column } from './deck-store.js'; import { Column } from './deck-store.js';
import MkNotes from '@/components/MkNotes.vue'; import MkNotes from '@/components/MkNotes.vue';
import { reloadStream } from '@/stream.js';
defineProps<{ defineProps<{
column: Column; column: Column;
@ -28,7 +27,6 @@ const tlComponent: InstanceType<typeof MkNotes> = $ref();
function reloadTimeline() { function reloadTimeline() {
return new Promise<void>((res) => { return new Promise<void>((res) => {
tlComponent.pagingComponent?.reload().then(() => { tlComponent.pagingComponent?.reload().then(() => {
reloadStream();
res(); res();
}); });
}); });