Dynamically generate a webpage from user request using OpenAI Structured Output — n8n 工作流

复杂度🔗 Webhook5 个节点⚒️ Engineering👁 13,356 次查看作者:Agent Studio

概览

This workflow is a experiment to build HTML pages from a user input using the new Structured Output from OpenAI.

How it works: Users add what they want to build as a query parameter The OpenAI node generate an interface following a structured output defined in the body The JSON output is then converted to HTML along with a title The HTML is encapsulated in an HTML node (where the Tailwind css script is added) The HTML is rendered to the user via the Webhook response.

Set up steps Create an Ope

使用的节点

HTTP RequestHTMLOpenAI

工作流预览

Generate HTML from user query
HTTP Request node
- Send the user query to OpenAI, with a defined JSON re
Workflow: Dynamically generate an HTML page f
Overview
- This workflow is a experiment to build HTML pages fro
R
Respond to Webhook
Open AI - Using Structur…
OpenAI - JSON to HTML
Format the HTML result
W
Webhook
5 nodes4 edges

工作原理

  1. 1

    触发器

    工作流由 webhook 触发器启动。

  2. 2

    处理

    数据流经 5 个节点, connecting html, httprequest, openai。

  3. 3

    输出

    工作流完成自动化并将结果发送到配置的目标。

节点详情 (5)

HT

HTTP Request

httpRequest

#1
HT

HTML

html

#2
OP

OpenAI

n8n-nodes-langchain.openAi

#3

如何导入此工作流

  1. 1点击右侧 下载 JSON 按钮保存工作流文件。
  2. 2打开你的 n8n 实例,依次点击 工作流 → 新建 → 从文件导入
  3. 3选择下载的 dynamically-generate-a-webpage-from-user-request-using-openai-structured-output 文件并点击导入。
  4. 4为每个服务节点配置 凭证(API 密钥、OAuth 等)。
  5. 5点击 测试工作流 验证一切正常,然后激活它。

或直接在 n8n → 从 JSON 导入 中粘贴:

{ "name": "Dynamically generate a webpage from user request using OpenAI Structured Output", "nodes": [...], ...}

集成

htmlhttprequestopenairespondtowebhookwebhook

获取此工作流

一键下载并导入

下载 JSON在 n8n.io 上查看
节点5
复杂度low
触发器webhook
查看次数13,356

创建者

Agent Studio

Agent Studio

@agentstudio

标签

htmlhttprequestopenairespondtowebhookwebhook

n8n 新手?

n8n 是一款免费开源的工作流自动化工具,支持自托管或使用云版本。

免费获取 n8n →

Related Engineering Workflows

COGOHTIF+5
high

Automate YooKassa Payments & Order Logs in Google Sheets

Transform your payment operations with this comprehensive n8n automation designed for seamless YooKassa integration. Instead of manual data entry, this workflow creates a self-correcting financial ledger by syncing every transaction directly into Google Sheets in real-time. The logic handles the entire commerce lifecycle: from the moment a customer initiates a checkout to the final status confirmation via secure webhooks. What sets this template apart is its robust error-handling and multi-stage processing. It doesn't just log successful sales; it intelligently updates refund statuses, sorts transaction types, and uses conditional logic to ensure your spreadsheet remains a 'single source of truth.' By utilizing the Respond to Webhook node, the workflow provides immediate feedback to the payment gateway, ensuring high reliability. This is an enterprise-grade solution for small business owners who need to scale their digital sales without the overhead of expensive ERP software or manual bookkeeping. It eliminates human error, accelerates fulfillment, and provides a transparent audit trail for every ruble processed. **Common Use Cases:** - Automated Digital Product Delivery: Trigger instant access to downloads or courses once the YooKassa payment status is verified in the sheet. - Real-time Financial Reporting: Maintain a live dashboard of sales performance and refund rates for e-commerce stakeholders without manual exports. - No-code Subscription Management: Track recurring customer payments and trial expirations by logging every transaction event into a centralized Google Sheets database.

🔗 Webhook·39 nodes
COGOHTMA
low

Automate Google AI Overview Tracking: SEO Audit with SerpApi

As Google’s Search Generative Experience (SGE) reshapes the digital landscape, traditional SEO metrics often fall short. This advanced n8n workflow bridges the data gap by providing a scalable solution for monitoring brand visibility within AI Overviews. By integrating SerpApi with Google Sheets, the automation systematically audits your target keyword clusters to detect AI-generated summaries and source citations. The process begins by pulling high-priority keywords directly from your repository. It then executes real-time search queries via SerpApi, utilizing custom JavaScript in a Code node to parse complex JSON responses. The workflow specifically identifies if an AI Overview is present and, more importantly, whether your domain is cited as a primary source. All findings are exported into a structured Google Sheet, creating a historical record of your 'AI Share of Voice.' This automation saves SEO teams dozens of manual hours, allowing for data-driven adjustments to content strategy based on how Google’s LLM perceives and attributes your site’s authority. It is an essential tool for agencies and enterprise SEOs looking to defend their organic traffic in the age of generative search. **Common Use Cases:** - SGE Visibility Benchmarking vs Competitors - Automated AI Citation Reporting for SEO Clients - Content Strategy Optimization for Informational Intent Queries

