python - simple - Cómo cargar un archivo usando una llamada ajax en el matraz

peticiones ajax en django

Question

Hola, soy bastante nuevo en el frasco y quiero cargar un archivo mediante una llamada ajax al servidor. Como se menciona en la documentación, agregué una carga de archivo al html como sigue:

<form action="" method=post enctype="multipart/form-data" id="testid">
 <table>
  <tr>
   <td>
     <label>Upload</label>
   </td>
   <td>
     <input id="upload_content_id" type="file" name="upload_file" multiple>
     <input type="button" name="btn_uplpad" id="btn_upload_id" class="btn-upload" value="Upload"/>

   </td>
  </tr>
 </table>
</form>

y escribí el controlador ajax como este

$(document).ready(function() {
    $("#btn_upload_id" ).click(function() {           
        $.ajax({
            type : "POST",
            url : "/uploadajax",
            cache: false,
            async: false,
            success : function (data) {},
            error: function (XMLHttpRequest, textStatus, errorThrown) {}
        });
    });
});

No sé cómo obtener el archivo cargado (no el nombre) de este

  <input id="upload_content_id" type="file" name="upload_file" multiple>

y guarda el archivo en la carpeta. No estoy muy seguro de cómo leer el archivo del controlador que he escrito:

@app.route(''/uploadajax'', methods = [''POST''])
def upldfile():
    if request.method == ''POST'':
        file_val = request.files[''file'']

Estaré agradecido si alguien puede ayudar. Gracias de antemano

Answer 1

Está ahí en el tutorial .

from flask import send_from_directory @app.route(''/uploads/'') def uploaded_file(filename): return send_from_directory(app.config[''UPLOAD_FOLDER''], filename)

Puede devolver lo mismo a una solicitud POST. Y luego la función de éxito AJAX se puede utilizar para mostrar la respuesta.

Pero para cualquier propósito práctico, podría ser una buena idea guardar el nombre del archivo con su recurso asociado en una tabla de relación de base de datos.

Answer 2

Para responder tu pregunta...

HTML:

<form id="upload-file" method="post" enctype="multipart/form-data">
    <fieldset>
        <label for="file">Select a file</label>
        <input name="file" type="file">
    </fieldset>
    <fieldset>
        <button id="upload-file-btn" type="button">Upload</button>
    </fieldset>
</form>

JavaScript:

$(function() {
    $(''#upload-file-btn'').click(function() {
        var form_data = new FormData($(''#upload-file'')[0]);
        $.ajax({
            type: ''POST'',
            url: ''/uploadajax'',
            data: form_data,
            contentType: false,
            cache: false,
            processData: false,
            success: function(data) {
                console.log(''Success!'');
            },
        });
    });
});

Ahora, en la función de vista de punto final de su frasco, puede acceder a los datos del archivo a través de flask.request.files.

En una nota al margen, los formularios no son datos tabulares, por lo tanto, no pertenecen a una tabla. En su lugar, debe recurrir a una lista no ordenada, o una lista de definiciones.