feat: enhance deployment and media handling

- Updated deployment configurations to disable Incremental Static Regeneration (ISR) and cache on demand pages for better performance control.
- Extended .gitignore to include deployment-specific directories, preventing unnecessary files from being tracked.
- Improved video handling in content by adding support for additional video types and enhancing video element attributes for better playback control.
- Refactored post retrieval logic to ensure channel information is correctly merged and SEO data is accurately assigned.
- Enhanced static file handling to include error handling and domain whitelisting for security and reliability.

.gitignore

@@ -22,3 +22,7 @@ pnpm-debug.log*
 
 # jetbrains setting folder
 .idea/
+
+.vercel/
+.netlify/
+.vercel

api/static/index.js

@@ -0,0 +1,26 @@
+import { GET } from '../../src/pages/static/[...url]'
+
+export const config = {
+  runtime: 'edge',
+}
+
+export default function handler(request) {
+  const url = request.url?.split('/static/')?.[1]
+
+  if (!url) {
+    return new Response('Not Found', { status: 404 })
+  }
+
+  const target = new URL(url)
+  target.searchParams.delete('path')
+
+  return GET({
+    request,
+    params: {
+      url: target.origin + target.pathname,
+    },
+    url: {
+      search: target.search,
+    },
+  })
+}

astro.config.mjs

@@ -9,11 +9,12 @@ import sentry from '@sentry/astro'
 
 const providers = {
   vercel: vercel({
+    isr: false,
     edgeMiddleware: false,
   }),
   cloudflare_pages: cloudflare(),
   netlify: netlify({
-    cacheOnDemandPages: true,
+    cacheOnDemandPages: false,
     edgeMiddleware: false,
   }),
   node: node({

src/components/item.astro

@@ -90,7 +90,8 @@ const timeago = datetime.isBefore(dayjs().subtract(1, 'w'))
     }
   }
 
-  .content :global(.tgme_widget_message_video) {
+  .content
+    :global(.tgme_widget_message_video, .tgme_widget_message_roundvideo) {
     aspect-ratio: 1 / 1;
   }
 

src/lib/telegram/index.js

@@ -28,8 +28,17 @@ function getImages($, item, { staticProxy, id, index, title }) {
 
 function getVideo($, item, { staticProxy, index }) {
   const video = $(item).find('.tgme_widget_message_video_wrap video')
-  video?.attr('src', staticProxy + video?.attr('src'))?.attr('controls', true)?.attr('preload', index > 15 ? 'auto' : 'metadata')
-  return $.html(video)
+  video?.attr('src', staticProxy + video?.attr('src'))
+    ?.attr('controls', true)
+    ?.attr('preload', index > 15 ? 'auto' : 'metadata')
+    ?.attr('playsinline', true).attr('webkit-playsinline', true)
+
+  const roundVideo = $(item).find('.tgme_widget_message_roundvideo_wrap video')
+  roundVideo?.attr('src', staticProxy + roundVideo?.attr('src'))
+    ?.attr('controls', true)
+    ?.attr('preload', index > 15 ? 'auto' : 'metadata')
+    ?.attr('playsinline', true).attr('webkit-playsinline', true)
+  return $.html(video) + $.html(roundVideo)
 }
 
 function getLinkPreview($, item, { staticProxy, index }) {
@@ -52,10 +61,10 @@ function getPost($, item, { channel, staticProxy, index = 0 }) {
   const title = content?.text()?.match(/[^。\n]*(?=[。\n]|http)/g)?.[0] ?? content?.text() ?? ''
   const id = $(item).attr('data-post')?.replace(`${channel}/`, '')
 
-  $(content).find('a').each((_index, a) => {
-    $(a).attr('title', $(a).text())
+  $(content).find('a')?.each((_index, a) => {
+    $(a)?.attr('title', $(a)?.text())
   })
-  $(content).find('.emoji').attr('style', '')
+  $(content).find('.emoji')?.attr('style', '')
   const tags = $(content).find('a[href^="?q="]')?.each((_index, a) => {
     $(a)?.attr('href', `/search/${encodeURIComponent($(a)?.text())}`)
   })?.map((_index, a) => $(a)?.text()?.replace('#', ''))?.get()
@@ -68,16 +77,15 @@ function getPost($, item, { channel, staticProxy, index = 0 }) {
     tags,
     text: content?.text(),
     content: [
+      $.html($(item).find('.tgme_widget_message_reply')?.wrapInner('<small></small>')?.wrapInner('<blockquote></blockquote>')),
       getImages($, item, { staticProxy, id, index, title }),
       getVideo($, item, { staticProxy, id, index, title }),
       content?.html(),
       // $(item).find('.tgme_widget_message_sticker_wrap')?.html(),
       $(item).find('.tgme_widget_message_poll')?.html(),
       $.html($(item).find('.tgme_widget_message_document_wrap')),
-      $.html($(item).find('.tgme_widget_message_roundvideo')?.attr('controls', true)),
       $.html($(item).find('.tgme_widget_message_voice')?.attr('controls', true)),
       $.html($(item).find('.tgme_widget_message_location_wrap')),
-      $.html($(item).find('.tgme_widget_message_reply .tgme_widget_message_text')?.wrapInner('<blockquote></blockquote>')),
       getLinkPreview($, item, { staticProxy, index }),
     ].filter(Boolean).join('').replace(/(url\(["'])((https?:)?\/\/)/g, (match, p1, p2, _p3) => {
       if (p2 === '//') {

src/pages/posts/[id].astro

@@ -6,15 +6,18 @@ import { getChannelInfo } from '../../lib/telegram'
 
 const { SITE_URL } = Astro.locals
 
-const channel = JSON.parse(JSON.stringify(await getChannelInfo(Astro)))
+const channelInfo = await getChannelInfo(Astro)
 
 const post = await getChannelInfo(Astro, {
   type: 'post',
   id: Astro.params.id,
 })
 
-channel.posts = [post]
-channel.seo = post
+const channel = {
+  ...(channelInfo || {}),
+  posts: [post],
+  seo: post,
+}
 
 const staticProxy = getEnv(import.meta.env, Astro, 'STATIC_PROXY') ?? '/static/'
 

src/pages/static/[...url].js

@@ -8,11 +8,15 @@ const targetWhitelist = [
 
 export const prerender = false
 
-export async function GET(Astro) {
-  const { request, params, url } = Astro
-  const target = new URL(params.url + url.search)
-  if (!targetWhitelist.some(host => target.host.endsWith(host))) {
-    return Astro.redirect(target.toString(), 302)
+export async function GET({ request, params, url }) {
+  try {
+    const target = new URL(params.url + url.search)
+    if (!targetWhitelist.some(domain => target.hostname.endsWith(domain))) {
+      return Response.redirect(target.toString(), 302)
+    }
+    return fetch(target.toString(), request)
+  }
+  catch (error) {
+    return new Response(error.message, { status: 500 })
   }
-  return fetch(target.toString(), request)
 }

vercel.json

@@ -0,0 +1,5 @@
+{
+  "rewrites": [
+    { "source": "/static/:path*", "destination": "/api/static" }
+  ]
+}