跳转到内容
无痕工具库 无痕工具库

Hostinger AI Builder 代理模式创建管理面板教程

为你的 Hostinger AI Builder 智能体模式 Web 应用创建一个私有的、需登录才能访问的管理面板,无需编写代码即可管理动态内容,例如产品、博客文章或图库图片。Hostinger AI Builder 会使用内置后端,根据你的提示词自动处理数据存储、身份验证和集合(collections)。

在测试模式下所做的更改不会影响你已上线的网站;在发布之前,请务必先验证功能是否正常。

第 1 步:输入初始应用提示词

为了奠定应用的基础,请在第一条消息中提供全面的概述。

  1. 打开 Hostinger AI Builder 编辑器。
  2. 输入一段同时描述公开网站和私有管理区域的提示词。
    示例提示词: 创建一个 Web 应用,包含一个面向公众的网站和一个可通过邮箱和密码登录访问的私有管理面板。管理面板必须允许我添加、编辑和删除产品(名称、价格、图片、描述)、博客文章(标题、内容、封面图片)以及图库图片。公开网站应动态显示这些内容。

第 2 步:配置身份验证

如果初始提示词没有生成可用的登录系统,请优化身份验证逻辑。

  1. 要求生成一个专门的登录页面并进行路由保护。
    示例提示词: 为管理面板添加一个登录页面,使用邮箱和密码进行身份验证。确保只有已登录的管理员才能访问管理区域,并将未认证的用户重定向到登录页面。

第 3 步:构建内容管理板块

一次添加一个特定的管理模块,以确保稳定性。

  1. 产品管理: 提示 Hostinger AI Builder 创建一个库存管理板块。
    示例提示词: 在管理面板中添加一个产品板块,用于添加新产品,包含名称、价格、描述和图片,并包含一个现有产品列表,带有编辑和删除选项。
  2. 博客和图库: 使用类似的提示词为博客文章和图库添加板块,并为每个板块指定所需的字段(例如标题、日期或封面图片)。
    示例提示词:
    *在管理面板中添加一个博客文章板块,让我可以撰写、编辑和发布文章,包含标题、内容和封面图片。*在管理面板中添加一个图库板块,让我可以上传、替换和删除在公开网站上显示的图片。

第 4 步:将内容同步到公开网站

确保在管理面板中输入的数据能正确显示给访客。

  1. 让 Hostinger AI Builder 将后端集合链接到你的主页或子页面。
    示例提示词: 将公开主页连接到管理面板数据库。当产品、博客文章或图库图片在管理区域中被添加或编辑时,公开网站必须自动更新。

完成后,你就拥有了一个功能完整的管理界面,可以实时管理 Hostinger AI Builder 网站的内容。你可以随时使用预览屏幕顶部的 Data(数据)开关来监控和编辑原始数据。

常见问题排查

如果你的管理面板或动态内容未按预期运行,可以使用以下提示词和检查方法来解决问题:

  1. 动态内容未在公开网站上显示:确保公开网站配置为从与管理面板写入数据完全相同的数据库集合中获取数据。
    你可以使用提示词:确保公开页面从管理面板使用的 [集合名称] 集合中获取并显示最新数据。
  2. 登录后重定向回登录页面:这通常表明存在会话存储问题。
    使用此提示词:修复身份验证流程,确保用户成功登录后被重定向到管理控制面板,并保持已认证状态。
  3. 无需身份验证即可访问管理面板:你必须确保所有管理路由都受到保护。
    使用此提示词:为所有管理面板页面添加路由保护。自动将所有未认证的用户重定向到登录页面。
  4. 提示词所做的更改在已上线的网站上不可见: 在 Hostinger AI Builder 编辑器中,你必须点击 Publish,然后选择 Publish changes。更改可能需要几分钟才能生效;可以使用无痕窗口查看网站,以绕过本地浏览器缓存。
  5. 添加某项功能后出现错误消息:向 AI 提供具体的错误详情以供分析。
    使用此提示词:当我 [描述具体步骤] 时,出现控制台错误“[粘贴错误信息]”。Network(网络)标签页显示了对 [URL] 的请求,payload 为 [粘贴 payload],错误为 [粘贴错误代码]。你能修复这个问题吗?

使用 Hostinger AI Builder 的内部数据浏览器,在你输入提示词的同时验证集合是否被正确创建。如果遇到错误,请将具体的错误消息和相关代码行粘贴到提示词区域,让 Hostinger AI Builder 进行分析和修复。如果你还想将外部服务连接到你的项目中,例如支付处理器或 API,请参阅如何在智能体模式下使用集成。