如何为htmx构建后端？

介绍 在本教程中，您将学习如何使用 back4app 为 htmx 网络应用程序构建完整的后端。 我们将逐步整合 back4app 的基本功能 如数据库管理、云代码函数、rest 和 graphql api、用户身份验证、文件存储和实时查询（实时查询） 以创建一个安全、可扩展且强大的后端，与您的 htmx 前端无缝通信。 使用 htmx，这是一种现代 javascript 库，利用 html 属性处理客户端交互，可以显著改善用户体验，同时专注于服务器端渲染。 通过将 htmx 与 back4app 强大的服务器端框架和模板引擎相结合，开发人员可以轻松高效地创建全栈网络应用程序。 到本教程结束时，您将构建一个专为 htmx 集成量身定制的后端，能够实现平滑的数据操作，并通过动态 html 页面更新改善客户端体验，而无需完全重新加载页面。 先决条件 要完成本教程，您需要： 一个 back4app 账户和一个新的 back4app 项目 开始使用 back4app。 https //www back4app com/docs/get started/new parse app 如果您没有账户，可以免费创建一个。请按照上面的指南准备好您的项目。 基本的 htmx 设置 在您的 html 页面中包含 htmx 库 https //htmx org/ ，使用 一个网络开发环境 确保您有本地服务器设置或使用服务器端框架来提供您的 html 模板。 熟悉 html、css 和 javascript htmx 文档 https //htmx org/docs/ 以获取有关 html 属性和网络应用程序开发的更多详细信息。 在开始之前，请确保您已准备好所有这些先决条件。设置好您的 back4app 项目并准备好本地 htmx 环境将帮助您更轻松地跟随。 步骤 1 – 设置 back4app 项目 创建新项目 在 back4app 上构建您的 htmx 后端的第一步是创建一个新项目。如果您还没有创建一个，请按照以下步骤操作： 登录到您的 back4app 账户 点击“新应用”按钮 在您的 back4app 控制面板中。 给您的应用命名 （例如，“htmx backend tutorial”）。 一旦项目创建完成，您将在您的 back4app 控制面板中看到它列出。这个项目将是本教程中讨论的所有后端配置的基础。 connect via rest api back4app依赖parse平台来管理您的数据，提供实时功能，处理用户身份验证等。虽然htmx本身是一个客户端库，但将您的htmx前端连接到back4app涉及直接从您的html和javascript中进行rest api调用。 获取您的 parse 密钥 在您的 back4app 控制面板中，导航到您应用的“应用设置”或“安全性与密钥”部分以找到您的 应用程序 id , rest api 密钥 , 和 parse 服务器 url （通常格式为 https //parseapi back4app com ）。 使用这些密钥，您可以使用htmx调用您的后端端点并相应地操作您的html模板。例如，您可以结合使用javascript fetch请求和htmx属性，通过rest调用与您的数据进行交互。 step 2 – setting up the database saving and querying data 设置好您的 back4app 项目后，您现在可以开始使用 rest api 调用来保存和检索数据，这些调用可以通过 htmx 请求或普通 javascript 触发。创建记录的最简单方法是向 parse 服务器发出 post 请求： curl x post \\ h "x parse application id your application id" \\ h "x parse rest api key your rest api key" \\ h "content type application/json" \\ d '{"title" "buy groceries", "iscompleted" false}' \\ https //parseapi back4app com/classes/todo 同样，您可以查询数据： curl x get \\ h "x parse application id your application id" \\ h "x parse rest api key your rest api key" \\ https //parseapi back4app com/classes/todo 您还可以根据需要使用 graphql 查询从客户端与数据库进行交互。 schema design and data types 默认情况下，parse 允许 动态创建模式 , 但您也可以在 back4app 仪表板中定义您的类和数据类型，以获得更多控制。 导航到“数据库”部分 在您的 back4app 控制面板中。 创建一个新类 （例如，“todo”）并添加相关列，例如标题（字符串）和是否完成（布尔值）。 back4app 支持多种数据类型，例如 string , number , boolean , object , date , file , pointer, array, relation , geopoint , 和 polygon 使用这些来为您的 htmx 驱动的应用程序设计一个强大的架构。 back4app 提供一个 ai 代理，可以帮助您设计数据模型： 打开ai代理 从您的应用仪表板或菜单中 用简单的语言描述您的数据模型 （例如，“请在back4app上创建一个新的待办事项应用程序，并提供完整的类架构。”）。 让ai代理为您创建架构 使用ai代理可以在设置数据架构时节省时间，并确保应用程序的一致性。 relational data 如果您有关系数据，例如将任务链接到类别，您可以通过 rest api 调用使用 指针 或 关系 在 parse 中。例如，添加一个指针： // example linking a task to a category using rest api async function createtaskforcategory(categoryid, title) { const response = await fetch('https //parseapi back4app com/classes/todo', { method 'post', headers { 'x parse application id' 'your application id', 'x parse rest api key' 'your rest api key', 'content type' 'application/json' }, body json stringify({ title title, category { type "pointer", classname "category", objectid categoryid } }) }); return response json(); } 查询时，请根据需要包含指针数据： // example querying with pointer inclusion async function fetchtodos() { const response = await fetch('https //parseapi back4app com/classes/todo?include=category', { headers { 'x parse application id' 'your application id', 'x parse rest api key' 'your rest api key' } }); return response json(); } live queries 对于实时更新，back4app 提供了 实时查询 。虽然 htmx 专注于服务器端渲染和 html 属性，但集成实时更新可以显著提升用户体验。 启用实时查询 在您的 back4app 控制面板下的应用程序 服务器设置 。确保“实时查询”已开启。 初始化实时查询订阅 如果必要，使用javascript和htmx触发器 （注意：实时查询通常需要 parse sdk；然而，当数据更改时，它们仍然可以与 htmx 一起工作，通过更新页面的部分内容。这个例子演示了这个概念。） import parse from ' /parseconfig'; // this assumes use of the parse sdk in js environment async function subscribetotodos(callback) { const query = new parse query('todo'); const subscription = await query subscribe(); subscription on('create', (newtodo) => { console log('new todo created ', newtodo); callback('create', newtodo); }); subscription on('update', (updatedtodo) => { console log('todo updated ', updatedtodo); callback('update', updatedtodo); }); subscription on('delete', (deletedtodo) => { console log('todo deleted ', deletedtodo); callback('delete', deletedtodo); }); return subscription; } 此订阅可以触发htmx请求或动态更新html模板，以反映客户端的更改。 step 3 – applying security with acls and clps back4app security mechanism back4app 非常重视安全性，提供 访问控制列表 (acls) 和 类级权限 (clps) 。这些功能允许您限制谁可以在每个对象或每个类的基础上读取或写入数据，确保只有授权用户可以修改您的数据。 access control lists (acls) 一个 acl 应用于单个对象，以确定哪些用户、角色或公众可以执行读/写操作。例如： async function createprivatetodo(title, owneruser) { const response = await fetch('https //parseapi back4app com/classes/todo', { method 'post', headers { 'x parse application id' 'your application id', 'x parse rest api key' 'your rest api key', 'content type' 'application/json' }, body json stringify({ title title, acl { \[owneruser id] { "read" true, "write" true }, " " { "read" false, "write" false } } }) }); return response json(); } 当您保存对象时，它具有一个访问控制列表（acl），该列表阻止除指定用户之外的任何人读取或修改它。 class level permissions (clps) clps 管理整个班级的默认权限，例如该班级是否可以公开读取或写入，或者是否只有某些角色可以访问它。 前往您的 back4app 控制面板 , 选择您的应用程序，然后打开 数据库 部分。 选择一个类 （例如，“待办事项”）。 打开类级权限 标签。 配置您的默认设置，例如“需要身份验证”用于读取或写入，或“无访问权限”用于公众。 这些权限设置了基础，而acl则为单个对象微调权限。一个强大的安全模型通常结合了clp（广泛限制）和acl（细粒度的每个对象限制）。有关更多信息，请访问 应用安全指南 https //www back4app com/docs/security/parse security step 4 – writing and deploying cloud functions 云代码是parse server环境的一个功能，允许您在服务器端运行自定义javascript代码。通过编写云代码，您可以为您的back4app后端扩展额外的业务逻辑、验证、触发器和集成，这些都可以在parse server上安全高效地运行。 how it works 当您编写云代码时，通常会将您的 javascript 函数、触发器和任何所需的 npm 模块放在一个 main js 文件中。然后将此文件部署到您的 back4app 项目中，该项目在 parse server 环境中执行。 // main js const axios = require('axios'); parse cloud define('fetchexternaldata', async (request) => { const url = request params url; if (!url) { throw new error('url parameter is required'); } const response = await axios get(url); return response data; }); parse cloud beforesave('todo', (request) => { const todo = request object; if (!todo get('title')) { throw new error('todo must have a title'); } }); 使用 back4app cli 或通过仪表板部署您的 cloud code。 calling your function 通过增强的 htmx 界面，您可以使用 javascript fetch 调用您的 cloud code 函数，并相应地更新您的 html 页面部分。例如： async function gettextlength(text) { const response = await fetch('https //parseapi back4app com/functions/calculatetextlength', { method 'post', headers { 'x parse application id' 'your app id', 'x parse rest api key' 'your rest api key', 'content type' 'application/json' }, body json stringify({ text }) }); const result = await response json(); console log('text length ', result result length); } 您可以在您的 htmx 触发器和 html 属性中集成类似的调用，以在客户端创建动态、响应式的行为，从而改善整体用户体验。 step 5 – configuring user authentication user authentication in back4app back4app 利用 parse user 类作为身份验证的基础。默认情况下，parse 处理密码哈希、会话令牌和安全存储。在 htmx 应用程序的上下文中，用户身份验证可以通过 html 表单提交或 javascript fetch 请求发起的 rest 调用来管理。 setting up user authentication 例如，要创建一个新用户： async function signupuser(username, password, email) { const response = await fetch('https //parseapi back4app com/users', { method 'post', headers { 'x parse application id' 'your app id', 'x parse rest api key' 'your rest api key', 'content type' 'application/json' }, body json stringify({ username, password, email }) }); return response json(); } 同样，对于用户登录： async function loginuser(username, password) { const response = await fetch(`https //parseapi back4app com/login?username=${encodeuricomponent(username)}\&password=${encodeuricomponent(password)}`, { headers { 'x parse application id' 'your app id', 'x parse rest api key' 'your rest api key' } }); return response json(); } session management 成功登录后，parse 创建一个会话令牌，您可以在 htmx 应用程序中存储和管理该令牌，以便后续的身份验证请求。 social login integration 虽然htmx专注于html属性和服务器端交互，但通过启动oauth流程并在服务器端处理回调，仍然可以实现集成社交登录，如google或facebook。请参阅 社交登录文档 https //www back4app com/docs/platform/sign in with apple 以获取详细指导。 email verification and password reset 启用电子邮件验证和密码重置： 导航到电子邮件设置 在您的 back4app 控制面板中。 启用电子邮件验证 并配置必要的模板。 在您的 htmx 流程中使用 fetch 来根据需要触发密码重置请求。 step 6 – handling file storage uploading and retrieving files 解析包括文件存储功能，您可以通过来自您的htmx应用程序的rest api调用来利用这些功能。例如，要上传图像： async function uploadimage(file) { const data = new formdata(); data append('file', file); data append('object', '{" type" "file","name" "' + file name + '"}'); const response = await fetch('https //parseapi back4app com/files/' + file name, { method 'post', headers { 'x parse application id' 'your app id', 'x parse rest api key' 'your rest api key' }, body data }); return response json(); } file security 通过在 back4app 中配置安全设置和根据需要在文件对象上设置 acl，控制谁可以上传和访问文件。 step 7 – scheduling tasks with cloud jobs cloud jobs back4app中的云作业让您可以在后端安排例行任务，例如清理旧数据或发送定期电子邮件。这些作业在服务器端运行，并可以在需要时与您的htmx工作流程集成。 // main js parse cloud job('cleanupoldtodos', async (request) => { const todo = parse object extend('todo'); const query = new parse query(todo); const now = new date(); const thirty days = 30 24 60 60 1000; const cutoff = new date(now thirty days); query lessthan('createdat', cutoff); try { const oldtodos = await query find({ usemasterkey true }); await parse object destroyall(oldtodos, { usemasterkey true }); return `deleted ${oldtodos length} old todos `; } catch (err) { throw new error('error during cleanup ' + err message); } }); 通过 back4app 控制面板安排此工作，位于 应用设置 > 服务器设置 > 后台作业 step 8 – integrating webhooks 网络钩子 允许您的 back4app 应用在某些事件发生时向外部服务发送 http 请求。这对于与第三方系统（如支付网关、电子邮件营销工具或分析平台）集成非常强大。 导航到 webhooks 配置 在您的 back4app 控制面板 > 更多 > webhooks，然后点击添加 webhook。 设置一个端点 （例如， https //your external service com/webhook endpoint https //your external service com/webhook endpoint ）。 配置触发器 以指定在您的 back4app 类或 cloud code 函数中哪些事件将触发 webhook。 例如，当创建新的待办事项时，通知slack频道： 创建一个接受传入 webhook 的 slack 应用。 复制 slack webhook url。 在您的 back4app 控制面板中，将端点设置为该 slack url，以便处理事件“todo 类中的新记录。” 可选地，根据需要添加自定义http头或负载。 您还可以通过在触发器中发出自定义 http 请求来在 cloud code 中定义 webhooks。 step 9 – exploring the back4app admin panel 该 back4app 管理应用 是一个基于网络的管理界面，旨在让非技术用户执行 crud 操作并处理日常数据任务，而无需编写任何代码。它提供了一个以模型为中心的用户友好界面，简化了数据库管理、自定义数据管理和企业级操作。 enabling the admin app 启用 通过访问 应用仪表板 > 更多 > 管理应用 并点击“启用管理应用”按钮 创建第一个管理员用户 (用户名/密码)，这将自动在您应用的架构中生成一个新角色 (b4aadminuser) 和类 (b4asetting, b4amenuitem, 和 b4acustomfield)。 选择一个子域名 以访问管理界面并完成设置。 登录 使用您创建的管理员凭据访问您的新管理员应用程序仪表板。 一旦启用，back4app 管理应用程序使您可以轻松查看、编辑或删除数据库中的记录 无需直接使用 parse dashboard 或后端代码。 conclusion 通过遵循这个关于如何使用 back4app 为 htmx 构建后端的全面教程，您已经： 为htmx网络应用程序创建了一个安全的后端。 配置了具有类模式、数据类型和关系的数据库。 集成实时查询，并考虑了实时查询如何增强客户端的用户体验。 应用安全措施，使用acl和clp来保护和管理数据访问。 实现了云代码功能，以在服务器端运行自定义业务逻辑。 设置用户身份验证、文件存储、计划的云作业和集成的 webhook。 探索了 back4app 管理面板以实现高效的数据管理。 借助这个强大的后端，您现在可以利用htmx的功能来创建动态的现代web应用程序，这些应用程序结合了客户端增强和强大的服务器端框架。这种全栈方法增强了整体用户体验，提供了流畅的html页面更新、高效的服务器端渲染以及跨技术栈的无缝集成。 next steps 扩展这个后端 以纳入更复杂的数据模型、高级模板引擎和自定义服务器端逻辑。 探索与服务器端框架的集成 以创建更动态和响应迅速的客户端体验。 查看back4app的官方文档 以深入了解高级安全性、性能调优和分析。 继续学习htmx和现代网页开发 以构建用户友好、响应式的网页应用，结合客户端和服务器端技术的最佳之处。 一旦项目创建完成，您将在您的 back4app 控制面板中看到它列出。这个项目将是本教程中讨论的所有后端配置的基础。 通过 rest api 连接 back4app 依赖 parse 平台来管理您的数据，提供实时功能，处理用户身份验证等。 虽然 htmx 本身是一个客户端库，但将您的 htmx 前端连接到 back4app 涉及直接从您的 html 和 javascript 中进行 rest api 调用。 检索您的 parse 密钥 在您的 back4app 仪表板中，导航到您应用的“应用设置”或“安全性与密钥”部分以找到您的 应用程序 id , rest api 密钥 , 和 parse 服务器 url （通常格式为 https //parseapi back4app com )。 有了这些密钥，您可以使用 htmx 调用您的后端端点并相应地操作您的 html 模板。例如，您可以使用 javascript fetch 请求结合 htmx 属性通过 rest 调用与您的数据进行交互。 步骤 2 – 设置数据库 保存和查询数据 设置好您的 back4app 项目后，您现在可以开始使用 rest api 调用保存和检索数据，这些调用可以通过 htmx 请求或普通 javascript 触发。创建记录的最简单方法是向 parse 服务器发出 post 请求： curl x post \\ h "x parse application id your application id" \\ h "x parse rest api key your rest api key" \\ h "content type application/json" \\ d '{"title" "buy groceries", "iscompleted" false}' \\ https //parseapi back4app com/classes/todo 同样，您可以查询数据： curl x get \\ h "x parse application id your application id" \\ h "x parse rest api key your rest api key" \\ https //parseapi back4app com/classes/todo 您还可以根据需要使用 graphql 查询从客户端与数据库进行交互。 架构设计和数据类型 默认情况下，parse 允许 动态创建架构 , 但您也可以在 back4app 仪表板中定义您的类和数据类型以获得更多控制。 在您的 back4app 仪表板中导航到“数据库”部分。 创建一个新类 （例如，“todo”）并添加相关列，例如标题（字符串）和是否完成（布尔值）。 back4app 支持多种数据类型，例如 string , number , boolean , object , date , file , pointer, array, relation , geopoint , 和 polygon 使用这些来为您的 htmx 驱动的应用程序设计一个强大的架构。 back4app 提供一个 ai 代理，可以帮助您设计数据模型： 从您的应用仪表板或菜单中打开 ai 代理 用简单的语言描述您的数据模型 （例如，“请在 back4app 上创建一个新的待办事项应用，包含完整的类架构。”）。 让 ai 代理为您创建架构 。 使用 ai 代理可以在设置数据架构时节省时间，并确保应用程序的一致性。 关系数据 如果您有关系数据，例如将任务链接到类别，您可以通过 rest api 调用在 parse 中使用 pointers 或 relations 。例如，添加一个指针： // example linking a task to a category using rest api async function createtaskforcategory(categoryid, title) { const response = await fetch('https //parseapi back4app com/classes/todo', { method 'post', headers { 'x parse application id' 'your application id', 'x parse rest api key' 'your rest api key', 'content type' 'application/json' }, body json stringify({ title title, category { type "pointer", classname "category", objectid categoryid } }) }); return response json(); } 查询时，根据需要包含指针数据： // example querying with pointer inclusion async function fetchtodos() { const response = await fetch('https //parseapi back4app com/classes/todo?include=category', { headers { 'x parse application id' 'your application id', 'x parse rest api key' 'your rest api key' } }); return response json(); } 实时查询 为了实时更新，back4app 提供了 实时查询 。虽然 htmx 专注于服务器端渲染和 html 属性，但集成实时更新可以显著提升用户体验。 在您的 back4app 仪表板中启用 实时查询 ，在您应用的 服务器设置 下。确保“实时查询”已开启。 使用 javascript 初始化实时查询订阅 ，如有必要，结合 htmx 触发器： （注意：实时查询通常需要 parse sdk；然而，当数据更改时，它们仍然可以与 htmx 一起工作，通过更新页面的部分内容。这个示例演示了这个概念。） import parse from ' /parseconfig'; // this assumes use of the parse sdk in js environment async function subscribetotodos(callback) { const query = new parse query('todo'); const subscription = await query subscribe(); subscription on('create', (newtodo) => { console log('new todo created ', newtodo); callback('create', newtodo); }); subscription on('update', (updatedtodo) => { console log('todo updated ', updatedtodo); callback('update', updatedtodo); }); subscription on('delete', (deletedtodo) => { console log('todo deleted ', deletedtodo); callback('delete', deletedtodo); }); return subscription; } 此订阅可以触发htmx请求或动态更新html模板，以反映客户端的变化。 步骤3 – 应用acl和clp进行安全性 back4app安全机制 back4app非常重视安全性，提供了 访问控制列表 (acls) 和 类级权限 (clps) 这些功能允许您限制谁可以按对象或类读取或写入数据，确保只有授权用户可以修改您的数据。 访问控制列表 (acls) 一个 acl 应用于单个对象，以确定哪些用户、角色或公众可以执行读/写操作。例如 async function createprivatetodo(title, owneruser) { const response = await fetch('https //parseapi back4app com/classes/todo', { method 'post', headers { 'x parse application id' 'your application id', 'x parse rest api key' 'your rest api key', 'content type' 'application/json' }, body json stringify({ title title, acl { \[owneruser id] { "read" true, "write" true }, " " { "read" false, "write" false } } }) }); return response json(); } 当您保存对象时，它具有一个 acl，防止除指定用户之外的任何人读取或修改它。 类级权限 (clps) clps 管理整个类的默认权限，例如该类是否可以公开读取或写入，或者是否只有某些角色可以访问它。 转到您的 back4app 控制面板 , 选择您的应用程序，然后打开 数据库 部分。 选择一个类 （例如，“待办事项”）。 打开类级权限 标签。 配置您的默认设置，例如“需要身份验证”以进行读取或写入，或“无访问权限”以供公众使用。 这些权限设置了基线，而 acl 则微调单个对象的权限。一个强大的安全模型通常结合了 clps（广泛限制）和 acl（细粒度每对象限制）。有关更多信息，请访问 应用安全指南 https //www back4app com/docs/security/parse security 。 步骤 4 – 编写和部署云函数 云代码是 parse server 环境的一个功能，允许您在服务器端运行自定义 javascript 代码。 通过编写云代码，您可以通过额外的业务逻辑、验证、触发器和在parse server上安全高效运行的集成来扩展您的back4app后端。 工作原理 当您编写云代码时，通常会将您的javascript函数、触发器和任何所需的npm模块放在一个 main js 文件中。然后将此文件部署到您的back4app项目中，该项目在parse server环境中执行。 // main js const axios = require('axios'); parse cloud define('fetchexternaldata', async (request) => { const url = request params url; if (!url) { throw new error('url parameter is required'); } const response = await axios get(url); return response data; }); parse cloud beforesave('todo', (request) => { const todo = request object; if (!todo get('title')) { throw new error('todo must have a title'); } }); 使用back4app cli或通过仪表板部署您的云代码。 调用您的函数 通过增强的htmx界面，您可以使用javascript fetch调用您的云代码函数，并相应地更新您的html页面的部分。例如： async function gettextlength(text) { const response = await fetch('https //parseapi back4app com/functions/calculatetextlength', { method 'post', headers { 'x parse application id' 'your app id', 'x parse rest api key' 'your rest api key', 'content type' 'application/json' }, body json stringify({ text }) }); const result = await response json(); console log('text length ', result result length); } 您可以在htmx触发器和html属性中集成类似的调用，以在客户端创建动态、响应式的行为，从而改善整体用户体验。 步骤5 – 配置用户身份验证 back4app中的用户身份验证 back4app利用 parse user 类作为身份验证的基础。默认情况下，parse处理密码哈希、会话令牌和安全存储。 在htmx应用程序的上下文中，用户身份验证可以通过html表单提交或javascript fetch请求发起的rest调用进行管理。 设置用户身份验证 例如，要创建一个新用户： async function signupuser(username, password, email) { const response = await fetch('https //parseapi back4app com/users', { method 'post', headers { 'x parse application id' 'your app id', 'x parse rest api key' 'your rest api key', 'content type' 'application/json' }, body json stringify({ username, password, email }) }); return response json(); } 同样，对于用户登录： async function loginuser(username, password) { const response = await fetch(`https //parseapi back4app com/login?username=${encodeuricomponent(username)}\&password=${encodeuricomponent(password)}`, { headers { 'x parse application id' 'your app id', 'x parse rest api key' 'your rest api key' } }); return response json(); } 会话管理 成功登录后，parse 会创建一个会话令牌，您可以在 htmx 应用程序中存储和管理该令牌，以便后续的身份验证请求。 社交登录集成 虽然 htmx 侧重于 html 属性和服务器端交互，但通过启动 oauth 流程并在服务器端处理回调，仍然可以实现 google 或 facebook 等社交登录。有关详细指导，请参阅 社交登录文档 https //www back4app com/docs/platform/sign in with apple 。 电子邮件验证和密码重置 启用电子邮件验证和密码重置： 在您的 back4app 控制面板中 导航到电子邮件设置。 启用电子邮件验证 并配置必要的模板。 在您的 htmx 流程中使用 fetch 来根据需要触发密码重置请求。 步骤 6 – 处理文件存储 上传和检索文件 parse 包含文件存储功能，您可以通过 rest api 调用从您的 htmx 应用程序中利用它。例如，上传图像： async function uploadimage(file) { const data = new formdata(); data append('file', file); data append('object', '{" type" "file","name" "' + file name + '"}'); const response = await fetch('https //parseapi back4app com/files/' + file name, { method 'post', headers { 'x parse application id' 'your app id', 'x parse rest api key' 'your rest api key' }, body data }); return response json(); } 文件安全性 通过在 back4app 中配置安全设置并根据需要在文件对象上设置 acl，控制谁可以上传和访问文件。 步骤 7 – 使用云作业调度任务 云作业 back4app 中的云作业让您可以在后端调度例行任务，例如清理旧数据或发送定期电子邮件。 这些作业在服务器端运行，并可以在需要时与您的 htmx 工作流集成。 // main js parse cloud job('cleanupoldtodos', async (request) => { const todo = parse object extend('todo'); const query = new parse query(todo); const now = new date(); const thirty days = 30 24 60 60 1000; const cutoff = new date(now thirty days); query lessthan('createdat', cutoff); try { const oldtodos = await query find({ usemasterkey true }); await parse object destroyall(oldtodos, { usemasterkey true }); return `deleted ${oldtodos length} old todos `; } catch (err) { throw new error('error during cleanup ' + err message); } }); 通过 back4app 仪表板在 应用设置 > 服务器设置 > 背景作业 中调度此作业。 步骤 8 – 集成 webhooks webhooks 允许您的 back4app 应用在特定事件发生时向外部服务发送 http 请求。这对于与第三方系统（如支付网关、电子邮件营销工具或分析平台）集成非常强大。 导航到 webhooks 配置 在您的 back4app 仪表板 > 更多 > webhooks，然后点击添加 webhook。 设置一个端点 （例如， https //your external service com/webhook endpoint https //your external service com/webhook endpoint ）。 配置触发器 以指定您的 back4app 类或云代码函数中哪些事件将触发 webhook。 例如，当创建新的 todo 时通知 slack 频道： 创建一个接受传入 webhook 的 slack 应用。 复制 slack webhook url。 在您的 back4app 仪表板中，将端点设置为该 slack url，用于事件“todo 类中的新记录。” 可选地，根据需要添加自定义 http 头或有效负载。 您还可以通过在触发器中发出自定义 http 请求来在云代码中定义 webhooks。 第 9 步 – 探索 back4app 管理面板 该 back4app 管理应用 是一个基于网络的管理界面，旨在让非技术用户执行 crud 操作并处理常规数据任务，而无需编写任何代码。 它提供了一个以模型为中心、用户友好的界面，简化了数据库管理、自定义数据管理和企业级操作。 启用管理员应用 启用 它通过访问 应用仪表板 > 更多 > 管理员应用 并点击“启用管理员应用”按钮。 创建第一个管理员用户 （用户名/密码），这将自动在您应用的架构中生成一个新角色（b4aadminuser）和类（b4asetting、b4amenuitem 和 b4acustomfield）。 选择一个子域名 以访问管理员界面并完成设置。 登录 使用您创建的管理员凭据访问您的新管理员应用仪表板。 一旦启用，back4app 管理员应用使您能够轻松查看、编辑或删除数据库中的记录 无需直接使用 parse 仪表板或后端代码。 结论 通过遵循这个关于如何使用 back4app 为 htmx 构建后端的全面教程，您已经 创建了一个专为 htmx 网络应用程序量身定制的安全后端。 配置了具有类模式、数据类型和关系的数据库。 集成了实时查询，并考虑了实时查询如何增强客户端的用户体验。 应用了使用 acl 和 clp 的安全措施来保护和管理数据访问。 实现了云代码功能，以在服务器端运行自定义业务逻辑。 设置了用户身份验证、文件存储、计划的云作业，并集成了 webhooks。 探索了 back4app 管理面板以实现高效的数据管理。 有了这个强大的后端，您现在可以利用 htmx 的能力创建动态、现代的网络应用程序，将客户端增强与强大的服务器端框架结合起来。 这种全栈方法增强了整体用户体验，提供了流畅的 html 页面更新、高效的服务器端渲染，以及跨技术栈的无缝集成。 下一步 扩展这个后端 以纳入更复杂的数据模型、高级模板引擎和自定义服务器端逻辑。 探索与服务器端框架的集成 以创建更动态和响应的客户端体验。 查看 back4app 的官方文档 以深入了解高级安全性、性能调优和分析。 继续学习 htmx 和现代网络开发 以构建用户友好、响应迅速的网络应用程序，结合客户端和服务器端技术的最佳之处。