How to upload a file in html page, using http trigger in azure functions using python?

问题

I would like to have a some way, how to upload a file (could be html without php, or some interactive azure upload page, whatever), and through my URL params I would like to send parameters, which will run the rest of code using this uploaded file (ofc I need to save it to blob at least).

I need a rest api, so i chose azure functions.

Is there any way how to do it in python? I saw lots of examples in C#, but docs for python are limited.

Thx a lot!

回答1:

Regarding the issue, you can use Html Form to implement it.

For example

Html page

<!DOCTYPE html>
<html>
  <script type="text/javascript"
 src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.js">
</script>
<body>

 <form enctype="multipart/form-data">
    <input name="file" type="file" />
    <input type="button" value="Upload" />
</form>
<progress></progress>

<script language="javascript" type="text/javascript">
$(document).ready(function(){

$(':file').on('change', function () {
  var file = this.files[0];
  console.log(file)


$(':button').on('click', function () {
  var form = new FormData()
  form.append('file',file)


    $.ajax({
    // Your server script to process the upload
    url: '<your azure function app url>',
    type: 'POST',
    crossDomain: true,
    enctype: 'multipart/form-data',
    // Form data
    data:form,

    // Tell jQuery not to process data or worry about content-type
    // You *must* include these options!
    cache: false,
    contentType: false,
    processData: false,

    success :  function(data){console.log(data);},

    // Custom XMLHttpRequest
    xhr: function () {
      var myXhr = $.ajaxSettings.xhr();
      if (myXhr.upload) {
        // For handling the progress of the upload

        myXhr.upload.addEventListener('progress', function (e) {
          if (e.lengthComputable) {
            $('progress').attr({
              value: e.loaded,
              max: e.total,
            });
          }
        }, false);
      }
      return myXhr;
    }
  });

});





});



});

</script>

</body>
</html>

Function code (upload file to Azure blob )

import logging
import os
import azure.functions as func
from azure.storage.blob import BlobServiceClient, BlobClient
def main(req: func.HttpRequest) -> func.HttpResponse:
    logging.info('Python HTTP trigger function processed a request.')
    try:
        file=  req.files.get('file')
        logging.info(file.filename)

        connect_str="your storage account connection string"
        container="your container name"

        blob_service_client = BlobServiceClient.from_connection_string(connect_str)
        blob_client =blob_service_client.get_blob_client(container=container,blob=file.filename)
        blob_client.upload_blob(file)
    except Exception as ex:
        logging.info(ex.args)

    return func.HttpResponse(f"the file {file.filename} upload successfully")

Configure CORS for you function
Test

来源：https://stackoverflow.com/questions/60889319/how-to-upload-a-file-in-html-page-using-http-trigger-in-azure-functions-using-p

标签

python

azure

rest

azure-functions