Site e-commerce - Formulaire d'essayage virtuel

• •Peut nécessiter les informations d'identification d'authentification de l'API cible

{
  "id": "bnkWL5ReJLmi9DKA",
  "meta": {
    "instanceId": "a4bfc93e975ca233ac45ed7c9227d84cf5a2329310525917adaf3312e10d5462",
    "templateCredsSetupCompleted": true
  },
  "name": "Form Visual Try-on for Ecommerce webiste",
  "tags": [],
  "nodes": [
    {
      "id": "ec6c9aa4-aa67-4f76-bda5-2d8368995993",
      "name": "À la soumission du formulaire",
      "type": "n8n-nodes-base.formTrigger",
      "position": [
        -680,
        200
      ],
      "webhookId": "ca1c314d-46c6-4eeb-b6a5-359de7601906",
      "parameters": {
        "options": {
          "appendAttribution": false
        },
        "formTitle": "Virtual Try On",
        "formFields": {
          "values": [
            {
              "fieldLabel": "Nome",
              "placeholder": "Nome",
              "requiredField": true
            },
            {
              "fieldName": "Product",
              "fieldType": "hiddenField"
            },
            {
              "fieldType": "file",
              "fieldLabel": "Me",
              "requiredField": true,
              "acceptFileTypes": ".jpg,.png"
            }
          ]
        },
        "formDescription": "Upload your image and virtually try on the dress"
      },
      "typeVersion": 2.2
    },
    {
      "id": "12941dfe-2c91-4270-87a4-510f83c7aa65",
      "name": "FTP",
      "type": "n8n-nodes-base.ftp",
      "position": [
        -420,
        200
      ],
      "parameters": {
        "path": "=/eolianpenthouse.dev.eureweb.it/test/{{$now.format('yyyyyyLLddHHii')}}-{{ $json.Me[0].filename }}",
        "operation": "upload",
        "binaryPropertyName": "Me"
      },
      "credentials": {
        "ftp": {
          "id": "VRMB0CWVo86cIM26",
          "name": "FTP account (Eolian DEV)"
        }
      },
      "typeVersion": 1
    },
    {
      "id": "d5524925-4d2d-4c95-9efc-c877004e65b0",
      "name": "Obtenir l'URL de l'image",
      "type": "n8n-nodes-base.httpRequest",
      "position": [
        -680,
        460
      ],
      "parameters": {
        "url": "=https://queue.fal.run/fal-ai/kling/requests/{{ $json.request_id }}",
        "options": {},
        "authentication": "genericCredentialType",
        "genericAuthType": "httpHeaderAuth"
      },
      "credentials": {
        "httpHeaderAuth": {
          "id": "daOZafXpRXLtoLUV",
          "name": "Fal.run API"
        }
      },
      "typeVersion": 4.2
    },
    {
      "id": "87300ee2-366e-469b-85bf-9dbd1d5de850",
      "name": "Obtenir le statut",
      "type": "n8n-nodes-base.httpRequest",
      "position": [
        240,
        200
      ],
      "parameters": {
        "url": "=https://queue.fal.run/fal-ai/kling/requests/{{ $('Create Image').item.json.request_id }}/status ",
        "options": {},
        "authentication": "genericCredentialType",
        "genericAuthType": "httpHeaderAuth"
      },
      "credentials": {
        "httpHeaderAuth": {
          "id": "daOZafXpRXLtoLUV",
          "name": "Fal.run API"
        }
      },
      "typeVersion": 4.2
    },
    {
      "id": "8db4508e-b82a-4134-85c7-44b2162d5da6",
      "name": "Note adhésive",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -300,
        -980
      ],
      "parameters": {
        "color": 6,
        "width": 340,
        "height": 540,
        "content": "## Me\n![image](https://n3wstorage.b-cdn.net/n3witalia/model.jpg)"
      },
      "typeVersion": 1
    },
    {
      "id": "f4765a45-0ad4-49d6-8227-9cc3e050b429",
      "name": "Note adhésive1",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -700,
        -980
      ],
      "parameters": {
        "color": 6,
        "width": 360,
        "height": 540,
        "content": "## Product\n![image](https://n3wstorage.b-cdn.net/n3witalia/tshirt.jpg)"
      },
      "typeVersion": 1
    },
    {
      "id": "79a6158d-fb3c-4293-82cc-e344aa21db37",
      "name": "Note adhésive2",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        80,
        -980
      ],
      "parameters": {
        "color": 4,
        "width": 340,
        "height": 540,
        "content": "## Result\n![image](https://n3wstorage.b-cdn.net/n3witalia/result.png)"
      },
      "typeVersion": 1
    },
    {
      "id": "032557a3-1ced-47d3-8e72-b1e3057d9e46",
      "name": "Note adhésive3",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -700,
        -1260
      ],
      "parameters": {
        "color": 3,
        "width": 740,
        "height": 240,
        "content": "# Functionality\n\nThis low-code automation enables all eCommerce store visitors to upload a **photo of themselves and virtually “try on”** a garment in just a few clicks. \n\nWith this workflow, **WooCommerce, Prestashop, Shopify** and more merchants can offer a cutting-edge “virtual try-on” feature with minimal development effort, enhancing customer engagement and reducing product returns.\n\n"
      },
      "typeVersion": 1
    },
    {
      "id": "6a740b21-b95f-4c8e-bb92-c205e52e3925",
      "name": "Terminé ?",
      "type": "n8n-nodes-base.if",
      "position": [
        420,
        200
      ],
      "parameters": {
        "options": {},
        "conditions": {
          "options": {
            "version": 2,
            "leftValue": "",
            "caseSensitive": true,
            "typeValidation": "strict"
          },
          "combinator": "and",
          "conditions": [
            {
              "id": "383d112e-2cc6-4dd4-8985-f09ce0bd1781",
              "operator": {
                "name": "filter.operator.equals",
                "type": "string",
                "operation": "equals"
              },
              "leftValue": "={{ $json.status }}",
              "rightValue": "COMPLETED"
            }
          ]
        }
      },
      "typeVersion": 2.2
    },
    {
      "id": "f33040d8-cbac-4c21-845b-10397c5210cc",
      "name": "Note adhésive5",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -700,
        -80
      ],
      "parameters": {
        "width": 740,
        "height": 180,
        "content": "## STEP 3  - ECOMMERCE\nIn production environment, the \"Product\" field must be dynamically filled with the url of the product dress image (e.g. https://n3wstorage.b-cdn.net/n3witalia/camicia-seta.png).\n\nOn the ecommerce, create a \"Try On\" button and the following url to open in pop-up format https://URL_N8N/form/ca1c314d-46c6-4eeb-b6a5-359XXXXXX?Product=IMAGE_URL"
      },
      "typeVersion": 1
    },
    {
      "id": "0799d997-c38e-4c84-8096-0f2ef04b0223",
      "name": "Créer une image",
      "type": "n8n-nodes-base.httpRequest",
      "position": [
        -180,
        200
      ],
      "parameters": {
        "url": "https://queue.fal.run/fal-ai/kling/v1-5/kolors-virtual-try-on",
        "method": "POST",
        "options": {},
        "jsonBody": "={\n  \"human_image_url\": \"https://eolianpenthouse.dev.eureweb.it/test/{{$now.format('yyyyyyLLddHHii')}}-{{ $json.Me[0].filename }}\",\n  \"garment_image_url\": \"{{ $('On form submission').item.json.Product }}\"\n} ",
        "sendBody": true,
        "sendHeaders": true,
        "specifyBody": "json",
        "authentication": "genericCredentialType",
        "genericAuthType": "httpHeaderAuth",
        "headerParameters": {
          "parameters": [
            {
              "name": "Content-Type",
              "value": "application/json"
            }
          ]
        }
      },
      "credentials": {
        "httpHeaderAuth": {
          "id": "daOZafXpRXLtoLUV",
          "name": "Fal.run API"
        }
      },
      "typeVersion": 4.2
    },
    {
      "id": "63e29ad5-5965-4a2c-98f5-bc89124a6b21",
      "name": "Note adhésive6",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -700,
        -400
      ],
      "parameters": {
        "width": 740,
        "height": 140,
        "content": "## STEP 1 - GET API KEY (YOURAPIKEY)\nCreate an account [here](https://fal.ai/) and obtain API KEY.\nIn the node \"Create Image\" set \"Header Auth\" and set:\n- Name: \"Authorization\"\n- Value: \"Key YOURAPIKEY\""
      },
      "typeVersion": 1
    },
    {
      "id": "67188445-73c4-4070-b1f8-6e21beb3e1fa",
      "name": "Formulaire",
      "type": "n8n-nodes-base.form",
      "position": [
        -240,
        460
      ],
      "webhookId": "69559b3a-3175-4864-8e41-2892eaa80d8e",
      "parameters": {
        "operation": "completion",
        "redirectUrl": "={{ $json.image.url }}",
        "respondWith": "redirect"
      },
      "typeVersion": 1
    },
    {
      "id": "1a65532e-abb9-4c3f-99c3-ddf35e7ed5e4",
      "name": "Note adhésive7",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -700,
        -220
      ],
      "parameters": {
        "width": 740,
        "height": 100,
        "content": "## STEP 2  - FTP\nFTP space or S3 bucket to temporarily upload your image to"
      },
      "typeVersion": 1
    },
    {
      "id": "cf2e4f76-e658-4aa3-a6c0-9a85bb1749e6",
      "name": "Obtenir l'image",
      "type": "n8n-nodes-base.httpRequest",
      "position": [
        -460,
        460
      ],
      "parameters": {
        "url": "={{ $json.image.url }}",
        "options": {}
      },
      "typeVersion": 4.2
    },
    {
      "id": "04573589-8467-4768-9451-177aa2d19f57",
      "name": "Attendre 10 sec.",
      "type": "n8n-nodes-base.wait",
      "position": [
        60,
        200
      ],
      "webhookId": "351bd496-a9cc-445c-86f6-a56189df0028",
      "parameters": {
        "amount": 10
      },
      "typeVersion": 1.1
    }
  ],
  "active": false,
  "pinData": {},
  "settings": {
    "executionOrder": "v1"
  },
  "versionId": "c42ea134-5e24-4e45-9a6b-0f0765c4c13c",
  "connections": {
    "12941dfe-2c91-4270-87a4-510f83c7aa65": {
      "main": [
        [
          {
            "node": "0799d997-c38e-4c84-8096-0f2ef04b0223",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "67188445-73c4-4070-b1f8-6e21beb3e1fa": {
      "main": [
        []
      ]
    },
    "cf2e4f76-e658-4aa3-a6c0-9a85bb1749e6": {
      "main": [
        [
          {
            "node": "67188445-73c4-4070-b1f8-6e21beb3e1fa",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "6a740b21-b95f-4c8e-bb92-c205e52e3925": {
      "main": [
        [
          {
            "node": "d5524925-4d2d-4c95-9efc-c877004e65b0",
            "type": "main",
            "index": 0
          }
        ],
        [
          {
            "node": "04573589-8467-4768-9451-177aa2d19f57",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "87300ee2-366e-469b-85bf-9dbd1d5de850": {
      "main": [
        [
          {
            "node": "6a740b21-b95f-4c8e-bb92-c205e52e3925",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "0799d997-c38e-4c84-8096-0f2ef04b0223": {
      "main": [
        [
          {
            "node": "04573589-8467-4768-9451-177aa2d19f57",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "04573589-8467-4768-9451-177aa2d19f57": {
      "main": [
        [
          {
            "node": "87300ee2-366e-469b-85bf-9dbd1d5de850",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "d5524925-4d2d-4c95-9efc-c877004e65b0": {
      "main": [
        [
          {
            "node": "cf2e4f76-e658-4aa3-a6c0-9a85bb1749e6",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "ec6c9aa4-aa67-4f76-bda5-2d8368995993": {
      "main": [
        [
          {
            "node": "12941dfe-2c91-4270-87a4-510f83c7aa65",
            "type": "main",
            "index": 0
          }
        ]
      ]
    }
  }
}