瀏覽代碼

Fix errors related to resource loading

gpt-engineer-app[bot] 5 月之前
父節點
當前提交
8394157317
共有 2 個文件被更改,包括 23 次插入71 次删除
  1. 14 1
      src/components/FeedForm.tsx
  2. 9 70
      src/utils/youtube.ts

+ 14 - 1
src/components/FeedForm.tsx

@@ -33,6 +33,7 @@ interface FeedFormProps {
 
 const FeedForm = ({ selectedType, onSubmit, onCancel, categories }: FeedFormProps) => {
   const [isLoadingChannelName, setIsLoadingChannelName] = useState(false);
+  const [urlWarning, setUrlWarning] = useState<string | null>(null);
   
   const form = useForm<FeedFormData>({
     defaultValues: {
@@ -64,12 +65,19 @@ const FeedForm = ({ selectedType, onSubmit, onCancel, categories }: FeedFormProp
 
   const handleUrlChange = async (url: string) => {
     form.setValue('url', url);
+    setUrlWarning(null);
     
     // If it's a YouTube URL and we don't have a name yet, try to fetch it
     if (selectedType === 'youtube' && url && !form.getValues('name')) {
       const isYouTubeUrl = url.includes('youtube.com');
       if (isYouTubeUrl) {
         setIsLoadingChannelName(true);
+        
+        // Check if it's a custom username that might not work directly
+        if (url.includes('/@') && !url.includes('/channel/')) {
+          setUrlWarning('Note: Les URL avec @username peuvent nécessiter l\'ID de chaîne réel (UC...) pour fonctionner. Si le flux ne fonctionne pas, trouvez l\'ID de chaîne sur YouTube.');
+        }
+        
         const channelName = await fetchYouTubeChannelName(url);
         if (channelName) {
           form.setValue('name', channelName);
@@ -95,7 +103,7 @@ const FeedForm = ({ selectedType, onSubmit, onCancel, categories }: FeedFormProp
 
   const getUrlHelperText = () => {
     if (selectedType === 'youtube') {
-      return 'Collez le lien de la chaîne YouTube (nom détecté automatiquement)';
+      return 'Pour de meilleurs résultats, utilisez l\'URL avec l\'ID de chaîne (commençant par UC...) si possible';
     }
     return null;
   };
@@ -160,6 +168,11 @@ const FeedForm = ({ selectedType, onSubmit, onCancel, categories }: FeedFormProp
                   {getUrlHelperText()}
                 </p>
               )}
+              {urlWarning && (
+                <p className="text-xs text-yellow-600 mt-1">
+                  ⚠️ {urlWarning}
+                </p>
+              )}
               <FormMessage />
             </FormItem>
           )}

+ 9 - 70
src/utils/youtube.ts

@@ -31,14 +31,15 @@ export const convertYouTubeToRSS = (url: string): string => {
   const channelId = extractYouTubeChannelId(url);
   
   if (channelId) {
-    // For channel ID format, we can directly create the RSS URL
-    if (url.includes('/channel/')) {
+    // For channel ID format (starts with UC), we can directly create the RSS URL
+    if (url.includes('/channel/') || channelId.startsWith('UC')) {
       return `https://www.youtube.com/feeds/videos.xml?channel_id=${channelId}`;
     }
     
     // For other formats (@username, /c/, /user/), we need to note that
-    // the RSS conversion might need the actual channel ID
-    // For now, we'll try with the extracted identifier
+    // these might not work directly and may need manual channel ID lookup
+    // For now, we'll try with the extracted identifier but add a warning
+    console.warn(`YouTube RSS URL might not work for custom username: ${channelId}. You may need to find the actual channel ID starting with 'UC'`);
     return `https://www.youtube.com/feeds/videos.xml?channel_id=${channelId}`;
   }
   
@@ -69,7 +70,7 @@ export const extractChannelNameFromUrl = (url: string): string | null => {
   return null;
 };
 
-// Function to fetch YouTube channel name from page metadata with multiple fallbacks
+// Function to fetch YouTube channel name from page metadata with fallback
 export const fetchYouTubeChannelName = async (url: string): Promise<string | null> => {
   // First, try to extract name from URL if it's an @username format
   const urlName = extractChannelNameFromUrl(url);
@@ -78,70 +79,8 @@ export const fetchYouTubeChannelName = async (url: string): Promise<string | nul
     return urlName;
   }
 
-  // List of CORS proxy services to try
-  const proxies = [
-    'https://corsproxy.io/?',
-    'https://cors-anywhere.herokuapp.com/',
-    'https://api.allorigins.win/get?url='
-  ];
-  
-  for (const proxy of proxies) {
-    try {
-      console.log(`Trying proxy: ${proxy}`);
-      const proxyUrl = `${proxy}${encodeURIComponent(url)}`;
-      
-      const response = await fetch(proxyUrl, {
-        method: 'GET',
-        headers: {
-          'Accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8',
-        },
-        // Add timeout
-        signal: AbortSignal.timeout(10000) // 10 seconds timeout
-      });
-      
-      if (!response.ok) {
-        console.log(`Proxy ${proxy} failed with status:`, response.status);
-        continue;
-      }
-      
-      let html = '';
-      
-      // Handle different proxy response formats
-      if (proxy.includes('allorigins.win')) {
-        const data = await response.json();
-        html = data.contents || '';
-      } else {
-        html = await response.text();
-      }
-      
-      if (html) {
-        // Try to extract channel name from various meta tags
-        const metaPatterns = [
-          /<meta property="og:title" content="([^"]+)"/,
-          /<meta name="twitter:title" content="([^"]+)"/,
-          /<title>([^<]+)<\/title>/,
-          /<meta property="og:site_name" content="([^"]+)"/
-        ];
-        
-        for (const pattern of metaPatterns) {
-          const match = html.match(pattern);
-          if (match && match[1]) {
-            let title = match[1].trim();
-            // Clean up the title (remove " - YouTube" suffix if present)
-            title = title.replace(/ - YouTube$/, '');
-            if (title && title !== 'YouTube') {
-              console.log('Successfully extracted channel name:', title);
-              return title;
-            }
-          }
-        }
-      }
-    } catch (error) {
-      console.log(`Proxy ${proxy} failed:`, error);
-      continue;
-    }
-  }
-  
-  console.log('All proxies failed, could not fetch channel name');
+  // If we can't extract from URL, return null instead of trying CORS proxies
+  // which are often blocked or unreliable
+  console.log('Could not extract channel name from URL, manual entry required');
   return null;
 };