fix: proxy B站图片 CDN 解决 web 端防盗链图片不显示问题

- dev-proxy.js 新增 /bilibili-img 路由,代理 *.hdslb.com 并注入正确 Referer
- utils/imageUrl.ts 新增 proxyImageUrl(),web 端将图片 URL 转为本地代理地址
- VideoCard / CommentItem / MiniPlayer / [bvid] 对所有 B站图片应用 proxyImageUrl
This commit is contained in:
Developer
2026-03-10 20:47:14 +08:00
parent 4c72ff3cdd
commit 4d71f39ee9
6 changed files with 30 additions and 4 deletions

View File

@@ -3,13 +3,14 @@ import { View, Text, Image, StyleSheet } from 'react-native';
import { Ionicons } from '@expo/vector-icons';
import type { Comment } from '../services/types';
import { formatTime } from '../utils/format';
import { proxyImageUrl } from '../utils/imageUrl';
interface Props { item: Comment; }
export function CommentItem({ item }: Props) {
return (
<View style={styles.row}>
<Image source={{ uri: item.member.avatar }} style={styles.avatar} />
<Image source={{ uri: proxyImageUrl(item.member.avatar) }} style={styles.avatar} />
<View style={styles.content}>
<Text style={styles.username}>{item.member.uname}</Text>
<Text style={styles.message}>{item.content.message}</Text>

View File

@@ -7,6 +7,7 @@ import { useRouter } from 'expo-router';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { Ionicons } from '@expo/vector-icons';
import { useVideoStore } from '../store/videoStore';
import { proxyImageUrl } from '../utils/imageUrl';
export function MiniPlayer() {
const { isActive, bvid, title, cover, clearVideo } = useVideoStore();
@@ -42,7 +43,7 @@ export function MiniPlayer() {
onPress={() => router.push(`/video/${bvid}` as any)}
activeOpacity={0.85}
>
<Image source={{ uri: cover }} style={styles.cover} />
<Image source={{ uri: proxyImageUrl(cover) }} style={styles.cover} />
<Text style={styles.title} numberOfLines={1}>{title}</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.closeBtn} onPress={clearVideo}>

View File

@@ -3,6 +3,7 @@ import { View, Text, Image, TouchableOpacity, StyleSheet, Dimensions } from 'rea
import { Ionicons } from '@expo/vector-icons';
import type { VideoItem } from '../services/types';
import { formatCount, formatDuration } from '../utils/format';
import { proxyImageUrl } from '../utils/imageUrl';
const { width } = Dimensions.get('window');
const CARD_WIDTH = (width - 24) / 2;
@@ -17,7 +18,7 @@ export function VideoCard({ item, onPress }: Props) {
<TouchableOpacity style={styles.card} onPress={onPress} activeOpacity={0.85}>
<View style={styles.thumbContainer}>
<Image
source={{ uri: item.pic }}
source={{ uri: proxyImageUrl(item.pic) }}
style={styles.thumb}
resizeMode="cover"
/>