Trigger·5 nodes
EDFOGIGM+3
medium

Automate Dynamic GitHub Images & URL Redirects in n8n

Stop manually updating marketing assets across distributed channels. This professional n8n automation eliminates the 'stale content' problem by transforming static GitHub-hosted images and links into dynamic, self-updating resources. Instead of hunting down every email template or PDF where you've embedded a promotional banner, this workflow allows you to push updates to a central GitHub repository that automatically reflects across all live instances. The workflow functions by utilizing GitHub as a headless content management system. It leverages the EditImage node to programmatically modify visual assets and the GitHub node to commit these changes automatically. It includes a Form Trigger for on-demand updates and a Schedule Trigger for recurring maintenance. By using stable embed links that point to dynamic GitHub files, your marketing collateral remains evergreen. Whether you are updating a limited-time offer in an old email sequence or refreshing data visualizations in a shared report, this automation ensures your audience always sees the most current information without requiring manual re-distribution of files. **Common Use Cases:** - Automated Email Banner Updates for Evergreen Campaigns - Dynamic GitHub Profile Readme & Repository Statistics - Centralized Promo Link Management for Distributed PDF Guides

Trigger·12 nodes
AGCOEXGI+8
medium

Automate Jekyll SEO Blogs with GPT-4 and GitHub (n8n Guide)

This sophisticated automation engine transforms your content strategy by bridging the gap between raw data and a live, high-ranking Jekyll website. Instead of manually drafting and formatting Markdown files, this workflow utilizes an advanced LangChain agent powered by GPT-4 to synthesize high-quality, long-form articles from simple CSV inputs. The system intelligently parses your data, constructs SEO-optimized blog posts, and handles the technical heavy lifting by committing the code directly to your GitHub repository. This triggers your CI/CD pipeline for instant deployment. Beyond just publishing, the workflow acts as a social media manager, automatically distributing your new content to LinkedIn and X (Twitter) to maximize reach and backlinks. It is an ideal solution for lean marketing teams or solo developers who need to maintain a consistent publishing cadence without the overhead of a traditional CMS. By automating the research, writing, and distribution phases, users can scale their organic traffic exponentially while focusing on high-level strategy rather than repetitive formatting and manual commits. **Common Use Cases:** - Programmatic SEO for Niche Affiliate Marketing Sites - Automated Technical Documentation and Change Log Updates - Scalable Content Engine for Multi-Language Recipe or Directory Portals

Trigger·13 nodes
AGCOEMEM+5
medium

Build a Local AI Book Concierge with Ollama & n8n

Transform your inbox into an intelligent, automated literary assistant with this advanced n8n workflow. By leveraging the power of local LLMs through Ollama and the OpenLibrary API, this automation eliminates the manual effort of responding to reading inquiries. The process begins by monitoring an IMAP folder for incoming requests. Once an email arrives, a sophisticated AI agent analyzes the sender's natural language to pinpoint their specific interests and genre preferences. The workflow then executes a real-time API lookup to fetch accurate bibliographical data, including summaries and metadata. Finally, it crafts and sends a professional, personalized recommendation email back to the user. This setup is perfect for organizations looking to deploy privacy-focused AI solutions without relying on expensive cloud tokens. It demonstrates a high-level integration of LangChain agents, conditional logic, and external data enrichment, providing a seamless 'set-and-forget' experience for managing high volumes of literary or educational inquiries while maintaining a human-like touch in communication. **Common Use Cases:** - Personalized Reading Lists for Digital Newsletters - Automated Curriculum Support for Educational Institutions - Privacy-First Customer Engagement for Local Bookstores

▶️ Manual·15 nodes
AGCOFIGM+6
medium

Automate HubSpot AI Email Replies with Slack Approval (n8n)

This advanced n8n automation bridges the gap between AI-driven speed and human-verified precision. By integrating Google Gemini with your HubSpot CRM, the workflow automatically generates context-aware email responses whenever a new inquiry hits your Gmail inbox. Unlike basic auto-responders, this system queries your HubSpot records—including contact history, active deals, and support tickets—to ensure every draft is personalized and accurate. To maintain brand integrity, the draft isn't sent immediately; instead, it is routed to a dedicated Slack channel via an interactive message. Your team can review, edit, or approve the reply with a single click, triggering the final send via Gmail. This eliminates the manual overhead of switching between tabs to find customer data and drafting repetitive emails from scratch. It is the perfect solution for scaling customer operations without hiring additional headcount, ensuring that every outbound communication is data-backed and professionally vetted. The workflow utilizes LangChain agents for intelligent reasoning, filtering out internal noise to focus purely on high-value customer interactions. **Common Use Cases:** - High-priority sales lead nurturing where quick, data-informed follow-ups are critical for conversion. - Technical support escalation where AI drafts troubleshooting steps based on existing HubSpot ticket history. - Account management automation for handling routine client inquiries with personalized data from active deals.

Trigger·13 nodes