Carga de un archivo en Azure Blob Storage con una función de Azure

En este artículo, se muestra cómo crear una API de función de Azure que carga un archivo en Azure Storage mediante un enlace de salida para transferir el contenido del archivo de la API a Azure Storage.

Consideraciones sobre Azure Storage al usar Azure Functions

El límite de carga para el archivo de la función de Azure es de 100 MB. Si necesita cargar archivos más grandes, considere la posibilidad de usar un enfoque basado en explorador o una aplicación web.

En este ejemplo, se usa un enlace de salida de función de Azure en lugar del paquete npm de Azure Storage. Mediante el enlace, tiene que configurar la función para que use correctamente el enlace de salida para mover el archivo de nuestra función al recurso de almacenamiento.

El uso del enlace de salida, que se ha utilizado en este artículo, tiene algunas ventajas y desventajas:

Ventajas Desventajas
* No es necesario escribir código para mover un archivo de la función al almacenamiento

* No hay dependencia npm para el almacenamiento
* function.json se debe configurar correctamente

* La cadena de conexión al almacenamiento se debe configurar correctamente en el entorno

El código necesario para leer el archivo cargado y convertirlo en un formato que se pueda enviar al almacenamiento es necesario, independientemente de si usa un enlace de salida o un paquete npm para integrarse directamente con Azure Storage.

Preparación del entorno de desarrollo

Asegúrese de que están instalados los siguientes elementos en la estación de trabajo de desarrollador local:

Crear un grupo de recursos

Un grupo de recursos contiene el recurso de Azure Functions y el recurso de Azure Storage. Al agregar ambos recursos a un único grupo, cuando quiera limpiarlos, solo tiene que quitar el grupo de recursos.

  1. En Visual Studio Code, seleccione el Explorador de Azure y, a continuación, seleccione el icono + (Más/Agregar) en Grupos de recursos.

    Captura de pantalla parcial del Explorador de Azure de Visual Studio Code en la que se muestra el área Grupos de recursos con el icono Más/Agregar resaltado.

  2. Use la tabla siguiente para terminar de crear el grupo de recursos:

    Prompt Valor Notas
    Escriba el nombre del nuevo grupo de recursos. blob-storage-upload-function-group Si elige otro nombre, recuerde usarlo como sustituto de este nombre cuando aparezca en el resto de este artículo.
    Seleccione una ubicación para los nuevos recursos. Seleccione una región cercana.

Creación de la aplicación de funciones local con Visual Studio Code

  1. Cree una nueva carpeta en la estación de trabajo local y, a continuación, abra Visual Studio Code en esta carpeta.

  2. En Visual Studio Code, seleccione el explorador de Azure, expanda el explorador de Azure Functions y, a continuación, seleccione el comando Crear nuevo proyecto:

    Captura de pantalla parcial de Visual Studio Code para crear un proyecto de función local.

  3. Use la tabla siguiente para terminar de crear el proyecto de función de Azure local:

    Prompt Valor Notas
    Seleccione la carpeta que contendrá el proyecto de función. Seleccione la carpeta actual, que es el valor predeterminado.
    Selección de un idioma TypeScript
    Seleccionar una plantilla para la primera función de su proyecto Desencadenador HTTP La API se invoca con una solicitud HTTP.
    Proporcionar un nombre de función upload La ruta de la API es /api/upload.
    Nivel de autorización Función Esto limita la API remota a las solicitudes que pasan la clave de función con la solicitud. Durante el desarrollo local, no necesitará la clave de función.

    Este proceso no crea aún el recurso de función de Azure basado en la nube. Ese paso tendrá lugar posteriormente.

  4. Vuelva al Explorador de archivos de Visual Studio Code.

  5. Transcurridos unos instantes, Visual Studio Code completa la creación del proyecto. Ahora tiene una carpeta para la función llamada upload en la que hay tres archivos:

    Nombre de archivo Descripción
    index.js El código fuente que responde a la solicitud HTTP.
    function.json La configuración de enlace del desencadenador HTTP.
    sample.dat Un archivo de datos de marcador de posición para mostrar que puede tener otros archivos en la carpeta. Puede eliminar este archivo si lo desea, porque no se usa en este tutorial.

