feat: add support for multiple slideshow images

#8
okdargy · Jun 8, 2024 · f73dd28 · f73dd28
1 parent 0bca49f
commit f73dd28
Show file tree

Hide file tree

Showing 2 changed files with 106 additions and 39 deletions.
diff --git a/src/index.ts b/src/index.ts
@@ -8,6 +8,9 @@ import generateAlternate from './util/generateAlternate'
 import { returnHTMLResponse } from './util/responseHelper'
 
 const app = new Hono()
+const awemeIdPattern = /^\d{1,19}$/
+const BOT_REGEX =
+  /bot|facebook|embed|got|firefox\/92|curl|wget|go-http|yahoo|generator|whatsapp|discord|preview|link|proxy|vkshare|images|analyzer|index|crawl|spider|python|cfnetwork|node/gi
 
 app.get('/test/:videoId', async (c) => {
   const { videoId } = c.req.param()
@@ -41,10 +44,6 @@ app.get('/', (c) => {
 })
 
 async function handleVideo(c: any): Promise<Response> {
-  const awemeIdPattern = /^\d{1,19}$/
-  const BOT_REGEX =
-    /bot|facebook|embed|got|firefox\/92|curl|wget|go-http|yahoo|generator|whatsapp|discord|preview|link|proxy|vkshare|images|analyzer|index|crawl|spider|python|cfnetwork|node/gi
-
   const { videoId } = c.req.param()
   let id = videoId.split('.')[0]
 
@@ -155,19 +154,12 @@ app.get('/generate/video/:videoId', async (c) => {
 app.get('/generate/image/:videoId', async (c) => {
   const { videoId } = c.req.param()
 
+  if (!videoId) return new Response('Missing video ID', { status: 400 })
+  if (!awemeIdPattern.test(videoId)) return new Response('Invalid video ID', { status: 400 })
+
   try {
     const data = await scrapeVideoData(videoId)
 
-    /*
-        if (!(data instanceof Error)) {
-            if(data.imagePost.images.length > 0) {
-                return c.redirect(data.imagePost.images[0].imageURL.urlList[0])
-            } else {
-                return new Response(JSON.stringify(data), { status: 200 })
-            }
-        }
-    */
-
     return c.redirect(`https://tikwm.com/video/cover/${videoId}.webp`)
   } catch (e) {
     return new Response((e as Error).message, {
@@ -179,6 +171,41 @@ app.get('/generate/image/:videoId', async (c) => {
   }
 })
 
+app.get('/generate/image/:videoId/:imageCount', async (c) => {
+  const { videoId, imageCount } = c.req.param()
+
+  if (!videoId) return new Response('Missing video ID', { status: 400 })
+  if (!awemeIdPattern.test(videoId)) return new Response('Invalid video ID', { status: 400 })
+
+  if (isNaN(Number(imageCount)) || parseInt(imageCount) < 1) return new Response('Invalid image count', { status: 400 })
+  const imageIndex = parseInt(imageCount) - 1 // 0-indexed
+
+  try {
+    const data = await scrapeVideoData(videoId)
+
+    const images = await fetch('https://tikwm.com/api/', {
+      headers: {
+        Accept: 'application/json, text/javascript, */*; q=0.01',
+        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
+      },
+      body: 'url=' + videoId + '&count=12&cursor=0&web=1&hd=1',
+      method: 'POST'
+    })
+
+    const imageJson = (await images.json()) as { data: { images: string[] } }
+    if (!imageJson.data.images[imageIndex]) return new Response('Image not found', { status: 404 })
+
+    return c.redirect(imageJson.data.images[imageIndex])
+  } catch (e) {
+    return new Response((e as Error).message, {
+      status: 500,
+      headers: {
+        'Cache-Control': 'no-cache, no-store, must-revalidate'
+      }
+    })
+  }
+})
+
 const routes = [
   {
     path: '/:videoId',

diff --git a/src/templates/pages/VideoResponse.tsx b/src/templates/pages/VideoResponse.tsx
@@ -22,6 +22,69 @@ export function VideoResponse(data: ItemStruct): JSX.Element {
   }
   */
 
+  let videoMeta: { name: string; content: string }[] = []
+
+  if (data.video.duration !== 0) {
+    videoMeta = [
+      {
+        name: 'og:video',
+        content: videoUrl
+      },
+      {
+        name: 'og:video:type',
+        content: 'video/mp4'
+      },
+      {
+        name: 'og:video:width',
+        content: data.video.width.toString()
+      },
+      {
+        name: 'og:video:height',
+        content: data.video.height.toString()
+      },
+      {
+        name: 'og:type',
+        content: 'video'
+      },
+      {
+        name: 'twitter:card',
+        content: 'player'
+      }
+    ]
+  } else {
+    const numberOfImages = data.imagePost.images.length > 4 ? 4 : data.imagePost.images.length
+
+    for (let i = 0; i < numberOfImages; i++) {
+      videoMeta = [
+        ...videoMeta,
+        {
+          name: 'og:image',
+          content: data.imagePost.images[i].imageURL.urlList[0]
+        },
+        {
+          name: 'og:image:type',
+          content: 'image/jpeg'
+        },
+        {
+          name: 'og:image:width',
+          content: 'auto'
+        },
+        {
+          name: 'og:image:height',
+          content: 'auto'
+        },
+        {
+          name: 'og:type',
+          content: 'image.other'
+        },
+        {
+          name: 'twitter:card',
+          content: 'summary_large_image'
+        }
+      ]
+    }
+  }
+
   return (
     <>
       {MetaHelper(
@@ -34,10 +97,6 @@ export function VideoResponse(data: ItemStruct): JSX.Element {
             name: 'theme-color',
             content: '#ff0050' // TikTok's theme color
           },
-          {
-            name: 'twitter:card',
-            content: `${data.video.duration !== 0 ? 'player' : 'summary_large_image'}`
-          },
           {
             name: 'twitter:site',
             content: `@${data.author.uniqueId}` // @username
@@ -56,28 +115,9 @@ export function VideoResponse(data: ItemStruct): JSX.Element {
           },
           {
             name: 'og:description',
-            content: data.video.duration !== 0 ? data.desc : null
-          },
-          {
-            name: `og:${data.video.duration !== 0 ? 'video' : 'image'}`,
-            content: `${data.video.duration !== 0 ? videoUrl : 'https://fxtiktok-rewrite.dargy.workers.dev/generate/image/' + data.id}`
-          },
-          {
-            name: 'og:type',
-            content: `${data.video.duration !== 0 ? 'video.other' : 'image.other'}`
+            content: data.desc
           },
-          {
-            name: `og:${data.video.duration !== 0 ? 'video' : 'image'}:type`,
-            content: `${data.video.duration !== 0 ? 'video/mp4' : 'image/jpeg'}`
-          },
-          {
-            name: `og:${data.video.duration !== 0 ? 'video' : 'image'}:width`,
-            content: `${data.video.duration !== 0 ? data.video.width : data.imagePost.images[0].imageWidth}`
-          },
-          {
-            name: `og:${data.video.duration !== 0 ? 'video' : 'image'}:height`,
-            content: `${data.video.duration !== 0 ? data.video.height : data.imagePost.images[0].imageHeight}`
-          }
+          ...videoMeta
         ],
         {
           likes: data.stats.diggCount,