Dify 工作流实战：快速搭建 Web 登录界面

Dify 工作流实战：快速搭建 Web 登录界面

在开发 AI 应用时，我们常遇到一个痛点：Dify 原生工作流虽然逻辑强大，但缺乏用户交互界面。如果仅靠自然语言对话来处理身份验证，用户体验往往不够直观。用户需要清晰的输入框来填写账号密码，系统也需要可靠的验证机制。通过 Dify 的模板转换节点（Template Transform），我们可以渲染 HTML 表单，将聊天窗口升级为具备专业认证能力的 Web 应用。

核心思路：HTML 表单与 JSON 解析

Dify 的模板转换节点支持渲染 HTML 代码。关键在于利用 data-format="json" 属性，让前端表单提交的数据自动转换为后端可处理的 JSON 格式。这样，后续的 Python 代码节点就能直接解析用户输入，无需复杂的字符串处理。

1. 设计登录表单模板

在工作流中添加模板转换节点，编写如下 HTML 结构。这里包含了用户名、密码输入框及登录按钮。

<form data-format="json">
  <label for="username">用户名：</label>
  <input type="text" name="username" />
  <label for="password">密码：</label>
  <input type="password" name="password" />
  <button>登录</button>
</form>

注意 data-format="json" 属性，这是数据流转的关键。它确保了用户点击登录后，输入内容会被封装成标准的 JSON 对象传递给下一个节点。

2. 配置验证逻辑

接下来添加代码节点处理验证。实际项目中，这里的逻辑应替换为企业内部的 API 调用，但在原型阶段，我们可以使用硬编码模拟。

def main(input_string):
    # 解析前端传来的 JSON 数据
    import json
    :
        data = json.loads(input_string)
        username = data.get()
        password = data.get()
        
        
         username ==   password == :
             {: , : , : }
        :
             {: , : , : }
     Exception  e:
         {: , : }