← Retour aux workflows
Workflow n8n

Automatisation HTTP avec n8n : upload de photos en un clic

Ce workflow n8n a pour objectif d'automatiser le processus d'upload de photos via une requête HTTP, facilitant ainsi la gestion des fichiers pour les utilisateurs. Dans un contexte où la rapidité et l'efficacité sont primordiales, ce type d'automatisation est particulièrement utile pour les équipes marketing ou les développeurs souhaitant intégrer des fonctionnalités de téléchargement d'images dans leurs applications sans intervention manuelle. Le workflow commence par un déclencheur manuel, permettant à l'utilisateur de lancer le processus en cliquant sur 'Test workflow'. Ensuite, il utilise un nœud HTTP pour envoyer la photo à une URL spécifiée. Pour gérer les données sensibles, un nœud de configuration est mis en place, garantissant que les informations sensibles sont correctement traitées. Par la suite, un autre nœud HTTP permet de récupérer une photo à des fins de test, assurant ainsi que le processus fonctionne comme prévu. Enfin, plusieurs nœuds de notes autocollantes sont utilisés pour afficher des informations pertinentes concernant le processus. Les bénéfices de ce workflow incluent une réduction significative du temps de traitement des images et une diminution des erreurs humaines, ce qui se traduit par une efficacité accrue au sein des équipes.

Tags clés :automatisationHTTPn8nupload de photosagence automatisation
🎯Pour qui ?🧩Problème résolu📋Étapes du flux🛠Guide de personnalisation
Catégorie: Manual · Tags: automatisation, HTTP, n8n, upload de photos, agence automatisation❤ 0

Workflow n8n HTTP, upload de photos, agence automatisation : vue d'ensemble

Schéma des nœuds et connexions de ce workflow n8n, généré à partir du JSON n8n.

React Flow
Besoin d'aide ?

Workflow n8n HTTP, upload de photos, agence automatisation : détail des nœuds

  • When clicking ‘Test workflow’

    Déclenche le workflow lorsque l'utilisateur clique sur 'Test workflow'.

  • Upload photo

    Envoie une requête HTTP pour télécharger une photo en utilisant les paramètres spécifiés.

  • Set config (sensitive data)

    Configure des données sensibles en les assignant à des options spécifiques.

  • Get photo (for testing purposes)

    Effectue une requête HTTP pour obtenir une photo à des fins de test.

  • Set destination

    Définit une destination en assignant des valeurs à des options spécifiques.

  • Sticky Note

    Crée une note autocollante avec les dimensions et le contenu spécifiés.

  • Sticky Note1

    Crée une seconde note autocollante avec des dimensions et un contenu définis.

  • Sticky Note2

    Crée une troisième note autocollante avec les paramètres de taille et de contenu fournis.

  • Authentication

    Effectue une requête HTTP pour l'authentification avec les paramètres spécifiés.

Inscris-toi pour voir l'intégralité du workflow

Inscription gratuite

