From 126826eb5a05fbb7ec5044269e6a25eb04154637 Mon Sep 17 00:00:00 2001 From: tamaina Date: Wed, 17 Feb 2021 21:36:56 +0900 Subject: [PATCH] Implement in-unison reload (#7196) * Resolve #6804 Implement unison reload * :v: * fix * Update share.vue fix Co-authored-by: syuilo --- package.json | 1 + src/client/account.ts | 3 +- src/client/init.ts | 4 ++ src/client/pages/settings/deck.vue | 5 +- src/client/pages/settings/general.vue | 3 +- src/client/pages/settings/index.vue | 3 +- src/client/pages/settings/other.vue | 3 +- src/client/pages/settings/plugin.install.vue | 3 +- src/client/pages/settings/plugin.manage.vue | 2 +- src/client/scripts/unison-reload.ts | 10 ++++ src/client/sidebar.ts | 7 +-- yarn.lock | 57 +++++++++++++++++++- 12 files changed, 89 insertions(+), 12 deletions(-) create mode 100644 src/client/scripts/unison-reload.ts diff --git a/package.json b/package.json index 5bcea83853..9062fbbec9 100644 --- a/package.json +++ b/package.json @@ -117,6 +117,7 @@ "aws-sdk": "2.840.0", "bcryptjs": "2.4.3", "blurhash": "1.1.3", + "broadcast-channel": "3.4.1", "bull": "3.20.1", "cafy": "15.2.1", "cbor": "6.0.1", diff --git a/src/client/account.ts b/src/client/account.ts index 05faeb3220..e5b451cf14 100644 --- a/src/client/account.ts +++ b/src/client/account.ts @@ -1,6 +1,7 @@ import { reactive } from 'vue'; import { apiUrl } from '@/config'; import { waiting } from '@/os'; +import { unisonReload } from '@/scripts/unison-reload'; // TODO: 他のタブと永続化されたstateを同期 @@ -75,7 +76,7 @@ export async function login(token: Account['token']) { const me = await fetchAccount(token); localStorage.setItem('account', JSON.stringify(me)); addAccount(me.id, token); - location.reload(); + unisonReload(); } // このファイルに書きたくないけどここに書かないと何故かVeturが認識しない diff --git a/src/client/init.ts b/src/client/init.ts index 146c54fa62..c60b25359b 100644 --- a/src/client/init.ts +++ b/src/client/init.ts @@ -59,6 +59,7 @@ import { search } from '@/scripts/search'; import { isMobile } from '@/scripts/is-mobile'; import { getThemes } from '@/theme-store'; import { initializeSw } from '@/scripts/initialize-sw'; +import { reloadChannel } from '@/scripts/unison-reload'; console.info(`Misskey v${version}`); @@ -106,6 +107,9 @@ if (defaultStore.state.reportError && !_DEV_) { // タッチデバイスでCSSの:hoverを機能させる document.addEventListener('touchend', () => {}, { passive: true }); +// 一斉リロード +reloadChannel.addEventListener('message', () => location.reload()); + //#region SEE: https://css-tricks.com/the-trick-to-viewport-units-on-mobile/ // TODO: いつの日にか消したい const vh = window.innerHeight * 0.01; diff --git a/src/client/pages/settings/deck.vue b/src/client/pages/settings/deck.vue index 30d36d4a06..cbc5edca94 100644 --- a/src/client/pages/settings/deck.vue +++ b/src/client/pages/settings/deck.vue @@ -40,6 +40,7 @@ import FormBase from '@/components/form/base.vue'; import FormGroup from '@/components/form/group.vue'; import { deckStore } from '@/ui/deck/deck-store'; import * as os from '@/os'; +import { unisonReload } from '@/scripts/unison-reload'; export default defineComponent({ components: { @@ -81,7 +82,7 @@ export default defineComponent({ }); if (canceled) return; - location.reload(); + unisonReload(); } }, @@ -99,7 +100,7 @@ export default defineComponent({ }); if (canceled) return; this.profile = name; - location.reload(); + unisonReload(); } } }); diff --git a/src/client/pages/settings/general.vue b/src/client/pages/settings/general.vue index 9314e14dab..0e741d474c 100644 --- a/src/client/pages/settings/general.vue +++ b/src/client/pages/settings/general.vue @@ -96,6 +96,7 @@ import { langs } from '@/config'; import { defaultStore } from '@/store'; import { ColdDeviceStorage } from '@/store'; import * as os from '@/os'; +import { unisonReload } from '@/scripts/unison-reload'; export default defineComponent({ components: { @@ -200,7 +201,7 @@ export default defineComponent({ }); if (canceled) return; - location.reload(); + unisonReload(); } } }); diff --git a/src/client/pages/settings/index.vue b/src/client/pages/settings/index.vue index 54bf56930d..1b4aa70eca 100644 --- a/src/client/pages/settings/index.vue +++ b/src/client/pages/settings/index.vue @@ -52,6 +52,7 @@ import FormBase from '@/components/form/base.vue'; import FormButton from '@/components/form/button.vue'; import { scroll } from '@/scripts/scroll'; import { signout } from '@/account'; +import { unisonReload } from '@/scripts/unison-reload'; export default defineComponent({ components: { @@ -160,7 +161,7 @@ export default defineComponent({ clear: () => { localStorage.removeItem('locale'); localStorage.removeItem('theme'); - location.reload(); + unisonReload(); }, faPalette, faPlug, faUser, faListUl, faLock, faLaugh, faCommentSlash, faMusic, faBell, faCogs, faEllipsisH, faBan, faShareAlt, faLockOpen, faKey, faBoxes, faEnvelope, faCloud, }; diff --git a/src/client/pages/settings/other.vue b/src/client/pages/settings/other.vue index c6ec9f6c0a..c0b9625098 100644 --- a/src/client/pages/settings/other.vue +++ b/src/client/pages/settings/other.vue @@ -40,6 +40,7 @@ import * as os from '@/os'; import { debug } from '@/config'; import { defaultStore } from '@/store'; import { signout } from '@/account'; +import { unisonReload } from '@/scripts/unison-reload'; export default defineComponent({ components: { @@ -76,7 +77,7 @@ export default defineComponent({ changeDebug(v) { console.log(v); localStorage.setItem('debug', v.toString()); - location.reload(); + unisonReload(); }, onChangeInjectFeaturedNote(v) { diff --git a/src/client/pages/settings/plugin.install.vue b/src/client/pages/settings/plugin.install.vue index 0873f28d23..0f6393f73c 100644 --- a/src/client/pages/settings/plugin.install.vue +++ b/src/client/pages/settings/plugin.install.vue @@ -28,6 +28,7 @@ import FormButton from '@/components/form/button.vue'; import MkInfo from '@/components/ui/info.vue'; import * as os from '@/os'; import { ColdDeviceStorage } from '@/store'; +import { unisonReload } from '@/scripts/unison-reload'; export default defineComponent({ components: { @@ -138,7 +139,7 @@ export default defineComponent({ os.success(); this.$nextTick(() => { - location.reload(); + unisonReload(); }); }, } diff --git a/src/client/pages/settings/plugin.manage.vue b/src/client/pages/settings/plugin.manage.vue index 88eeef2bb2..5fd93d8b72 100644 --- a/src/client/pages/settings/plugin.manage.vue +++ b/src/client/pages/settings/plugin.manage.vue @@ -76,7 +76,7 @@ export default defineComponent({ ColdDeviceStorage.set('plugins', this.plugins.filter(x => x.id !== plugin.id)); os.success(); this.$nextTick(() => { - location.reload(); + unisonReload(); }); }, diff --git a/src/client/scripts/unison-reload.ts b/src/client/scripts/unison-reload.ts new file mode 100644 index 0000000000..92556aefaa --- /dev/null +++ b/src/client/scripts/unison-reload.ts @@ -0,0 +1,10 @@ +// SafariがBroadcastChannel未実装なのでライブラリを使う +import { BroadcastChannel } from 'broadcast-channel'; + +export const reloadChannel = new BroadcastChannel<'reload'>('reload'); + +// BroadcastChannelを用いて、クライアントが一斉にreloadするようにします。 +export function unisonReload() { + reloadChannel.postMessage('reload'); + location.reload(); +} diff --git a/src/client/sidebar.ts b/src/client/sidebar.ts index d7822e9e02..3d23d2f1ce 100644 --- a/src/client/sidebar.ts +++ b/src/client/sidebar.ts @@ -5,6 +5,7 @@ import { search } from '@/scripts/search'; import * as os from '@/os'; import { i18n } from '@/i18n'; import { $i } from './account'; +import { unisonReload } from '@/scripts/unison-reload'; export const sidebarDef = { notifications: { @@ -133,13 +134,13 @@ export const sidebarDef = { text: i18n.locale.default, action: () => { localStorage.setItem('ui', 'default'); - location.reload(); + unisonReload(); } }, { text: i18n.locale.deck, action: () => { localStorage.setItem('ui', 'deck'); - location.reload(); + unisonReload(); } }, { text: 'Chat (β)', @@ -151,7 +152,7 @@ export const sidebarDef = { text: i18n.locale.desktop + ' (β)', action: () => { localStorage.setItem('ui', 'desktop'); - location.reload(); + unisonReload(); } }], ev.currentTarget || ev.target); }, diff --git a/yarn.lock b/yarn.lock index e258eeb1a4..783e17d4a7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -59,6 +59,13 @@ "@babel/helper-plugin-utils" "^7.12.13" semver "^5.5.1" +"@babel/runtime@^7.6.2", "@babel/runtime@^7.7.2": + version "7.12.13" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.12.13.tgz#0a21452352b02542db0ffb928ac2d3ca7cb6d66d" + integrity sha512-8+3UMPBrjFa/6TtKi/7sehPKqfAm4g6K+YQjyyFOLUTxzOngcRZTlAVY8sc2CORJYqdHQY8gRPHmn+qo15rCBw== + dependencies: + regenerator-runtime "^0.13.4" + "@babel/types@^7.12.0", "@babel/types@^7.6.1": version "7.12.7" resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.12.7.tgz#6039ff1e242640a29452c9ae572162ec9a8f5d13" @@ -1868,6 +1875,11 @@ bcryptjs@2.4.3: resolved "https://registry.yarnpkg.com/bcryptjs/-/bcryptjs-2.4.3.tgz#9ab5627b93e60621ff7cdac5da9733027df1d0cb" integrity sha1-mrVie5PmBiH/fNrF2pczAn3x0Ms= +big-integer@^1.6.16: + version "1.6.48" + resolved "https://registry.yarnpkg.com/big-integer/-/big-integer-1.6.48.tgz#8fd88bd1632cba4a1c8c3e3d7159f08bb95b4b9e" + integrity sha512-j51egjPa7/i+RdiRuJbPdJ2FIUYYPhvYLjzoYbcMMm62ooO6F94fETG4MTs46zPAF9Brs04OajboA/qTGuz78w== + big.js@^5.2.2: version "5.2.2" resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328" @@ -1948,6 +1960,19 @@ braces@^3.0.1, braces@~3.0.2: dependencies: fill-range "^7.0.1" +broadcast-channel@3.4.1: + version "3.4.1" + resolved "https://registry.yarnpkg.com/broadcast-channel/-/broadcast-channel-3.4.1.tgz#65b63068d0a5216026a19905c9b2d5e9adf0928a" + integrity sha512-VXYivSkuBeQY+pL5hNQQNvBdKKQINBAROm4G8lAbWQfOZ7Yn4TMcgLNlJyEqlkxy5G8JJBsI3VJ1u8FUTOROcg== + dependencies: + "@babel/runtime" "^7.7.2" + detect-node "^2.0.4" + js-sha3 "0.8.0" + microseconds "0.2.0" + nano-time "1.0.0" + rimraf "3.0.2" + unload "2.2.0" + browser-process-hrtime@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz#3c9b4b7d782c8121e56f10106d84c0d0ffc94626" @@ -3374,6 +3399,11 @@ detect-libc@^1.0.3: resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b" integrity sha1-+hN8S9aY7fVc1c0CrFWfkaTEups= +detect-node@^2.0.4: + version "2.0.4" + resolved "https://registry.yarnpkg.com/detect-node/-/detect-node-2.0.4.tgz#014ee8f8f669c5c58023da64b8179c083a28c46c" + integrity sha512-ZIzRpLJrOj7jjP2miAtgqIfmzbxa4ZOr5jJc601zklsfEx9oTzmmj2nVpIPRpNlRTIh8lc1kyViIY7BWSGNmKw== + dicer@0.2.5: version "0.2.5" resolved "https://registry.yarnpkg.com/dicer/-/dicer-0.2.5.tgz#5996c086bb33218c812c090bddc09cd12facb70f" @@ -5554,6 +5584,11 @@ js-beautify@^1.6.12: mkdirp "~1.0.3" nopt "^4.0.3" +js-sha3@0.8.0: + version "0.8.0" + resolved "https://registry.yarnpkg.com/js-sha3/-/js-sha3-0.8.0.tgz#b9b7a5da73afad7dedd0f8c463954cbde6818840" + integrity sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q== + js-stringify@^1.0.1: version "1.0.2" resolved "https://registry.yarnpkg.com/js-stringify/-/js-stringify-1.0.2.tgz#1736fddfd9724f28a3682adc6230ae7e4e9679db" @@ -6452,6 +6487,11 @@ micromatch@^4.0.0, micromatch@^4.0.2: braces "^3.0.1" picomatch "^2.0.5" +microseconds@0.2.0: + version "0.2.0" + resolved "https://registry.yarnpkg.com/microseconds/-/microseconds-0.2.0.tgz#233b25f50c62a65d861f978a4a4f8ec18797dc39" + integrity sha512-n7DHHMjR1avBbSpsTBj6fmMGh2AGrifVV4e+WYc3Q9lO+xnSZ3NyhcBND3vzzatt05LFhoKFRxrIyklmLlUtyA== + mime-db@1.44.0: version "1.44.0" resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.44.0.tgz#fa11c5eb0aca1334b4233cb4d52f10c5a6272f92" @@ -6644,6 +6684,13 @@ nan@^2.14.0, nan@^2.14.2: resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.2.tgz#f5376400695168f4cc694ac9393d0c9585eeea19" integrity sha512-M2ufzIiINKCuDfBSAUr1vWQ+vuVcA9kqx8JJUsbQi6yf1uGRyb7HfpdfUr5qLXf3B/t8dPvcjhKMmlfnP47EzQ== +nano-time@1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/nano-time/-/nano-time-1.0.0.tgz#b0554f69ad89e22d0907f7a12b0993a5d96137ef" + integrity sha1-sFVPaa2J4i0JB/ehKwmTpdlhN+8= + dependencies: + big-integer "^1.6.16" + nanoid@3.1.20, nanoid@^3.1.20: version "3.1.20" resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.20.tgz#badc263c6b1dcf14b71efaa85f6ab4c1d6cfc788" @@ -8702,7 +8749,7 @@ reflect-metadata@0.1.13, reflect-metadata@^0.1.13: resolved "https://registry.yarnpkg.com/reflect-metadata/-/reflect-metadata-0.1.13.tgz#67ae3ca57c972a2aa1642b10fe363fe32d49dc08" integrity sha512-Ts1Y/anZELhSsjMcU605fU9RE4Oi3p5ORujwbIKXfWa+0Zxs510Qrmrce5/Jowq3cHSZSJqBjypxmHarc+vEWg== -regenerator-runtime@0.13.7: +regenerator-runtime@0.13.7, regenerator-runtime@^0.13.4: version "0.13.7" resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz#cac2dacc8a1ea675feaabaeb8ae833898ae46f55" integrity sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew== @@ -10468,6 +10515,14 @@ unique-stream@^2.0.2: json-stable-stringify-without-jsonify "^1.0.1" through2-filter "^3.0.0" +unload@2.2.0: + version "2.2.0" + resolved "https://registry.yarnpkg.com/unload/-/unload-2.2.0.tgz#ccc88fdcad345faa06a92039ec0f80b488880ef7" + integrity sha512-B60uB5TNBLtN6/LsgAf3udH9saB5p7gqJwcFfbOEZ8BcBHnGwCf6G/TGiEqkRAxX7zAFIUtzdrXQSdL3Q/wqNA== + dependencies: + "@babel/runtime" "^7.6.2" + detect-node "^2.0.4" + unpipe@1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/unpipe/-/unpipe-1.0.0.tgz#b2bf4ee8514aae6165b4817829d21b2ef49904ec"