fix(notification+vlog upload)

frontend/src/utils/axios.js

@@ -71,9 +71,10 @@ instance.interceptors.request.use(
     // Augmenter le timeout pour les requêtes POST/PUT avec FormData (uploads)
     if ((config.method === 'POST' || config.method === 'PUT') && config.data instanceof FormData) {
       config.timeout = 120000 // 2 minutes pour les uploads
-      // Ne pas définir Content-Type pour FormData - laisser le navigateur l'ajouter avec la boundary
-      // C'est crucial sur mobile où définir explicitement le Content-Type peut causer des erreurs
-      if (config.headers && config.headers['Content-Type'] === 'multipart/form-data') {
+      
+      // IMPORTANT: Supprimer le Content-Type pour laisser le navigateur définir le multipart/form-data avec la boundary
+      // Axios peut avoir mis 'application/json' par défaut ou on peut l'avoir mis manuellement
+      if (config.headers && config.headers['Content-Type']) {
         delete config.headers['Content-Type']
       }
     }
@@ -109,15 +110,15 @@ instance.interceptors.response.use(
       requestHeaders: error.config?.headers
     })
     
-    // Log supplémentaire pour les erreurs 401/403
-    if (error.response?.status === 401 || error.response?.status === 403) {
+    // Log supplémentaire pour les erreurs 401/403/422
+    if ([401, 403, 422].includes(error.response?.status)) {
       const token = localStorage.getItem('token')
-      console.error('🔍 Diagnostic erreur auth:', {
+      console.error(`🔍 Diagnostic erreur ${error.response?.status}:`, {
         hasToken: !!token,
         tokenLength: token?.length,
-        tokenPreview: token ? token.substring(0, 20) + '...' : null,
         url: error.config?.url,
-        method: error.config?.method
+        method: error.config?.method,
+        validationErrors: error.response?.data?.detail
       })
     }
     
@@ -208,3 +209,28 @@ export function getApiUrl() {
 export function getAppUrl() {
   return import.meta.env.VITE_APP_URL || window.location.origin
 }
+
+// Fonction utilitaire pour upload de FormData via fetch natif
+// (contourne les problèmes d'axios avec FormData sur certains navigateurs/mobiles)
+export async function uploadFormData(endpoint, formData) {
+  const token = localStorage.getItem('token')
+  const apiUrl = getApiUrl()
+  
+  const response = await fetch(`${apiUrl}${endpoint}`, {
+    method: 'POST',
+    headers: {
+      'Authorization': `Bearer ${token}`
+      // Ne PAS mettre Content-Type, fetch le gère automatiquement avec FormData
+    },
+    body: formData
+  })
+
+  if (!response.ok) {
+    const errorData = await response.json().catch(() => ({}))
+    const error = new Error(errorData.detail || 'Erreur lors de l\'upload')
+    error.response = { status: response.status, data: errorData }
+    throw error
+  }
+
+  return await response.json()
+}