From 6eb50b11385c6167fd9317cec02d36d861457083 Mon Sep 17 00:00:00 2001 From: "tangly1024.com" Date: Tue, 1 Aug 2023 12:47:33 +0800 Subject: [PATCH] =?UTF-8?q?isBrowser=E6=96=B9=E6=B3=95=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/Comment.js | 2 +- components/ExternalScript.js | 2 +- components/FullScreenButton.js | 2 +- components/NotionPage.js | 2 +- components/Twikoo.js | 3 +-- lib/global.js | 2 +- lib/lang.js | 2 +- lib/utils.js | 16 ++++++++-------- pages/[prefix]/index.js | 2 +- pages/archive/index.js | 2 +- themes/example/index.js | 2 +- themes/fukasawa/components/BlogListPage.js | 2 +- themes/fukasawa/index.js | 4 ++-- themes/gitbook/components/Catalog.js | 2 +- themes/gitbook/components/Progress.js | 2 +- themes/gitbook/index.js | 2 +- themes/heo/components/NavBar.js | 4 ++-- themes/heo/components/Swipe.js | 2 +- themes/hexo/components/Progress.js | 2 +- themes/hexo/index.js | 4 ++-- themes/matery/components/Progress.js | 2 +- themes/medium/components/Progress.js | 2 +- themes/medium/index.js | 2 +- themes/next/components/Progress.js | 2 +- themes/next/index.js | 6 +++--- themes/nobelium/index.js | 2 +- themes/plog/index.js | 2 +- themes/simple/index.js | 4 ++-- 28 files changed, 41 insertions(+), 42 deletions(-) diff --git a/components/Comment.js b/components/Comment.js index 2baebfbb..1b335fe7 100644 --- a/components/Comment.js +++ b/components/Comment.js @@ -62,7 +62,7 @@ const ValineComponent = dynamic(() => import('@/components/ValineComponent'), { const Comment = ({ frontMatter, className }) => { const router = useRouter() - if (isBrowser() && ('giscus' in router.query || router.query.target === 'comment')) { + if (isBrowser && ('giscus' in router.query || router.query.target === 'comment')) { setTimeout(() => { const url = router.asPath.replace('?target=comment', '') history.replaceState({}, '', url) diff --git a/components/ExternalScript.js b/components/ExternalScript.js index 62b6e95c..7f5d015d 100644 --- a/components/ExternalScript.js +++ b/components/ExternalScript.js @@ -8,7 +8,7 @@ import { isBrowser, loadExternalResource } from '@/lib/utils' * @returns */ const ExternalScript = () => { - if (isBrowser()) { + if (isBrowser) { // 静态导入本地自定义样式 loadExternalResource('/css/custom.css', 'css') loadExternalResource('/js/custom.js', 'js') diff --git a/components/FullScreenButton.js b/components/FullScreenButton.js index 053de666..6c7ec2e4 100644 --- a/components/FullScreenButton.js +++ b/components/FullScreenButton.js @@ -9,7 +9,7 @@ const FullScreenButton = () => { const [isFullScreen, setIsFullScreen] = useState(false) const handleFullScreenClick = () => { - if (!isBrowser()) { + if (!isBrowser) { return } const element = document.documentElement diff --git a/components/NotionPage.js b/components/NotionPage.js index 0ff61e11..1cbfad36 100644 --- a/components/NotionPage.js +++ b/components/NotionPage.js @@ -65,7 +65,7 @@ const NotionPage = ({ post, className }) => { // 将相册gallery下的图片加入放大功能 if (JSON.parse(BLOG.POST_DISABLE_GALLERY_CLICK)) { setTimeout(() => { - if (isBrowser()) { + if (isBrowser) { const imgList = document?.querySelectorAll('.notion-collection-card-cover img') if (imgList && zoomRef.current) { for (let i = 0; i < imgList.length; i++) { diff --git a/components/Twikoo.js b/components/Twikoo.js index 7b6080b6..233e77ad 100644 --- a/components/Twikoo.js +++ b/components/Twikoo.js @@ -13,8 +13,7 @@ import { useEffect } from 'react' const Twikoo = ({ isDarkMode }) => { const loadTwikoo = async () => { try { - const url = await loadExternalResource(BLOG.COMMENT_TWIKOO_CDN_URL, 'js') - console.log('twikoo 加载成功', url) + await loadExternalResource(BLOG.COMMENT_TWIKOO_CDN_URL, 'js') const twikoo = window.twikoo twikoo.init({ envId: BLOG.COMMENT_TWIKOO_ENV_ID, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app） diff --git a/lib/global.js b/lib/global.js index 04d0176e..c290a9e0 100644 --- a/lib/global.js +++ b/lib/global.js @@ -91,7 +91,7 @@ export function GlobalContextProvider(props) { * @param {*} setTheme */ const initTheme = () => { - if (isBrowser()) { + if (isBrowser) { setTimeout(() => { const elements = document.querySelectorAll('[id^="theme-"]') if (elements?.length > 1) { diff --git a/lib/lang.js b/lib/lang.js index 83f867b3..abc51354 100644 --- a/lib/lang.js +++ b/lib/lang.js @@ -64,7 +64,7 @@ export function generateLocaleDict(langString) { * 根据用户当前浏览器语言进行切换 */ export function initLocale(lang, locale, changeLang, changeLocale) { - if (isBrowser()) { + if (isBrowser) { const queryLang = getQueryVariable('lang') || loadLangFromCookies() || window.navigator.language let currentLang = lang if (queryLang !== lang) { diff --git a/lib/utils.js b/lib/utils.js index ef419793..5f5d864d 100644 --- a/lib/utils.js +++ b/lib/utils.js @@ -1,6 +1,12 @@ // 封装异步加载资源的方法 import { memo } from 'react' +/** + * 判断是否客户端 + * @returns {boolean} + */ +export const isBrowser = typeof window !== 'undefined' + /** * 组件持久化 */ @@ -58,7 +64,7 @@ export function loadExternalResource(url, type) { * @returns */ export function getQueryVariable(key) { - const query = isBrowser() ? window.location.search.substring(1) : '' + const query = isBrowser ? window.location.search.substring(1) : '' const vars = query.split('&') for (let i = 0; i < vars.length; i++) { const pair = vars[i].split('=') @@ -143,12 +149,6 @@ export function deepClone(obj) { */ export const delay = ms => new Promise(resolve => setTimeout(resolve, ms)) -/** - * 判断是否客户端 - * @returns {boolean} - */ -export const isBrowser = () => typeof window !== 'undefined' - /** * 获取从第1页到指定页码的文章 * @param pageIndex 第几页 @@ -168,7 +168,7 @@ export const getListByPage = function (list, pageIndex, pageSize) { */ export const isMobile = () => { let isMobile = false - if (!isBrowser()) { + if (!isBrowser) { return isMobile } diff --git a/pages/[prefix]/index.js b/pages/[prefix]/index.js index 5f6ac5c8..079f1a83 100644 --- a/pages/[prefix]/index.js +++ b/pages/[prefix]/index.js @@ -41,7 +41,7 @@ const Slug = props => { // 404 if (!post) { setTimeout(() => { - if (isBrowser()) { + if (isBrowser) { const article = document.getElementById('notion-article') if (!article) { router.push('/404').then(() => { diff --git a/pages/archive/index.js b/pages/archive/index.js index 1ef1f216..106ad7d2 100644 --- a/pages/archive/index.js +++ b/pages/archive/index.js @@ -15,7 +15,7 @@ const ArchiveIndex = props => { const Layout = getLayoutByTheme(useRouter()) useEffect(() => { - if (isBrowser()) { + if (isBrowser) { const anchor = window.location.hash if (anchor) { setTimeout(() => { diff --git a/themes/example/index.js b/themes/example/index.js index 0772f7fd..36ec9108 100644 --- a/themes/example/index.js +++ b/themes/example/index.js @@ -177,7 +177,7 @@ const LayoutSearch = props => { const slotTop =
const router = useRouter() useEffect(() => { - if (isBrowser()) { + if (isBrowser) { // 高亮搜索到的结果 const container = document.getElementById('posts-wrapper') if (keyword && container) { diff --git a/themes/fukasawa/components/BlogListPage.js b/themes/fukasawa/components/BlogListPage.js index b48655f2..30f0c38b 100644 --- a/themes/fukasawa/components/BlogListPage.js +++ b/themes/fukasawa/components/BlogListPage.js @@ -77,7 +77,7 @@ const BlogListPage = ({ page = 1, posts = [], postCount, siteInfo }) => { * @returns */ const calculateColumns = () => { - if (!isBrowser()) { + if (!isBrowser) { return 3 } else { if (window.innerWidth >= 1024) { diff --git a/themes/fukasawa/index.js b/themes/fukasawa/index.js index 6b5eb94b..2e867cde 100644 --- a/themes/fukasawa/index.js +++ b/themes/fukasawa/index.js @@ -57,7 +57,7 @@ const LayoutBase = (props) => { // 在组件卸载时保存 open 状态到本地存储中 useEffect(() => { - if (isBrowser()) { + if (isBrowser) { localStorage.setItem('fukasawa-sidebar-collapse', isCollapsed) } }, [isCollapsed]) @@ -149,7 +149,7 @@ const LayoutSearch = props => { const { keyword } = props const router = useRouter() useEffect(() => { - if (isBrowser()) { + if (isBrowser) { replaceSearchResult({ doms: document.getElementById('posts-wrapper'), search: keyword, diff --git a/themes/gitbook/components/Catalog.js b/themes/gitbook/components/Catalog.js index 5a51bee6..f6722511 100644 --- a/themes/gitbook/components/Catalog.js +++ b/themes/gitbook/components/Catalog.js @@ -49,7 +49,7 @@ const Catalog = ({ post }) => { } setActiveSection(currentSectionId) const index = tocIds.indexOf(currentSectionId) || 0 - if (isBrowser() && tocIds?.length > 0) { + if (isBrowser && tocIds?.length > 0) { for (const tocWrapper of document?.getElementsByClassName('toc-wrapper')) { tocWrapper?.scrollTo({ top: 28 * index, behavior: 'smooth' }) } diff --git a/themes/gitbook/components/Progress.js b/themes/gitbook/components/Progress.js index bca7a17d..669d09a8 100644 --- a/themes/gitbook/components/Progress.js +++ b/themes/gitbook/components/Progress.js @@ -10,7 +10,7 @@ const Progress = ({ targetRef, showPercent = true }) => { const currentRef = targetRef?.current || targetRef const [percent, changePercent] = useState(0) const scrollListener = () => { - const target = currentRef || (isBrowser() && document.getElementById('posts-wrapper')) + const target = currentRef || (isBrowser && document.getElementById('posts-wrapper')) if (target) { const clientHeight = target.clientHeight const scrollY = window.pageYOffset diff --git a/themes/gitbook/index.js b/themes/gitbook/index.js index cde4c530..d67dbb63 100644 --- a/themes/gitbook/index.js +++ b/themes/gitbook/index.js @@ -170,7 +170,7 @@ const LayoutIndex = (props) => { router.push(CONFIG.INDEX_PAGE).then(() => { // console.log('跳转到指定首页', CONFIG.INDEX_PAGE) setTimeout(() => { - if (isBrowser()) { + if (isBrowser) { const article = document.getElementById('notion-article') if (!article) { console.log('请检查您的Notion数据库中是否包含此slug页面： ', CONFIG.INDEX_PAGE) diff --git a/themes/heo/components/NavBar.js b/themes/heo/components/NavBar.js index cd1c205b..eff61f68 100644 --- a/themes/heo/components/NavBar.js +++ b/themes/heo/components/NavBar.js @@ -84,12 +84,12 @@ const NavBar = props => { } } - if (isBrowser()) { + if (isBrowser) { window.addEventListener('scroll', handleScroll) } return () => { - if (isBrowser()) { + if (isBrowser) { window.removeEventListener('scroll', handleScroll) } } diff --git a/themes/heo/components/Swipe.js b/themes/heo/components/Swipe.js index f8d4be3e..6afc5f27 100644 --- a/themes/heo/components/Swipe.js +++ b/themes/heo/components/Swipe.js @@ -11,7 +11,7 @@ export function Swipe({ items }) { const [activeIndex, setActiveIndex] = useState(0) const handleClick = (item) => { - if (isBrowser()) { + if (isBrowser) { window.open(item?.url) } } diff --git a/themes/hexo/components/Progress.js b/themes/hexo/components/Progress.js index 5b4f9b20..59ee1697 100644 --- a/themes/hexo/components/Progress.js +++ b/themes/hexo/components/Progress.js @@ -10,7 +10,7 @@ const Progress = ({ targetRef, showPercent = true }) => { const currentRef = targetRef?.current || targetRef const [percent, changePercent] = useState(0) const scrollListener = () => { - const target = currentRef || (isBrowser() && document.getElementById('article-wrapper')) + const target = currentRef || (isBrowser && document.getElementById('article-wrapper')) if (target) { const clientHeight = target.clientHeight const scrollY = window.pageYOffset diff --git a/themes/hexo/index.js b/themes/hexo/index.js index c07e70a0..e550c7b2 100644 --- a/themes/hexo/index.js +++ b/themes/hexo/index.js @@ -191,7 +191,7 @@ const LayoutSlug = props => { const { post, lock, validPassword } = props const drawerRight = useRef(null) - const targetRef = isBrowser() ? document.getElementById('article-wrapper') : null + const targetRef = isBrowser ? document.getElementById('article-wrapper') : null const floatSlot = <> {post?.toc?.length > 1 &&
@@ -254,7 +254,7 @@ const Layout404 = props => { useEffect(() => { // 延时3秒如果加载失败就返回首页 setTimeout(() => { - if (isBrowser()) { + if (isBrowser) { const article = document.getElementById('notion-article') if (!article) { router.push('/').then(() => { diff --git a/themes/matery/components/Progress.js b/themes/matery/components/Progress.js index d6a68fe8..dcdea5ba 100644 --- a/themes/matery/components/Progress.js +++ b/themes/matery/components/Progress.js @@ -11,7 +11,7 @@ const Progress = ({ targetRef, showPercent = true }) => { const [percent, changePercent] = useState(0) const scrollListener = () => { requestAnimationFrame(() => { - const target = currentRef || (isBrowser() && document.getElementById('article-wrapper')) + const target = currentRef || (isBrowser && document.getElementById('article-wrapper')) if (target) { const clientHeight = target.clientHeight const scrollY = window.pageYOffset diff --git a/themes/medium/components/Progress.js b/themes/medium/components/Progress.js index b57a3bb5..62e1cc87 100644 --- a/themes/medium/components/Progress.js +++ b/themes/medium/components/Progress.js @@ -10,7 +10,7 @@ const Progress = ({ targetRef, showPercent = true }) => { const currentRef = targetRef?.current || targetRef const [percent, changePercent] = useState(0) const scrollListener = () => { - const target = currentRef || (isBrowser() && document.getElementById('article-wrapper')) + const target = currentRef || (isBrowser && document.getElementById('article-wrapper')) if (target) { const clientHeight = target.clientHeight const scrollY = window.pageYOffset diff --git a/themes/medium/index.js b/themes/medium/index.js index 01d3f904..82811e46 100644 --- a/themes/medium/index.js +++ b/themes/medium/index.js @@ -206,7 +206,7 @@ const LayoutSearch = (props) => { const currentSearch = keyword || router?.query?.s useEffect(() => { - if (isBrowser()) { + if (isBrowser) { replaceSearchResult({ doms: document.getElementById('posts-wrapper'), search: keyword, diff --git a/themes/next/components/Progress.js b/themes/next/components/Progress.js index 2f29064d..8eab47e9 100644 --- a/themes/next/components/Progress.js +++ b/themes/next/components/Progress.js @@ -10,7 +10,7 @@ const Progress = ({ targetRef, showPercent = true }) => { const currentRef = targetRef?.current || targetRef const [percent, changePercent] = useState(0) const scrollListener = () => { - const target = currentRef || (isBrowser() && document.getElementById('article-wrapper')) + const target = currentRef || (isBrowser && document.getElementById('article-wrapper')) if (target) { const clientHeight = target.clientHeight const scrollY = window.pageYOffset diff --git a/themes/next/index.js b/themes/next/index.js index e3b079a0..93590525 100644 --- a/themes/next/index.js +++ b/themes/next/index.js @@ -161,7 +161,7 @@ const LayoutSearch = (props) => { const { posts, keyword } = props useEffect(() => { - if (isBrowser()) { + if (isBrowser) { replaceSearchResult({ doms: document.getElementById('posts-wrapper'), search: keyword, @@ -201,7 +201,7 @@ const Layout404 = props => { useEffect(() => { // 延时3秒如果加载失败就返回首页 setTimeout(() => { - const article = isBrowser() && document.getElementById('article-wrapper') + const article = isBrowser && document.getElementById('article-wrapper') if (!article) { router.push('/').then(() => { // console.log('找不到页面', router.asPath) @@ -253,7 +253,7 @@ const LayoutArchive = (props) => { const LayoutSlug = (props) => { const { post, lock, validPassword } = props const drawerRight = useRef(null) - const targetRef = isBrowser() ? document.getElementById('article-wrapper') : null + const targetRef = isBrowser ? document.getElementById('article-wrapper') : null const floatSlot =
{ drawerRight?.current?.handleSwitchVisible() diff --git a/themes/nobelium/index.js b/themes/nobelium/index.js index d9a930e0..d175e2c9 100644 --- a/themes/nobelium/index.js +++ b/themes/nobelium/index.js @@ -134,7 +134,7 @@ const LayoutPostList = props => { const LayoutSearch = props => { const { keyword } = props useEffect(() => { - if (isBrowser()) { + if (isBrowser) { replaceSearchResult({ doms: document.getElementById('posts-wrapper'), search: keyword, diff --git a/themes/plog/index.js b/themes/plog/index.js index 55895df4..0f44c2a4 100644 --- a/themes/plog/index.js +++ b/themes/plog/index.js @@ -132,7 +132,7 @@ const LayoutSearch = props => { const { keyword } = props useEffect(() => { - if (isBrowser()) { + if (isBrowser) { replaceSearchResult({ doms: document.getElementById('posts-wrapper'), search: keyword, diff --git a/themes/simple/index.js b/themes/simple/index.js index b0c9f95c..13d38a87 100644 --- a/themes/simple/index.js +++ b/themes/simple/index.js @@ -36,7 +36,7 @@ const LayoutBase = props => { const { children, slotTop, meta } = props const { onLoading } = useGlobal() - if (isBrowser()) { + if (isBrowser) { loadExternalResource('/css/theme-simple.css', 'css') } return ( @@ -122,7 +122,7 @@ const LayoutSearch = props => { const { keyword } = props useEffect(() => { - if (isBrowser()) { + if (isBrowser) { replaceSearchResult({ doms: document.getElementById('posts-wrapper'), search: keyword,