feat: 测试分享

src/utils/share.ts

@@ -52,12 +52,34 @@ async function shareWithWebAPI(data: ShareData): Promise<void> {
  */
 export function shareToWhatsApp(text: string, url?: string): void {
 	const shareText = url ? `${text} ${url}` : text
-	// WhatsApp Web API: https://wa.me/?text=
 	const encodedText = encodeURIComponent(shareText)
-	const whatsappUrl = `https://wa.me/?text=${encodedText}`
-	
-	// 打开 WhatsApp 分享链接
-	window.open(whatsappUrl, '_blank')
+	const whatsappScheme = `whatsapp://send?text=${encodedText}`
+	const whatsappWebUrl = `https://wa.me/?text=${encodedText}`
+	const isMobile = typeof navigator !== 'undefined' && /Android|iPhone|iPad|iPod|Mobile/i.test(navigator.userAgent)
+
+	if (typeof window === 'undefined') return
+
+	if (isMobile) {
+		// 优先尝试调用已安装的 WhatsApp 应用，失败后回退到 Web 版本
+		let didFallback = false
+		const fallbackTimer = window.setTimeout(() => {
+			didFallback = true
+			window.location.href = whatsappWebUrl
+		}, 1500)
+
+		try {
+			window.location.href = whatsappScheme
+		} catch (error) {
+			window.clearTimeout(fallbackTimer)
+			window.location.href = whatsappWebUrl
+		}
+
+		// 某些浏览器会在成功唤起 App 时终止脚本，无需额外处理
+		return
+	}
+
+	// 桌面端或不支持 scheme 的环境直接打开 WhatsApp Web
+	window.open(whatsappWebUrl, '_blank')
 }
 
 /**

src/views/Workshop/creation/creation-list.vue

@@ -8,7 +8,6 @@ import {
   setTryOnEffectFavorite,
   cancelTryOnEffectFavorite
 } from '@/api/workshop'
-import { shareImageFile, createImageFileFromUrl, shareToWhatsApp } from '@/utils/share'
 
 import { useRouter } from 'vue-router'
 const router = useRouter()
@@ -82,46 +81,36 @@ const onLoveItem = (v) => {
     })
 }
 
-const shareFileCache = new Map<string, File>()
-const preloadShareFile = (imageUrl: string) => {
-	if (shareFileCache.has(imageUrl)) return
-	createImageFileFromUrl(imageUrl)
-		.then((file) => {
-			shareFileCache.set(imageUrl, file)
-		})
-		.catch((error) => {
-			console.error('预加载分享图片失败', error)
-		})
-}
-const isShare = ref(false)
-const handleOpenShare = () => {
-	isShare.value = !isShare.value
-	if (isShare.value) {
-		list.forEach((item) => preloadShareFile(item.tryOnUrl))
-	}
-	alert(`现在${isShare.value ? '可以' : '不可以'}分享`)
+const shareImageToWhatsapp = async (url) => {
+  // 把图片 URL 转为 Blob
+  const blob = await fetch(url).then((res) => res.blob())
+
+  // 创建文件对象
+  const file = new File([blob], 'image.jpg', { type: 'image/jpeg' })
+
+  // 判断浏览器是否支持文件分享
+  if (navigator.canShare && navigator.canShare({ files: [file] })) {
+    await navigator.share({
+      files: [file],
+      title: '分享图片',
+      text: '给你一张图片'
+    })
+  } else {
+    alert('当前浏览器不支持分享图片，请使用安卓 Chrome 浏览器')
+  }
 }
 
-const shareTryOnImage = async (imageUrl: string) => {
-	const cachedFile = shareFileCache.get(imageUrl)
-	if (!cachedFile) {
-		preloadShareFile(imageUrl)
-		alert('图片准备中，请稍后再试')
-		return
-	}
-	try {
-		await shareImageFile(cachedFile, 'Lane Crawford Creation')
-	} catch (error) {
-		console.error('分享图片失败', error)
-		const text = `Lane Crawford Creation\n\n查看图片: ${imageUrl}`
-		shareToWhatsApp(text)
-	}
+const isShare = ref(false)
+const handleOpenShare = () => {
+  isShare.value = !isShare.value
+
+  alert(`现在${isShare.value ? '可以' : '不可以'}分享`)
 }
 
 const onDownloadItem = async (v) => {
   if (isShare.value) {
-		await shareTryOnImage(v.tryOnUrl)
-		return
+    await shareImageToWhatsapp(v.tryOnUrl)
+    return
   }
   if (v.loading) return
   v.loading = true