Warren Gates This workflow corresponds to n8n.io template #15393 — we link there as the canonical source.
This workflow follows the Editimage → HTTP Request recipe pattern — see all workflows that pair these two integrations.
The workflow JSON
Copy or download the full n8n JSON below. Paste it into a new n8n workflow, add your credentials, activate. Full import guide →
{
"id": "kT89abpgxM0nQzH6",
"name": "Home Inventory Web Form",
"tags": [],
"nodes": [
{
"id": "4e044a53-5ff8-4d03-81c3-68f927718153",
"name": "Sticky Note",
"type": "n8n-nodes-base.stickyNote",
"position": [
-608,
-160
],
"parameters": {
"width": 480,
"height": 464,
"content": "## Home Inventory Web Form\n\n### How it works\n\n1. A web form submission triggers the workflow.\n2. Images submitted are split into individual items.\n3. Each image is edited to standardize its format.\n4. Data is extracted from the image files.\n5. Extracted data is aggregated for further processing.\n6. An HTTP request is sent with the processed data as a payload.\n\n### Setup steps\n\n- [ ] Ensure the form submission trigger is correctly configured.\n- [ ] Verify that the HTTP request endpoint is accurate and accessible.\n\n### Customization\n\nYou can customize the image processing or payload building by modifying the respective code nodes."
},
"typeVersion": 1
},
{
"id": "8c565e3a-8dd6-4e2f-8f57-b877101f9ea9",
"name": "Sticky Note1",
"type": "n8n-nodes-base.stickyNote",
"position": [
-48,
-128
],
"parameters": {
"color": 7,
"height": 304,
"content": "## Handle form submission\n\nInitiate the workflow on form submission."
},
"typeVersion": 1
},
{
"id": "fe526ee4-abce-481e-a65f-92609c3233a9",
"name": "Sticky Note2",
"type": "n8n-nodes-base.stickyNote",
"position": [
224,
-112
],
"parameters": {
"color": 7,
"width": 624,
"height": 272,
"content": "## Image processing\n\nSplit images, edit and extract data from them."
},
"typeVersion": 1
},
{
"id": "ae3caf55-58ee-4933-9fcc-5aca7ca69a90",
"name": "Sticky Note3",
"type": "n8n-nodes-base.stickyNote",
"position": [
880,
-128
],
"parameters": {
"color": 7,
"width": 416,
"height": 304,
"content": "## Aggregate and build payload\n\nAggregate extracted data and construct request payload."
},
"typeVersion": 1
},
{
"id": "77b9d6e2-7faf-43e0-9a96-1e8e3c29941a",
"name": "Sticky Note4",
"type": "n8n-nodes-base.stickyNote",
"position": [
1328,
-160
],
"parameters": {
"color": 7,
"height": 320,
"content": "## Send to webhook\n\nFinal HTTP request to send the data payload to a specified endpoint."
},
"typeVersion": 1
},
{
"id": "e53e3c91-650b-4d9c-91fa-92cfc7ddd112",
"name": "On form submission",
"type": "n8n-nodes-base.formTrigger",
"position": [
0,
0
],
"parameters": {
"options": {
"path": "add-property-item"
},
"formTitle": "Add Inventory Item",
"formFields": {
"values": [
{
"fieldName": "images",
"fieldType": "file",
"fieldLabel": "Images"
},
{
"fieldName": "description",
"fieldLabel": "Description"
}
]
},
"formDescription": "Upload one or more images of an item to add it to the personal property inventory database. Note that images should be of the same item."
},
"typeVersion": 2.5
},
{
"id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
"name": "Split Images to Items",
"type": "n8n-nodes-base.code",
"position": [
272,
0
],
"parameters": {
"jsCode": "const item = $input.first();\nconst description = item.json.description ?? '';\nconst binary = item.binary ?? {};\n\nconst imageKeys = Object.keys(binary)\n .filter(k => k === 'images' || k.startsWith('images_'))\n .sort();\n\nif (imageKeys.length === 0) {\n throw new Error('No images found in form submission.');\n}\n\nreturn imageKeys.map(key => ({\n json: { description },\n binary: { image: binary[key] }\n}));"
},
"typeVersion": 2
},
{
"id": "d51a15d8-6ae5-47b7-8e15-30f1782ff9c2",
"name": "Edit Image",
"type": "n8n-nodes-base.editImage",
"position": [
496,
0
],
"parameters": {
"width": 1500,
"height": 1500,
"options": {
"format": "webp"
},
"operation": "resize",
"dataPropertyName": "image"
},
"typeVersion": 1
},
{
"id": "c3d4e5f6-a7b8-9012-cdef-012345678912",
"name": "Aggregate Images",
"type": "n8n-nodes-base.aggregate",
"position": [
928,
0
],
"parameters": {
"options": {},
"aggregate": "aggregateAllItemData"
},
"typeVersion": 1
},
{
"id": "d4e5f6a7-b8c9-0123-def0-123456789123",
"name": "Build Payload",
"type": "n8n-nodes-base.code",
"position": [
1152,
0
],
"parameters": {
"mode": "runOnceForEachItem",
"jsCode": "const allItems = $input.item.json.data;\nconst images = allItems.map(item => item.imageBase64);\nconst description = $(\"On form submission\").item.json.description ?? '';\nreturn { json: { images, description } };"
},
"typeVersion": 2
},
{
"id": "e5f6a7b8-c9d0-1234-ef01-234567890124",
"name": "HTTP Request",
"type": "n8n-nodes-base.httpRequest",
"position": [
1376,
0
],
"parameters": {
"url": "",
"method": "POST",
"options": {},
"jsonBody": "={{ $json }}",
"sendBody": true,
"specifyBody": "json",
"authentication": "genericCredentialType",
"genericAuthType": "httpHeaderAuth"
},
"credentials": {
"httpHeaderAuth": {
"name": "<your credential>"
}
},
"typeVersion": 4.2
},
{
"id": "22f889da-fdbc-40da-b093-1a0907fd3f2c",
"name": "Extract from File",
"type": "n8n-nodes-base.extractFromFile",
"position": [
704,
0
],
"parameters": {
"options": {},
"operation": "binaryToPropery",
"destinationKey": "imageBase64",
"binaryPropertyName": "image"
},
"typeVersion": 1.1
}
],
"active": true,
"settings": {
"binaryMode": "separate",
"callerPolicy": "workflowsFromSameOwner",
"errorWorkflow": "WRe-Uudd4ntUdn0ApI0gA",
"timeSavedMode": "fixed",
"availableInMCP": false,
"executionOrder": "v1"
},
"versionId": "c6a19776-5f56-4364-9fd6-8d7955bf2a1f",
"connections": {
"Edit Image": {
"main": [
[
{
"node": "Extract from File",
"type": "main",
"index": 0
}
]
]
},
"Build Payload": {
"main": [
[
{
"node": "HTTP Request",
"type": "main",
"index": 0
}
]
]
},
"Aggregate Images": {
"main": [
[
{
"node": "Build Payload",
"type": "main",
"index": 0
}
]
]
},
"Extract from File": {
"main": [
[
{
"node": "Aggregate Images",
"type": "main",
"index": 0
}
]
]
},
"On form submission": {
"main": [
[
{
"node": "Split Images to Items",
"type": "main",
"index": 0
}
]
]
},
"Split Images to Items": {
"main": [
[
{
"node": "Edit Image",
"type": "main",
"index": 0
}
]
]
}
}
}
Credentials you'll need
Each integration node will prompt for credentials when you import. We strip credential IDs before publishing — you'll add your own.
httpHeaderAuth
For the full experience including quality scoring and batch install features for each workflow upgrade to Pro
About this workflow
This provides a web form for use with my personal property inventory workflow, allowing you to upload image(s) and an optional description with a simple web interface. Displays web form allowing you upload image(s) and an optional description Resizes images and converts to webp…
Source: https://n8n.io/workflows/15393/ — original creator credit. Request a take-down →
Related workflows
Workflows that share integrations, category, or trigger type with this one. All free to copy and import.
This workflow allows you to import any workflow from a file or another n8n instance and map the credentials easily. A multi-form setup guides you through the entire process At the beginning you have t
[n8n] Advanced URL Parsing and Shortening Workflow - Switchy.io Integration. Uses splitInBatches, stickyNote, httpRequest, html. Event-driven trigger; 56 nodes.
[](https://youtu.be/c7yCZhmMjtI)
N8n recently introduced folders and it has been a big improvement on workflow management on top of the tags.
This workflow automates the creation of press releases for music artists releasing a new single. Upload your MP3, fill in basic info, and receive a publication-ready press release saved as a Google Do