Add facebook Open Graph Url and image. Fix PATH env conflict with Vercel environment

2026-05-24 07:26:50 +00:00 · 2022-04-04 08:13:18 +08:00
parent 305a476f6f
commit ebdaf4273f
33 changed files with 901 additions and 469 deletions
--- a/pages/[slug].js
+++ b/pages/[slug].js
@@ -15,7 +15,7 @@ const Slug = props => {
  const ThemeComponents = ThemeMap[theme]
  const { post } = props
  if (!post) {
-    return <ThemeComponents.Layout404 {...props}/>
+    return <ThemeComponents.Layout404 {...props} />
  }

  // 文章锁🔐
@@ -43,15 +43,17 @@ const Slug = props => {
    title: `${post.title} | ${siteInfo.title}`,
    description: post.summary,
    type: 'article',
+    image: post.page_cover,
+    slug: post.slug,
    tags: post.tags
  }

  props = { ...props, meta, lock, setLock, validPassword }

-  return <ThemeComponents.LayoutSlug {...props} showArticleInfo={false}/>
+  return <ThemeComponents.LayoutSlug {...props} showArticleInfo={false} />
 }

-export async function getStaticPaths () {
+export async function getStaticPaths() {
  if (!BLOG.isProd) {
    return {
      paths: [],
@@ -61,7 +63,8 @@ export async function getStaticPaths () {

  const from = 'slug-paths'
  const { allPosts } = await getGlobalNotionData({ from, pageType: ['Page'] })
-  const filterPosts = allPosts?.filter(e => e?.slug?.indexOf('http') !== 0) || []
+  const filterPosts =
+    allPosts?.filter(e => e?.slug?.indexOf('http') !== 0) || []

  return {
    paths: filterPosts.map(row => ({ params: { slug: row.slug } })),
@@ -69,7 +72,7 @@ export async function getStaticPaths () {
  }
 }

-export async function getStaticProps ({ params: { slug } }) {
+export async function getStaticProps({ params: { slug } }) {
  const from = `slug-props-${slug}`
  const props = await getGlobalNotionData({ from, pageType: ['Page'] })
  const { allPosts } = props
--- a/pages/archive/index.js
+++ b/pages/archive/index.js
@@ -10,13 +10,14 @@ const ArchiveIndex = props => {
  const meta = {
    title: `${locale.NAV.ARCHIVE} | ${siteInfo.title}`,
    description: siteInfo.description,
+    slug: 'archive',
    type: 'website'
  }

-  return <ThemeComponents.LayoutArchive {...props} meta={meta}/>
+  return <ThemeComponents.LayoutArchive {...props} meta={meta} />
 }

-export async function getStaticProps () {
+export async function getStaticProps() {
  const props = await getGlobalNotionData({ from: 'archive-index' })
  props.posts = props.allPosts
  return {
--- a/pages/article/[slug].js
+++ b/pages/article/[slug].js
@@ -61,13 +61,17 @@ const Slug = props => {
    title: `${props.post.title} | ${siteInfo.title}`,
    description: props.post.summary,
    type: 'article',
+    slug: 'article/' + props.post.slug,
+    image: props.post.page_cover,
    tags: props.post.tags
  }

-  return <ThemeComponents.LayoutSlug {...props} showArticleInfo={true} meta={meta}/>
+  return (
+    <ThemeComponents.LayoutSlug {...props} showArticleInfo={true} meta={meta} />
+  )
 }

-export async function getStaticPaths () {
+export async function getStaticPaths() {
  if (!BLOG.isProd) {
    return {
      paths: [],
@@ -83,7 +87,7 @@ export async function getStaticPaths () {
  }
 }

-export async function getStaticProps ({ params: { slug } }) {
+export async function getStaticProps({ params: { slug } }) {
  const from = `slug-props-${slug}`
  const props = await getGlobalNotionData({ from, pageType: ['Post'] })
  const allPosts = props.allPosts
@@ -96,7 +100,11 @@ export async function getStaticProps ({ params: { slug } }) {
  const index = allPosts.indexOf(props.post)
  props.prev = allPosts.slice(index - 1, index)[0] ?? allPosts.slice(-1)[0]
  props.next = allPosts.slice(index + 1, index + 2)[0] ?? allPosts[0]
-  props.recommendPosts = getRecommendPost(props.post, allPosts, BLOG.POST_RECOMMEND_COUNT)
+  props.recommendPosts = getRecommendPost(
+    props.post,
+    allPosts,
+    BLOG.POST_RECOMMEND_COUNT
+  )
  return {
    props,
    revalidate: 1
@@ -110,7 +118,7 @@ export async function getStaticProps ({ params: { slug } }) {
 * @param {*} count
 * @returns
 */
-function getRecommendPost (post, allPosts, count = 6) {
+function getRecommendPost(post, allPosts, count = 6) {
  let recommendPosts = []
  const postIds = []
  const currentTags = post.tags || []
--- a/pages/category/[category].js
+++ b/pages/category/[category].js
@@ -3,23 +3,26 @@ import React from 'react'
 import { useGlobal } from '@/lib/global'
 import * as ThemeMap from '@/themes'

-export default function Category (props) {
+export default function Category(props) {
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
  const { siteInfo, posts } = props
  const { locale } = useGlobal()
  if (!posts) {
-    return <ThemeComponents.Layout404 {...props}/>
+    return <ThemeComponents.Layout404 {...props} />
  }
  const meta = {
-    title: `${props.category} | ${locale.COMMON.CATEGORY} | ${siteInfo?.title || ''}`,
+    title: `${props.category} | ${locale.COMMON.CATEGORY} | ${
+      siteInfo?.title || ''
+    }`,
    description: siteInfo?.description,
+    slug: 'category/' + props.category,
    type: 'website'
  }
  return <ThemeComponents.LayoutCategory {...props} meta={meta} />
 }

-export async function getStaticProps ({ params: { category } }) {
+export async function getStaticProps({ params: { category } }) {
  const from = 'category-props'
  let props = await getGlobalNotionData({ from })
  const posts = props.allPosts.filter(
@@ -33,11 +36,13 @@ export async function getStaticProps ({ params: { category } }) {
  }
 }

-export async function getStaticPaths () {
+export async function getStaticPaths() {
  const from = 'category-paths'
  const { categories } = await getGlobalNotionData({ from })
  return {
-    paths: Object.keys(categories).map(category => ({ params: { category: categories[category]?.name } })),
+    paths: Object.keys(categories).map(category => ({
+      params: { category: categories[category]?.name }
+    })),
    fallback: true
  }
 }
--- a/pages/category/index.js
+++ b/pages/category/index.js
@@ -3,7 +3,7 @@ import React from 'react'
 import { useGlobal } from '@/lib/global'
 import * as ThemeMap from '@/themes'

-export default function Category (props) {
+export default function Category(props) {
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
  const { locale } = useGlobal()
@@ -11,13 +11,17 @@ export default function Category (props) {
  const meta = {
    title: `${locale.COMMON.CATEGORY} | ${siteInfo.title}`,
    description: siteInfo.description,
+    slug: 'category',
    type: 'website'
  }
-  return <ThemeComponents.LayoutCategoryIndex {...props} meta={meta}/>
+  return <ThemeComponents.LayoutCategoryIndex {...props} meta={meta} />
 }

-export async function getStaticProps () {
-  const props = await getGlobalNotionData({ from: 'category-index-props', categoryCount: 0 })
+export async function getStaticProps() {
+  const props = await getGlobalNotionData({
+    from: 'category-index-props',
+    categoryCount: 0
+  })
  return {
    props,
    revalidate: 1
--- a/pages/index.js
+++ b/pages/index.js
@@ -3,19 +3,21 @@ import { getPostBlocks } from '@/lib/notion'
 import { getGlobalNotionData } from '@/lib/notion/getNotionData'
 import * as ThemeMap from '@/themes'
 import { useGlobal } from '@/lib/global'
-const Index = (props) => {
+const Index = props => {
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
-  return <ThemeComponents.LayoutIndex {...props}/>
+  return <ThemeComponents.LayoutIndex {...props} />
 }

-export async function getStaticProps () {
+export async function getStaticProps() {
  const from = 'index'
  const props = await getGlobalNotionData({ from, pageType: ['Post'] })
  const { allPosts, siteInfo } = props
  const meta = {
    title: `${siteInfo.title} | ${siteInfo.description}`,
    description: siteInfo.description,
+    image: siteInfo.pageCover,
+    slug: '',
    type: 'website'
  }

@@ -35,7 +37,11 @@ export async function getStaticProps () {
        if (post.password && post.password !== '') {
          continue
        }
-        const blockMap = await getPostBlocks(post.id, 'slug', BLOG.POST_PREVIEW_LINES)
+        const blockMap = await getPostBlocks(
+          post.id,
+          'slug',
+          BLOG.POST_PREVIEW_LINES
+        )
        if (blockMap) {
          post.blockMap = blockMap
        }
@@ -46,7 +52,8 @@ export async function getStaticProps () {

  return {
    props: {
-      meta, ...props
+      meta,
+      ...props
    },
    revalidate: 1
  }
--- a/pages/page/[page].js
+++ b/pages/page/[page].js
@@ -14,23 +14,26 @@ const Page = props => {
  const meta = {
    title: `${props.page} | Page | ${siteInfo.title}`,
    description: siteInfo.description,
+    slug: 'page/' + props.page,
    type: 'website'
  }
  return <ThemeComponents.LayoutPage {...props} meta={meta} />
 }

-export async function getStaticPaths () {
+export async function getStaticPaths() {
  const from = 'page-paths'
  const { postCount } = await getGlobalNotionData({ from })
  const totalPages = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
  return {
    // remove first page, we 're not gonna handle that.
-    paths: Array.from({ length: totalPages - 1 }, (_, i) => ({ params: { page: '' + (i + 2) } })),
+    paths: Array.from({ length: totalPages - 1 }, (_, i) => ({
+      params: { page: '' + (i + 2) }
+    })),
    fallback: true
  }
 }

-export async function getStaticProps ({ params: { page } }) {
+export async function getStaticProps({ params: { page } }) {
  const from = `page-${page}`
  const props = await getGlobalNotionData({ from })
  props.page = page
@@ -45,7 +48,11 @@ export async function getStaticProps ({ params: { page } }) {
      if (post.password && post.password !== '') {
        continue
      }
-      const blockMap = await getPostBlocks(post.id, 'slug', BLOG.POST_PREVIEW_LINES)
+      const blockMap = await getPostBlocks(
+        post.id,
+        'slug',
+        BLOG.POST_PREVIEW_LINES
+      )
      if (blockMap) {
        post.blockMap = blockMap
      }
--- a/pages/search/[keyword].js
+++ b/pages/search/[keyword].js
@@ -7,13 +7,22 @@ const Index = props => {
  const { keyword, siteInfo } = props
  const { locale } = useGlobal()
  const meta = {
-    title: `${keyword || ''} | ${locale.NAV.SEARCH} | ${siteInfo.title}`,
+    title: `${keyword || ''}${keyword ? ' | ' : ''}${locale.NAV.SEARCH} | ${
+      siteInfo.title
+    }`,
    description: siteInfo.title,
+    slug: 'search/' + (keyword || ''),
    type: 'website'
  }
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
-  return <ThemeComponents.LayoutSearch {...props} meta={meta} currentSearch={keyword} />
+  return (
+    <ThemeComponents.LayoutSearch
+      {...props}
+      meta={meta}
+      currentSearch={keyword}
+    />
+  )
 }

 /**
@@ -21,8 +30,11 @@ const Index = props => {
 * @param {*} param0
 * @returns
 */
-export async function getServerSideProps ({ params: { keyword } }) {
-  const props = await getGlobalNotionData({ from: 'search-props', pageType: ['Post'] })
+export async function getServerSideProps({ params: { keyword } }) {
+  const props = await getGlobalNotionData({
+    from: 'search-props',
+    pageType: ['Post']
+  })
  props.posts = await filterByMemCache(props.allPosts, keyword)
  props.keyword = keyword
  return {
@@ -37,7 +49,7 @@ export async function getServerSideProps ({ params: { keyword } }) {
 * @param key
 * @returns {*}
 */
-function appendText (sourceTextArray, targetObj, key) {
+function appendText(sourceTextArray, targetObj, key) {
  if (!targetObj) {
    return sourceTextArray
  }
@@ -54,7 +66,7 @@ function appendText (sourceTextArray, targetObj, key) {
 * @param {*} textArray
 * @returns
 */
-function getTextContent (textArray) {
+function getTextContent(textArray) {
  if (typeof textArray === 'object' && isIterable(textArray)) {
    let result = ''
    for (const textObj of textArray) {
@@ -71,7 +83,8 @@ function getTextContent (textArray) {
 * @param {*} obj
 * @returns
 */
-const isIterable = obj => obj != null && typeof obj[Symbol.iterator] === 'function'
+const isIterable = obj =>
+  obj != null && typeof obj[Symbol.iterator] === 'function'

 /**
 * 在内存缓存中进行全文索引
@@ -79,7 +92,7 @@ const isIterable = obj => obj != null && typeof obj[Symbol.iterator] === 'functi
 * @param keyword 关键词
 * @returns
 */
-async function filterByMemCache (allPosts, keyword) {
+async function filterByMemCache(allPosts, keyword) {
  const filterPosts = []
  for (const post of allPosts) {
    const cacheKey = 'page_block_' + post.id
--- a/pages/search/index.js
+++ b/pages/search/index.js
@@ -12,7 +12,8 @@ const Search = props => {
    filteredPosts = posts.filter(post => {
      const tagContent = post.tags ? post.tags.join(' ') : ''
      const categoryContent = post.category ? post.category.join(' ') : ''
-      const searchContent = post.title + post.summary + tagContent + categoryContent
+      const searchContent =
+        post.title + post.summary + tagContent + categoryContent
      return searchContent.toLowerCase().includes(searchKey.toLowerCase())
    })
  } else {
@@ -21,22 +22,35 @@ const Search = props => {

  const { locale } = useGlobal()
  const meta = {
-    title: `${searchKey || ''} | ${locale.NAV.SEARCH} | ${siteInfo.title}`,
+    title: `${searchKey || ''}${searchKey ? ' | ' : ''}${locale.NAV.SEARCH} | ${
+      siteInfo.title
+    }`,
    description: siteInfo.description,
+    slug: 'search',
    type: 'website'
  }

  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]

-  return <ThemeComponents.LayoutSearch {...props} posts={filteredPosts} currentSearch={searchKey} meta={meta} />
+  return (
+    <ThemeComponents.LayoutSearch
+      {...props}
+      posts={filteredPosts}
+      currentSearch={searchKey}
+      meta={meta}
+    />
+  )
 }

 /**
 * 浏览器前端搜索
 */
-export async function getStaticProps () {
-  const props = await getGlobalNotionData({ from: 'search-props', pageType: ['Post'] })
+export async function getStaticProps() {
+  const props = await getGlobalNotionData({
+    from: 'search-props',
+    pageType: ['Post']
+  })
  props.posts = props.allPosts
  return {
    props,
@@ -44,7 +58,7 @@ export async function getStaticProps () {
  }
 }

-function getSearchKey () {
+function getSearchKey() {
  const router = useRouter()
  if (router.query && router.query.s) {
    return router.query.s
--- a/pages/tag/[tag].js
+++ b/pages/tag/[tag].js
@@ -9,21 +9,28 @@ const Tag = props => {
  const { tag, siteInfo, posts } = props

  if (!posts) {
-    return <ThemeComponents.Layout404 {...props}/>
+    return <ThemeComponents.Layout404 {...props} />
  }

  const meta = {
    title: `${tag} | ${locale.COMMON.TAGS} | ${siteInfo?.title}`,
    description: siteInfo?.description,
+    slug: 'tag/' + tag,
    type: 'website'
  }
-  return <ThemeComponents.LayoutTag {...props} meta={meta}/>
+  return <ThemeComponents.LayoutTag {...props} meta={meta} />
 }

-export async function getStaticProps ({ params: { tag } }) {
-  const props = await getGlobalNotionData({ from: 'tag-props', includePage: false, tagsCount: 0 })
+export async function getStaticProps({ params: { tag } }) {
+  const props = await getGlobalNotionData({
+    from: 'tag-props',
+    includePage: false,
+    tagsCount: 0
+  })
  const { allPosts } = props
-  props.posts = allPosts.filter(post => post && post.tags && post.tags.includes(tag))
+  props.posts = allPosts.filter(
+    post => post && post.tags && post.tags.includes(tag)
+  )
  props.tag = tag
  return {
    props,
@@ -36,7 +43,7 @@ export async function getStaticProps ({ params: { tag } }) {
 * @returns
 * @param tags
 */
-function getTagNames (tags) {
+function getTagNames(tags) {
  const tagNames = []
  tags.forEach(tag => {
    tagNames.push(tag.name)
@@ -44,13 +51,15 @@ function getTagNames (tags) {
  return tagNames
 }

-export async function getStaticPaths () {
+export async function getStaticPaths() {
  const from = 'tag-static-path'
  const { tags } = await getGlobalNotionData({ from, tagsCount: 0 })
  const tagNames = getTagNames(tags)

  return {
-    paths: Object.keys(tagNames).map(index => ({ params: { tag: tagNames[index] } })),
+    paths: Object.keys(tagNames).map(index => ({
+      params: { tag: tagNames[index] }
+    })),
    fallback: true
  }
 }
--- a/pages/tag/index.js
+++ b/pages/tag/index.js
@@ -11,12 +11,13 @@ const TagIndex = props => {
  const meta = {
    title: `${locale.COMMON.TAGS} | ${siteInfo.title}`,
    description: siteInfo.description,
+    slug: 'tag',
    type: 'website'
  }
  return <ThemeComponents.LayoutTagIndex {...props} meta={meta} />
 }

-export async function getStaticProps () {
+export async function getStaticProps() {
  const from = 'tag-index-props'
  const props = await getGlobalNotionData({ from, tagsCount: 0 })
  return {