S'inscrire gratuitementBesoin d'aide ?
{
  "meta": {
    "instanceId": "97d44c78f314fab340d7a5edaf7e2c274a7fbb8a7cd138f53cc742341e706fe7",
    "templateCredsSetupCompleted": true
  },
  "nodes": [
    {
      "id": "1ec0e1ad-0666-417b-b5af-b381b06e126f",
      "name": "When clicking ‘Test workflow’",
      "type": "n8n-nodes-base.manualTrigger",
      "position": [
        -120,
        180
      ],
      "parameters": {},
      "typeVersion": 1
    },
    {
      "id": "c34a92d3-b4bd-4c2f-9fa0-66832729a31c",
      "name": "Upload photo",
      "type": "n8n-nodes-base.httpRequest",
      "position": [
        980,
        180
      ],
      "parameters": {
        "url": "=https://graph.microsoft.com/v1.0/sites/root/drive/root:{{ $json.TARGET_FOLDER }}/{{ $json.FILE_NAME }}:/content",
        "method": "PUT",
        "options": {},
        "sendBody": true,
        "contentType": "binaryData",
        "sendHeaders": true,
        "headerParameters": {
          "parameters": [
            {
              "name": "Authorization",
              "value": "=Bearer {{ $json.access_token }}"
            },
            {
              "name": "Content-Type",
              "value": "application/octet-stream"
            }
          ]
        },
        "inputDataFieldName": "data"
      },
      "typeVersion": 4.2
    },
    {
      "id": "49ce594c-83c7-4b47-be03-6811ebdcc57b",
      "name": "Set config (sensitive data)",
      "type": "n8n-nodes-base.set",
      "position": [
        100,
        180
      ],
      "parameters": {
        "options": {},
        "assignments": {
          "assignments": [
            {
              "id": "399d42f3-41e0-4043-9a57-85771bf5cd07",
              "name": "TENANT_ID",
              "type": "string",
              "value": "00000000-0000-0000-0000-000000000000"
            },
            {
              "id": "dd63a519-3681-46c4-b122-ab379ed11c42",
              "name": "CLIENT_ID",
              "type": "string",
              "value": "00000000-0000-0000-0000-000000000000"
            },
            {
              "id": "4d50c934-c306-4198-853a-68198b8b84eb",
              "name": "CLIENT_SECRET",
              "type": "string",
              "value": "uU~8Q~THEQLIE2TX7UsecretT2g_JCADyxBxN0bx3"
            }
          ]
        }
      },
      "typeVersion": 3.4
    },
    {
      "id": "53b78aa9-d86f-461b-bff5-bd2a63a693b5",
      "name": "Get photo (for testing purposes)",
      "type": "n8n-nodes-base.httpRequest",
      "position": [
        540,
        180
      ],
      "parameters": {
        "url": "https://fastly.picsum.photos/id/459/200/300.jpg?hmac=4Cn5sZqOdpuzOwSTs65XA75xvN-quC4t9rfYYyoTCEI",
        "options": {}
      },
      "typeVersion": 4.2
    },
    {
      "id": "a551951c-f192-4b15-accb-ca936baef9a8",
      "name": "Set destination",
      "type": "n8n-nodes-base.set",
      "position": [
        760,
        180
      ],
      "parameters": {
        "options": {},
        "assignments": {
          "assignments": [
            {
              "id": "9f66b3f9-c161-45f4-bdc0-8cf736b53eda",
              "name": "TARGET_FOLDER",
              "type": "string",
              "value": "/uploads/pictures from n8n"
            },
            {
              "id": "e8584729-2746-48a0-ad80-d0308a49e195",
              "name": "FILE_NAME",
              "type": "string",
              "value": "example.jpg"
            }
          ]
        },
        "includeOtherFields": true
      },
      "typeVersion": 3.4
    },
    {
      "id": "66129973-bf5f-4799-b676-2ee40fd2b519",
      "name": "Sticky Note",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -240,
        -220
      ],
      "parameters": {
        "width": 320,
        "height": 200,
        "content": "## Prerequisites\n1. [Create an application user](https://learn.microsoft.com/en-us/power-platform/admin/manage-application-users)\n2. Ensure the following permissions are set:\n- Sites.ReadWrite.All - for SharePoint site access\n- Files.ReadWrite.All - for file upload operations\n"
      },
      "typeVersion": 1
    },
    {
      "id": "43bbf2cd-3ac5-4c46-b3c0-bd6158dbe25e",
      "name": "Sticky Note1",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        160,
        -280
      ],
      "parameters": {
        "width": 320,
        "height": 340,
        "content": "## Authentication\nFor a succesful authentication it is required to provide:\n\n- TENANT_ID\n- CLIENT_ID\n- CLIENT_SECRET\n---\n## Attention!\nFor demonstration purposes and template restrictions we store these values in a 'Set' node but in production environment please ensure safety of such data via utilizing credentials, secure vault or any other safe way of storing such information."
      },
      "typeVersion": 1
    },
    {
      "id": "daa3e6b9-a9ea-4bb4-8e2d-faa516c699ea",
      "name": "Sticky Note2",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        620,
        -280
      ],
      "parameters": {
        "width": 440,
        "height": 340,
        "content": "## Set destination\nIn this step we will set the destination.\nThe destination is made of two parameters:\n\n- TARGET_FOLDER\n- FILE_NAME\n---\n### Example\nLet's say this is our desired file location:\n`https://contoso.sharepoint.com/uploads/pictures from n8n/example.jpg`\n\nThus we will set the following:\n- TARGET_FOLDER = `/uploads/pictures from n8n`\n- FILE_NAME = `example.jpg`\n"
      },
      "typeVersion": 1
    },
    {
      "id": "52bd314b-6a5e-499a-904e-a7e9becbbd59",
      "name": "Authentication",
      "type": "n8n-nodes-base.httpRequest",
      "notes": "Get an access token for graph API",
      "position": [
        320,
        180
      ],
      "parameters": {
        "url": "=https://login.microsoftonline.com/{{ $json.TENANT_ID }}/oauth2/token",
        "method": "POST",
        "options": {},
        "sendBody": true,
        "contentType": "form-urlencoded",
        "bodyParameters": {
          "parameters": [
            {
              "name": "grant_type",
              "value": "client_credentials"
            },
            {
              "name": "client_id",
              "value": "={{ $json.CLIENT_ID }}"
            },
            {
              "name": "client_secret",
              "value": "={{ $json.CLIENT_SECRET }}"
            },
            {
              "name": "resource",
              "value": "https://graph.microsoft.com"
            }
          ]
        }
      },
      "notesInFlow": true,
      "typeVersion": 4.2
    }
  ],
  "pinData": {},
  "connections": {
    "Authentication": {
      "main": [
        [
          {
            "node": "Get photo (for testing purposes)",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "Set destination": {
      "main": [
        [
          {
            "node": "Upload photo",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "Set config (sensitive data)": {
      "main": [
        [
          {
            "node": "Authentication",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "Get photo (for testing purposes)": {
      "main": [
        [
          {
            "node": "Set destination",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "When clicking ‘Test workflow’": {
      "main": [
        [
          {
            "node": "Set config (sensitive data)",
            "type": "main",
            "index": 0
          }
        ]
      ]
    }
  }
}

Workflow n8n HTTP, upload de photos, agence automatisation : pour qui est ce workflow ?

Ce workflow s'adresse principalement aux équipes techniques et marketing des PME et grandes entreprises qui cherchent à simplifier le processus d'upload d'images. Un niveau technique intermédiaire est recommandé pour la personnalisation du workflow.

Workflow n8n HTTP, upload de photos, agence automatisation : problème résolu

Ce workflow résout le problème de la gestion manuelle des uploads de photos, qui peut être chronophage et sujet à des erreurs. En automatisant ce processus, les utilisateurs peuvent éviter les frustrations liées aux uploads manuels, réduire le temps consacré à cette tâche et garantir une meilleure précision dans la gestion des fichiers. Après la mise en place de ce workflow, les utilisateurs bénéficieront d'un processus d'upload d'images fluide et efficace.

Workflow n8n HTTP, upload de photos, agence automatisation : étapes du workflow

Étape 1 : Le workflow est déclenché manuellement par l'utilisateur en cliquant sur 'Test workflow'.

  • Étape 1 : Une requête HTTP est effectuée pour uploader la photo à l'URL spécifiée.
  • Étape 2 : Les données sensibles sont configurées à l'aide d'un nœud dédié pour garantir la sécurité des informations.
  • Étape 3 : Une autre requête HTTP est exécutée pour récupérer une photo à des fins de test.
  • Étape 4 : Des notes autocollantes sont créées pour afficher des informations pertinentes tout au long du processus.

Workflow n8n HTTP, upload de photos, agence automatisation : guide de personnalisation

Pour personnaliser ce workflow, vous pouvez modifier l'URL de la requête HTTP pour l'adapter à votre serveur d'upload. Assurez-vous également de configurer correctement les paramètres d'authentification dans le nœud 'Authentication' pour garantir la sécurité. Si vous souhaitez ajouter d'autres fonctionnalités, envisagez d'intégrer des nœuds supplémentaires pour traiter les images après l'upload ou pour envoyer des notifications. Pensez à tester le workflow après chaque modification pour vous assurer qu'il fonctionne comme prévu.