feat: support json+oembed caption

#13

README.md

@@ -49,6 +49,18 @@ Don't want all that statistic clutter on your embed and only want the video or i
 
 > Alternatively, you can also set `isDirect` to true thru the URL query by adding `?isDirect=true` at the end of your URL
 
+### I don't see the video's caption!
+
+By default, we put the description into the `og:description` tag but Discord removes that from the embed if theres a video inside the embed. We decided not to add it to the top like what [tfxktok.com](https://tfxktok.com) does to prevent the embed from getting too cluttered with hashtags.
+
+But, we want to give the option for users to add it in case it brings additional context to the video. You can change your URL to `a.tnktok.com` to add the description to the top.
+
+|         Before         |        After         |
+| :--------------------: | :------------------: |
+| **www**.t**i**ktok.com | **a**.t**n**ktok.com |
+
+> Alternatively, you can also set `addDesc` to true thru the URL query by adding `?addDesc=true` at the end of your URL
+
 ### Why use tnktok.com?
 
 We check all the boxes for being one of the best TikTok embedding services with many features that others don't have. Here's a table comparing our service, tnktok.com, with the other TikTok embedding services as well as TikTok's default embeds.

src/index.ts

@@ -80,6 +80,8 @@ async function handleShort(c: any): Promise<Response> {
 
 async function handleVideo(c: any): Promise<Response> {
   const { videoId } = c.req.param()
+  const { addDesc } = c.req.query()
+
   let id = videoId.split('.')[0] // for .mp4, .webp, etc.
 
   // If the user agent is a bot, redirect to the TikTok page
@@ -146,7 +148,10 @@ async function handleVideo(c: any): Promise<Response> {
         return returnHTMLResponse(responseContent, 200)
       }
 
-      const responseContent = await VideoResponse(videoInfo)
+      const responseContent = await VideoResponse(
+        videoInfo,
+        (addDesc || 'false').toLowerCase() == 'true' || url.hostname.includes('a.tnktok.com')
+      )
       return returnHTMLResponse(responseContent)
     }
   } catch (e) {

src/templates/pages/VideoResponse.tsx

@@ -2,27 +2,8 @@ import MetaHelper from '../../util/metaHelper'
 import { ItemStruct } from '../../types/Web'
 import { formatNumber } from '../../util/format'
 
-export function VideoResponse(data: ItemStruct): JSX.Element {
+export function VideoResponse(data: ItemStruct, addDesc: Boolean): JSX.Element {
   let videoUrl = 'https://fxtiktok-rewrite.dargy.workers.dev/generate/video/' + data.id
-
-  // NOTE - This snippet was used to get a dynamic URL from the TikTok API but now we are mainly using web scraping to get the video data, which doesn't provide a dynamic URL
-  /*
-  if (data.video.duration > 0 && data.videos_addr) {
-    const awemeVideo = data.videos_addr.find((url) =>
-        url.includes("/aweme/v1/play"),
-      );
-
-    if (awemeVideo) {
-      const url = new URL(awemeVideo);
-
-      const videoId = url.searchParams.get("video_id");
-      const fileId = url.searchParams.get("file_id");
-
-      videoUrl = `https://${url.hostname}/aweme/v1/play/?video_id=${videoId}&file_id=${fileId}&item_id=${data.aweme_id}`;
-    }
-  }
-  */
-
   let videoMeta: { name: string; content: string }[] = []
 
   if (data.video.duration !== 0) {
@@ -131,7 +112,8 @@ export function VideoResponse(data: ItemStruct): JSX.Element {
         ],
         {
           unique_id: data.author.uniqueId,
-          nickname: data.author.nickname
+          nickname: data.author.nickname,
+          ...(addDesc ? { description: data.desc } : {})
         }
       )}
     </>

src/util/generateAlternate.tsx

@@ -9,15 +9,16 @@ export default function generateAlternate(c: Context): {
   provider_url: string
   title: string
 } {
-  const { unique_id, nickname } = c.req.query()
+  const { unique_id, nickname, description } = c.req.query()
+  const showSponsor = Math.random() < 0.01 // 1 in 100 chance to show sponsor message, gotta break even somehow
 
   return {
     version: '1.0',
     type: 'link',
     author_name: `${decodeURIComponent(nickname)} (@${decodeURIComponent(unique_id)})`,
-    author_url: `https://www.tiktok.com/${unique_id ? '@' + unique_id : ''}`,
-    provider_name: 'fxTikTok - Embed with s/i/n',
-    provider_url: 'https://github.com/okdargy/fxTikTok',
+    author_url: `https://www.tiktok.com${unique_id ? '/@' + unique_id : ''}`,
+    provider_name: `${description ? '\n\n' + decodeURIComponent(description) : showSponsor ? 'Use fxTikTok often? Consider supporting us on GitHub!' : 'fxTikTok - Embed with s/i/n'}`,
+    provider_url: showSponsor ? 'https://github.com/sponsors/okdargy' : 'https://github.com/okdargy/fxTikTok',
     title: `TikTok by @${unique_id}`
   }
 }