2010-06-10 8 views
9

Usando javascript, tengo un archivo en cadena (obtenido con la solicitud ajax).Cómo subir una cadena como archivo con jQuery u otro framework js

¿Cómo cargarlo como archivo al servidor con otra solicitud de AJAX?

+1

Aclare: ¿tiene la ruta de archivo como una cadena o tiene contenido de archivo como cadena y desea cargarlo como un archivo? –

+0

@Marko: Se lee como si tuviera el contenido del archivo en una cadena, que obtuvo de una solicitud ajax. –

Respuesta

13

Es necesario configurar la cabecera Content-type solicitud a multipart/form-data y jugar con el formato un poco, I wrote this en llanura Ol JavaScript (TM), pero aquí se puede volver a trabajar para una biblioteca:

EDIT: tenía mi café ahora, para lo modificó para jQuery (sin-biblioteca versión here):

// Define a boundary, I stole this from IE but you can use any string AFAIK 
var boundary = "---------------------------7da24f2e50046"; 
var body = '--' + boundary + '\r\n' 
     // Parameter name is "file" and local filename is "temp.txt" 
     + 'Content-Disposition: form-data; name="file";' 
     + 'filename="temp.txt"\r\n' 
     // Add the file's mime-type 
     + 'Content-type: plain/text\r\n\r\n' 
     // Add your data: 
     + data + '\r\n' 
     + '--'+ boundary + '--'; 

$.ajax({ 
    contentType: "multipart/form-data; boundary="+boundary, 
    data: body, 
    type: "POST", 
    url: "http://asite.com/apage.php", 
    success: function (data, status) { 
    } 
}); 
+1

Mmm, ¡agradable! No sabía que eso era posible en una solicitud de Ajax. –

+0

@Pekka: Claro que sí. Útil si no tiene control sobre el servidor que está cargando y TIENE que aceptar un archivo de texto publicado con multipart/form-data. –

+4

Esto funcionó, a excepción de dos ajustes para trabajar con express/node: 1) el último límite debe ser '+ '-' + boundary + '-';' y también el contentType en la llamada ajax debe ser: ' "multipart/form-data; boundary =" + boundary' – chovy

7

es cómo hacerlo sin necesidad de construir manualmente el cuerpo de la petición de varias partes aquí:

var s = 'some string data'; 
var filename = 'foobar.txt'; 

var formData = new FormData(); 
formData.append('file', new File([new Blob([s])], filename)); 
formData.append('another-form-field', 'some value'); 

$.ajax({ 
    url: '/upload', 
    data: formData, 
    processData: false, 
    contentType: false, 
    type: 'POST', 
    success: function() { 
     console.log('ok'); 
    }, 
    error: function() { 
     console.log('err'); // replace with proper error handling 
    } 
}); 
+0

me parece agradable ... ¿puedo transcodificar Base64 a un objeto de archivo? Si no, puedo usar el base64 y decodificarlo en el servidor. pero soy curioso – redestructa

+0

¿El objeto FormData es compatible con el navegador? –

Cuestiones relacionadas