如何使用 VS Code 构建后端？

vs code 允许您通过 mcp 协议将具有活动 mcp 服务器的外部工具集成到其中。这使您能够在不离开 ide 的情况下使用提示执行任务并从这些来源读取数据。 在本教程中，您将学习如何使用 back4app mcp 服务器 构建博客平台的后端和用户界面 (ui)，并将其部署在 back4app 容器上。 关键要点 学习如何使用 vs code 和 mcp 服务器在 back4app 上构建后端。 探索 back4app 中类之间的关系是如何建模的。 探索 back4app 如何使用其内置类实现身份验证和基于角色的授权。 使用 back4app 容器轻松部署您的应用。 您可以使用 此链接 查看本教程中构建的实时博客。 先决条件 要跟随本教程，您需要具备以下条件： 一个 back4app 账户。如果您没有，可以 免费注册 。 在您的系统上安装 vs code。 对后端开发概念有基本的了解。 项目概述：一个博客 在本教程中，您将构建一个简单的博客，允许您创建、编辑、查看和删除博客文章。 它还支持评论，并跟踪查看您博客文章的人数。 除了 back4app 默认提供的 用户 表用于身份验证外，您的博客将有三个额外的表：文章、评论和查看。 当您的博客上的用户创建帐户时，back4app 会在 用户 表中创建一条新记录，并发出一个安全的会话令牌，您可以在后续请求中重复使用。只有经过身份验证的用户才能发布文章。 当博客文章发布时，经过身份验证和未经过身份验证的用户都可以阅读文章；然而，只有经过身份验证的用户可以评论。 每次从 back4app 数据库中获取博客文章时，查看计数都会增加；为了防止可能滥用此功能来增加查看次数，您将实施一些保护措施。 现在您对将要构建的内容有了大致的了解，在下一部分中，您将把 vscode 连接到 back4app mcp 服务器。 将 vscode 连接到 back4app mcp 服务器 导航到 back4app 网站并点击页面左上角的 新应用 按钮。在“构建后端”屏幕上，为您的应用命名并点击 创建 按钮。 在您的应用概览页面，点击 mcp 设置 按钮。在“选择您的 ide”模态框中，点击 vs code 并按照屏幕上显示的说明自动将 vscode 连接到 back4app mcp 服务器。 如果您选择了自动安装选项，则必须在继续之前重新启动您计算机上的 vs code。 或者，您可以通过将模态框切换到手动部分手动连接 back4app mcp 服务器（这将使您对配置有更多控制）。 在按照模态框中概述的步骤将 back4app mcp 服务器连接到 vscode 后，您可以通过点击 vscode 窗口中的搜索栏并搜索 “>mcp 列出服务器” 来确认连接，执行该命令，您应该会看到可用的 mcp 服务器及其当前状态（运行/停止）的列表。 现在您已经将 back4app mcp 服务器连接到 vscode，在下一部分中，您将编写构建整个应用程序的提示。 构建您的博客后端 要使用 vscode 和 github copilot 创建后端，首先需要在 github copilot 上激活代理模式。要激活代理模式，请通过按 “ control + command + i” 在 macos 上打开 github copilot 聊天，对于 windows，请按 “ctrl + i”。 在聊天页面上，单击带有“询问”标签的下拉菜单并选择“代理”模式。 接下来，给 github copilot 提供以下提示或类似的提示，以创建您应用程序所需的类。 创建一个名为“blogger”的后端，首先添加一个 post 类， 包含以下字段：title 和 body 作为必需字符串，一个 唯一的 slug，一个可选的 heroimage 文件存储在 back4app 的存储桶中， 一个指向内置 user 类的作者指针，评论计数和 查看计数的计数器（均从 0 开始），一个状态 字符串限制为草稿或已发布，以及一个在草稿首次发布时自动设置的 publishedat 日期。接下来，创建一个 comment 类，存储内容字符串、作者指针和帖子指针。 添加一个 view 类，记录每次页面查看，带有可选用户和必需的帖子指针。 上述提示创建了一个新的 back4app 后端，名为“blogger”，并填充了一个 post、一个 comment 和一个 view 类及其所需属性。 当您使用 copilot 执行此提示时，它将在您的聊天窗口中记录它遵循的步骤，并在每个更改您数据的步骤上询问您的许可。 为了获得最佳效果，请使用像 03 mini 或 claude sonnet 4 这样的高级模型执行这些提示。 在copilot创建所需的类之后，您现在有了一种结构化的方式来存储博客的数据。在下一部分中，您将为您的应用程序实现身份验证。 实现身份验证 您的应用程序的身份验证要求很简单，您需要用户注册和登录，以便创建博客文章和对博客文章进行评论。然而，他们可以在未经过身份验证的情况下阅读您应用程序中的博客文章。 您可以使用下面的提示为您的应用程序实现身份验证要求： 通过扩展内置的用户类为blogger添加用户身份验证。 每个帐户必须提供一个`用户名`、一个至少八个字符长的`密码`和一个`电子邮件`地址。 在每次保存之前，cloud code将电子邮件转换为小写， 然后检查没有其他帐户已经使用它；如果该地址已被占用，则保存被拒绝。 同样的触发器也强制执行密码长度规则。 向前端公开四个cloud functions： \ signup：接受用户名、电子邮件和密码。它创建用户，返回新记录，并包括会话令牌，以便调用者立即通过身份验证。 \ login：接受用户名或电子邮件加密码，并在成功时返回用户对象和令牌。 \ logout：使当前会话令牌失效。 上面的提示为您的应用程序添加了用户身份验证。身份验证逻辑允许您的用户使用电子邮件、用户名和密码创建帐户。注册后，用户会自动登录，当用户注销时，他们的当前会话将失效。 在copilot实现您的身份验证逻辑后，您的用户将拥有安全的注册和登录方式。在下一部分中，您将实现创建帖子和评论所需的逻辑。 创建帖子和评论 要实现创建帖子和评论的功能，您必须创建两个cloud functions和支持的钩子，以便经过身份验证的用户可以在一个流畅的流程中发布帖子和添加评论。 首先通过向copilot提供下面的提示或类似内容来创建支持的钩子。 通过添加一个 post beforesave 钩子来扩展blogger应用程序，该钩子将每个新帖子的标题转换为url友好的slug （小写，空格替换为破折号，符号被移除）， 然后检查post类以确保slug是唯一的。 当帖子被创建时，钩子还将`status`设置为`"published"`并在`publishedat`中记录当前日期。 附加一个 comment aftersave 钩子，该钩子在评论存储后立即增加父帖子的`commentcount`，以便总数保持准确，而无需额外查询。 上面的提示实现了在创建帖子或评论之前进行的检查/操作。 对于帖子，使用其标题生成唯一的别名，然后状态更改为已发布，当前日期被设置为发布日期。对于评论，链接的帖子简单地更新其评论计数。 现在，使用下面的提示或类似的内容创建与上述beforesave钩子相关的云函数。 为前端暴露两个云函数。第一个，createpost，接受 `title`、`body` 和一个可选的 `heroimage`，要求调用者登录，将调用者分配为 `author`，如果提供了图像，则附加图像，保存帖子，并返回保存的对象。 第二个， addcomment ，需要身份验证，接受 `postid` 和 `content`，确认帖子存在，创建一个与帖子和调用者都关联的评论，保存它，并返回新的评论。 为了防止滥用，限制每个经过身份验证的用户每分钟调用 createpost 五次和 addcomment 十五次。 上面的提示暴露了两个云代码函数，允许用户创建帖子和评论。 它还通过限制每分钟创建5个帖子和15个评论来保护您的应用免受滥用。 与创建帖子和评论相关的主要逻辑已经在之前提示中创建的beforesave钩子中实现；这只是为前端提供一个api供其使用。 在copilot实现上述逻辑后，您的用户将有办法创建和评论帖子。 在下一部分中，您将实现更新这些评论和帖子的逻辑，以及计算每个博客帖子的浏览量所需的逻辑。 更新帖子、评论和浏览量 要实现允许用户编辑其帖子、修改自己的评论和注册页面浏览量的功能，您需要两个云函数：updatepost、updatecomment，以及一个aftertrigger。 您可以使用下面的提示或类似的内容实现updatepost云函数： 实现一个云函数， updatepost， 要求调用者登录并验证帖子的作者与request user匹配。接受帖子的objectid以及任何新的标题、正文或替换的heroimage。忽略或拒绝任何尝试提供状态字段的请求；一旦帖子发布，其状态不能通过此途径更改。在加载帖子并确认所有权后，应用允许的更新并保存。如果标题更改，依赖现有的post beforesave钩子重建唯一的别名。将更新后的帖子返回给调用者。 上面的提示创建了一个更新帖子的函数。它确保只有创建帖子的用户才能进行更新，并在标题更改时重新生成别名。 您可以使用下面的提示或类似的方法实现 updatecomment 云函数。 实现一个云函数， updatecomment， 该函数需要身份验证，接受评论的 objectid 和修订后的内容，然后获取评论并确认调用者是其作者。应用新内容并保存；comment aftersave 钩子会自动保持 commentcount 不变，因为评论已经存在。返回编辑后的评论。 上面的提示创建了一个更新帖子评论的函数。更新只能由评论的创建者完成。 您可以使用下面的提示或类似的方法实现 recordview 云函数。 在 post 类上添加一个 afterfind 触发器，以便每次后端通过 `objectid` 返回单个帖子时，它会自动记录页面浏览量。如果查询是返回多个帖子的 feed 或搜索，则触发器将退出而不执行任何操作。在触发器内部，从 `request results\[0]` 获取帖子，创建一个新的 view 对象，将其 `post` 指针设置为该帖子，并在可用时将 `viewer` 指针设置为 `request user`，保存视图，调用 `post increment("viewcount")`，保存帖子，并返回 `request results` 以完成原始查询。 上面的提示在 post 类上创建了一个 afterfind 触发器。每当后端返回单个帖子（通过其 objectid 获取）时，触发器会自动创建一个指向该帖子的新的 view 记录（如果已登录，则指向当前用户），并增加帖子的 viewcount。如果查询返回多个帖子，触发器则不执行任何操作。 通过这些，大部分博客的功能已经完成。接下来，您将实现允许用户删除其帖子的功能。 删除帖子 要删除帖子，用户必须是创建该帖子的用户。一旦帖子被删除，所有相关内容（视图、评论）也会随之删除。 您可以使用下面的提示或类似的方法实现删除帖子的功能。 创建一个 deletepost 云函数，以便作者可以删除自己的作品。调用者必须登录并传递帖子的 objectid。首先获取帖子并确认其作者等于 request user；如果不相等，则拒绝请求。在验证所有权后，删除帖子记录，然后删除所有相关的评论和视图，其 post 指针与已删除的帖子匹配。最后，返回一条简短的成功消息以及删除的记录数量。 上面的提示实现了删除帖子的所需逻辑。 通过这些补充，您的后端现在涵盖了完整的内容生命周期，让作者可以发布、修订和删除，让读者可以讨论，并为每个帖子保持准确的浏览统计。在下一部分中，您将为您的应用程序生成一个用户界面。 生成您的前端 您可以利用 copilot 在 back4app 上创建后端时获得的上下文，要求它创建一个与您的应用程序的架构和要求相匹配的前端。 您可以使用下面的提示为预约调度程序实现这一点： 生成一个最小的前端，匹配我的 back4app 账户上的博客应用程序的架构，并使用 javascript parse sdk 将前端连接到后端。 使用上述提示或类似的提示，copilot 将生成一个与您的后端架构相匹配的前端，并将其连接到您的后端。 按照 copilot 提供的说明运行应用程序，并进行您想要的任何调整。现在您的项目已完成，在下一部分中，您将其部署在 back4app 容器上。 在 back4app 容器上部署您的应用程序 back4app 容器允许您使用 dockerfile 和 github 存储库轻松部署应用程序。 要在 back4app 容器上部署您的应用程序，您需要首先在您的存储库中包含一个 dockerfile。您可以要求 claude 使用下面的提示生成一个： 为我的博客应用程序的 ui 生成一个 docker 文件。 或者您可以使用下面提供的 dockerfile： \# 从官方轻量级 nginx alpine 镜像开始 from nginx\ alpine \# 删除默认内容 run rm rf /usr/share/nginx/html/ \# 将您的静态站点（html、css、资产）复制到容器中 copy /usr/share/nginx/html/ \# 暴露 80 端口 expose 80 \# 在前台启动 nginx cmd \["nginx", " g", "daemon off;"] 在添加 dockerfile 并将其推送到 github 后，导航到您的 back4app 应用程序仪表板，点击 仪表板 下拉菜单，选择 web 部署平台 选项。 在部署页面，点击“部署一个web应用程序”按钮，并给予back4app访问您想要部署的存储库的权限。 选择您希望部署的应用程序，填写部署详细信息，然后点击 部署 按钮。 点击按钮开始部署过程，完成后，您将获得应用程序的实时url。 您可以通过 此链接 查看本教程中构建的实时博客。 结论 在本文中，您使用back4app mcp服务器和github copilot构建了一个完整的博客平台，然后通过back4app containers进行了部署。 这展示了back4app的完整工具套件，让您能够以最小的开销从构思到发布。 作为下一步，您可以通过社交媒体集成、新评论的自动电子邮件通知、高级搜索功能或对帖子参与度和读者行为的分析等功能来扩展该项目。 所有这些增强功能自然融入同一back4app工作流程：使用github copilot设计和定义新类或云函数，使用beforesave钩子进行安全保护，并通过back4app containers推出更新。这种方法使您能够在不干扰用户的情况下向博客添加新功能。