表单数据处理工作流

n8n工作流示例,通过表单触发器收集数据,使用JavaScript节点重新格式化,并通过HTTP请求发送到API。

  • by hosamelbasiony
  • 本地部署
  • 更新于
在 GitHub 查看 hosamelbasiony/n8n-mcp-tutorial

使用说明

n8n MCP教程

一个最小的端到端示例,展示了如何通过MCP构建一个简单的n8n工作流,该工作流:

  • 通过表单触发器收集文本(表单提交时)
  • 在代码(JavaScript)节点中重新格式化有效负载
  • 将结果作为JSON发布到API: { "input": "..." }

工作流:表单触发器→ Code → HTTP请求

先决条件

  • n8n(云或自托管)
  • 连接到n8n MCP服务器的启用MCP的客户端(例如,带有MCP网关的VS Code)
  • 您控制的API端点(以下示例使用 http://127.0.0.1/uploads)

快速启动

  1. 将下面的工作流程JSON导入n8n(从剪贴板导入)。
  2. 在HTTP请求节点中,设置API的URL(如果需要,包括端口,例如。, http://127.0.0.1:3000/uploads).
  3. 打开“表单触发器”节点,然后单击“打开表单”以获取可共享的URL。
  4. 提交表格;您的API应收到 { "input": "..." }.

工作流程JSON

{
  "name": "Form → Code → Upload",
  "nodes": [
    {
      "parameters": {
        "formTitle": "Upload input",
        "formDescription": "",
        "formFields": {
          "values": [
            {
              "fieldLabel": "input",
              "fieldType": "textarea",
              "placeholder": "Paste text here...",
              "requiredField": true
            }
          ]
        },
        "responseMode": "onReceived",
        "options": {
          "respondWithOptions": {
            "values": {
              "respondWith": "text",
              "formSubmittedText": "Submitted"
            }
          },
          "buttonLabel": "Submit",
          "path": "uploads"
        }
      },
      "id": "1",
      "name": "Form Trigger",
      "type": "n8n-nodes-base.formTrigger",
      "typeVersion": 2,
      "position": [260, 300]
    },
    {
      "parameters": {
        "language": "javaScript",
        "mode": "runOnceForAllItems",
        "jsCode": "return items.map(item => {\n  const raw = (item.json.input ?? '').toString();\n  return { input: raw.trim() };\n});"
      },
      "id": "2",
      "name": "Reformat",
      "type": "n8n-nodes-base.code",
      "typeVersion": 2,
      "position": [520, 300]
    },
    {
      "parameters": {
        "url": "http://127.0.0.1/uploads",
        "method": "POST",
        "sendBody": true,
        "specifyBody": "json",
        "jsonBody": "={{ $json }}"
      },
      "id": "3",
      "name": "HTTP Request",
      "type": "n8n-nodes-base.httpRequest",
      "typeVersion": 4,
      "position": [780, 300]
    }
  ],
  "connections": {
    "Form Trigger": {
      "main": [
        [
          { "node": "Reformat", "type": "main", "index": 0 }
        ]
      ]
    },
    "Reformat": {
      "main": [
        [
          { "node": "HTTP Request", "type": "main", "index": 0 }
        ]
      ]
    }
  }
}

备注

  • 您的API URL必须是有效的URL(包括 http:// 或 https://).
  • 如果您的服务器在某个端口上侦听,请使用 http://127.0.0.1:PORT/uploads (例如 :3000).
  • 要自定义表单UI,请编辑表单触发器选项(标题、描述、自定义CSS等)。

故障排除

  • 如果HTTP节点失败,请检查本地API是否正在运行,以及是否可以从n8n主机访问。
  • 调试时,启用“保存手动执行”并检查n8n中的节点输出。

许可证

麻省理工学院