Instalación de las dependencias de la función desde el terminal de Bash

  1. En Visual Studio Code, abra un terminal de Bash integrado: Ctrl + `.

  2. Instale las dependencias de npm:

    npm install
    

Instalación e inicio del emulador de almacenamiento Azurite

Ahora que la estructura de carpetas y los archivos básicos del proyecto están en su lugar, agregue la emulación de almacenamiento.

  1. Para emular el servicio Azure Storage de forma local, instale Azurite.

    npm install azurite
    
  2. Cree una carpeta para contener los archivos de almacenamiento dentro de la carpeta del proyecto local:

    mkdir azureStorage
    
  3. Para iniciar el emulador Azurite, agregue un script npm al final de los elementos de la propiedad scripts en el archivo package.json:

    "start-azurite": "azurite --silent --location azureStorage --debug azureStorage/debug.log"
    

    Esta acción usa la carpeta local azureStorage para contener los archivos de almacenamiento y los registros.

  4. En un nuevo terminal de Bash de Visual Studio Code, inicie el emulador:

    npm run start-azurite
    

    No cierre este terminal durante el artículo hasta el paso de limpieza.

Adición de código TypeScript para administrar la carga de archivos

  1. En un nuevo terminal de Bash integrado de Visual Studio Code, agregue paquetes npm para controlar las tareas de archivos:

    npm install http-status-enum parse-multipart @types/parse-multipart
    

    Deje este terminal abierto para usar otros comandos de script. Debe tener dos ventanas de terminal abiertas: una ventana que ejecuta el emulador de almacenamiento Azurite y este terminal para comandos.

  2. Abra el archivo ./upload/index.ts y reemplace el contenido por el código siguiente:

    El parámetro de cadena de consulta filename es necesario porque el enlace de salida debe conocer el nombre del archivo que se va a crear. El parámetro de cadena de consulta username es necesario porque se convierte en el nombre del contenedor de almacenamiento (carpeta). Por ejemplo, si el nombre de usuario es jsmith y el nombre de archivo es test-file.txt, la ubicación de almacenamiento es jsmith/test-file.txt.

    El código para leer el archivo y enviarlo al enlace de salida está resaltado.

Configuración de la función para conectarse a Azure Storage

  1. Abra el archivo ./upload/function.json y reemplace el contenido por el código siguiente:

    El primer objeto define el enlace de salida para leer el objeto devuelto por la función. El segundo objeto define cómo usar la información de lectura. La cadena de conexión del recurso de Storage se define en la propiedad connection con el valor AzureWebJobsStorage.

  2. Abra el archivo ./local.settings.json y reemplace el valor de la propiedad AzureWebJobsStorage por UseDevelopmentStorage=true para asegurarse de que, al desarrollar localmente, la función usa el emulador local de almacenamiento Azurite:

Ejecución de la función local con la emulación de almacenamiento local

  1. Inicie la función en la ventana del terminal integrado para comandos (no la ventana de terminal que ejecuta Azurite):

    npm start
    
  2. Espere hasta que aparezca la dirección URL de la función. Esto indica que la función se ha iniciado correctamente.

    upload: [POST] http://localhost:7071/api/upload
    
  3. Cree un nuevo archivo en la raíz del proyecto llamado test-file.txt y copie el texto:

  4. En Visual Studio Code, abra un nuevo terminal de Bash en la raíz del proyecto para usar la API de función para cargar el archivo test-file.txt:

    curl -X POST  -F 'filename=@test-file.txt' 'http://localhost:7071/api/upload?filename=test-file.txt&username=jsmith' --verbose
    
  5. Compruebe el código de estado 200 en la respuesta:

  6. En Visual Studio Code, en el explorador de archivos, expanda la carpeta azureStorage/blobstorage y observe el contenido del archivo.

    Captura de pantalla de Visual Studio Code con el explorador de archivos que muestra el almacenamiento de Azurite con la carpeta de blobs que contiene el archivo cargado.

    Localmente, ha llamado a la función y ha cargado el archivo en el emulador de almacenamiento correctamente.

Implementación en Azure con Visual Studio Code

  1. En Visual Studio Code, abra el Explorador de Azure y, a continuación, haga clic con el botón derecho en el icono de implementación en Funciones para implementar la aplicación:

    Captura de pantalla parcial de Visual Studio Code con el comando para implementar en Azure Functions.

    De forma alternativa, para realizar la implementación, abra la paleta de comandos (F1), escriba deploy to function app (Implementar en aplicación de funciones) y ejecute el comando Azure Functions: Implementar en aplicación de funciones.

  2. Use la tabla siguiente para completar las peticiones para crear un nuevo recurso de Azure Functions.

    Prompt Valor Notas
    Seleccionar aplicación de funciones en Azure Crear nueva aplicación de funciones en Azure (avanzado) Cree un recurso basado en la nube para la función.
    Escribir un nombre único global para la nueva aplicación de funciones El nombre pasa a formar parte de la dirección URL de la API. La API se invoca con una solicitud HTTP. Los siguientes son caracteres válidos para un nombre de aplicación de funciones: "a-z", "0-9" y "-". Un ejemplo es blob-storage-upload-function-app-jsmith. Puede reemplazar jsmith por su propio nombre, si lo prefiere.
    Seleccionar una pila del entorno de ejecución Seleccione una pila de Node.js con el descriptor LTS. LTS significa soporte técnico a largo plazo.
    Seleccione un sistema operativo. Windows Se selecciona específicamente Windows para la integración de los registros de flujo en Visual Studio Code. El streaming de registro de Linux está disponible en Azure Portal.
    Seleccione un grupo de recursos para los nuevos recursos. blob-storage-upload-function-group Seleccione el grupo de recursos que ha creado.
    Seleccione una ubicación para los nuevos recursos. Seleccione la región recomendada.
    Seleccione un plan de hospedaje. Consumo
    Seleccione una cuenta de almacenamiento. + Crear una nueva cuenta de almacenamiento
    Escriba el nombre de la nueva cuenta de almacenamiento. blobstoragefunction
    Seleccione un recurso de Application Insights para la aplicación. + Crear un nuevo recurso de Application Insights.
    Escriba un recurso de Application Insights para la aplicación. blob-storage-upload-function-app-insights
  3. El panel Salida de Visual Studio Code para Azure Functions muestra el progreso:

    Captura de pantalla de la ventana de salida de Visual Studio Code que crea un recurso de función.

    En la implementación, se implementa toda la aplicación de funciones, por lo que los cambios en las API individuales se implementan al mismo tiempo.

Creación de un recurso de Azure Storage

  1. En Visual Studio Code, seleccione el Explorador de Azure y, a continuación, haga clic con el botón derecho en la suscripción en Storage para seleccionar Crear cuenta de almacenamiento (avanzado) .

  2. Use la tabla siguiente para terminar de crear el proyecto de función de Azure local:

    Prompt Valor Notas
    Escribir un nombre único global para el nuevo recurso de Storage blobstoragefunction El nombre solo puede contener letras en minúscula y números y debe tener de 3 a 24 caracteres.
    Seleccione un grupo de recursos para los nuevos recursos. blob-storage-upload-function-group Seleccione el grupo de recursos que ha creado.
    ¿Desea habilitar el hospedaje de sitios web estáticos? No.
    Seleccione una ubicación para los nuevos recursos. Seleccione una de las ubicaciones recomendadas cercanas para usarla.

Establecimiento de la cadena de conexión de almacenamiento en la configuración de la aplicación de funciones

  1. En Visual Studio Code, seleccione el explorador de Azure, haga clic con el botón derecho en el nuevo recurso de almacenamiento y seleccione Copy Connection String (Copiar cadena de conexión).
  2. Todavía en el explorador de Azure, expanda la aplicación de funciones de Azure, expanda el nodo Configuración de la aplicación y haga clic con el botón derecho en AzureWebJobsStorage para seleccionar Editar configuración.
  3. Pegue la cadena de conexión de Azure Storage y presione Entrar para completar el cambio.

Comprobación de que la aplicación de funciones está disponible con el explorador

Una vez completada la implementación y actualizada la configuración de la aplicación AzureWebJobsStorage, pruebe la función de Azure.

  1. Abra un archivo de texto y copie en él lo siguiente:

    curl -X POST  -F 'filename=@test-file.txt' 'REPLACE-WITH-YOUR-FUNCTION-URL' --verbose
    
  2. En Visual Studio Code, seleccione el Explorador de Azure, expanda el nodo de la aplicación de funciones y, a continuación, expanda Funciones. Haga clic con el botón derecho en el nombre de la función, upload, y seleccione Copy Function Url (Copiar dirección URL de función):

    Captura de pantalla de Visual Studio Code con la opción para copiar la dirección URL de la función resaltada en Azure Explorer para Funciones.

  3. Pegue la dirección URL en un archivo de texto sobrescribiendo REPLACE-WITH-YOUR-FUNCTION-URL.

  4. Anexe el nombre de archivo y los pares de nombre y valor de la cadena de consulta para el nombre de usuario:

    Nombre Value
    username jsmith
    filename test-file.txt

    El formato de comando cURL final debe ser similar al siguiente, excepto por sus propias sustituciones de nombre de usuario y nombre de recurso de función:

    curl -X POST -F 'filename=@test-file.txt' 'https://blob-storage-upload-function-app-jsmith.azurewebsites.net/api/randomnumber?code=12345&filename=test-file.txt&username=jsmith' --verbose
    

    El valor de code en su propia dirección URL será un valor mucho más largo.

  5. Copie el comando cURL completo y ejecútelo en un terminal de Bash de Visual Studio Code en la raíz de la aplicación de funciones para cargar el archivo raíz, test-file.txt.

  6. En Visual Studio Code, abra el explorador de Azure, expanda el recurso de Blob Storage en contenedores y busque el nombre de contenedor que coincida con el valor de nombre de usuario de la cadena de consulta.

    Captura de pantalla de Visual Studio Code que muestra el nodo de almacenamiento del explorador de Azure con el archivo cargado.

Consulta de los registros de Azure Functions

  1. En Visual Studio Code, seleccione el explorador de Azure y, a continuación, en Funciones, haga clic con el botón derecho en la aplicación de funciones y seleccione Abrir en el portal.

    Así se abre Azure Functions en Azure Portal.

  2. Seleccione Application Insights en Configuración y, después, seleccione Ver datos de Application Insights.

    Captura de pantalla del explorador que muestra las opciones de menú. Seleccione **Application Insights** en Configuración y, después, seleccione **Ver datos de Application Insights**.

    Este vínculo le lleva a un recurso de métricas independiente creado automáticamente al crear la función de Azure con Visual Studio Code.

  3. Seleccione Registros en la sección Supervisión. Si aparece la ventana emergente Consultas, seleccione la X en la esquina superior derecha del menú emergente para cerrarlo.

  4. En el panel Nueva consulta 1, en la pestaña Tablas, haga doble clic en la tabla traces.

    Así se especifica la consulta de Kusto, tracesen la ventana de consulta.

  5. Edite la consulta para buscar los registros personalizados:

    traces 
    | where message startswith "***"
    
  6. Seleccione Run (Ejecutar).

    Si el registro no muestra ningún resultado, puede deberse a que hay unos minutos de retraso entre la solicitud HTTP a Azure Functions y la disponibilidad del registro en Kusto. Espere unos minutos y vuelva a ejecutar la consulta.

    Captura de pantalla que muestra el resultado de la tabla Seguimiento de la consulta de Kusto en Azure Portal.

Limpieza de los recursos de Azure

  1. En Visual Studio Code, en el Explorador de Azure, busque en la lista el nombre del grupo de recursos, blob-storage-upload-function-group.

  2. Haga clic con el botón derecho en el nombre del grupo de recursos y seleccione Eliminar.

    Use la extensión de Visual Studio Code, Grupos de recursos de Azure, para eliminar el grupo de recursos y todos sus recursos.

Pasos siguientes