MongoDB Stitch

17 Mar 2025 | 6 分钟阅读

MongoDB 提供了一个无服务器平台，无需设置服务器基础设施即可快速构建应用程序。 MongoDB Stitch 被设计为 MongoDB Atlas 的升级版。它会自动集成与我们数据库的连接。 Stitch 消除了开发和实施过程，它忽略了构建和部署后端的需求。 MongoDB stitch 作为后端服务提供，允许我们轻松配置数据身份验证、数据访问规则和服务。

MongoDB stitch 提供了一个可升级的基础设施设计来处理请求。它还协调服务和数据库交互。例如，我们不需要在配置服务器等任务上花费时间和资源。

例如，我们可以使用 MongoDB Stitch 生成一个管道，该管道允许我们通过 HTTP 服务使用 Stripe 接受付款，更新购买日期，并通过 Mailgun 服务发送确认电子邮件。

使用 Stitch UI 创建 Stitch 应用程序

步骤 1： 转到 https://mongodb.ac.cn/cloud/atlas 页面，然后登录到您的 Atlas 帐户。

步骤 2： 现在，您必须创建一个集群以与您的 MongoDB Stitch 应用程序一起使用，请按照以下步骤操作

单击左侧导航窗口中的集群按钮，然后单击构建新集群按钮。
选择您首选的服务提供商、区域、层和其他所需设置。
集群的名称默认为Cluster0。如果您想更改集群的名称，您必须在此步骤中进行，因为一旦配置，就无法更改集群名称。
最后，单击“创建集群”按钮以保存您所做的更改。

步骤 3： 在 MongoDB Atlas 中，从左侧导航窗口中单击Stitch 应用程序。

步骤 4： 之后，单击创建新应用程序按钮。

步骤 5： 在创建新应用程序弹出窗口中，为您的 Stitch 应用程序输入一个名称。

步骤 6： 从链接到集群下拉对话框中选择项目中的集群。 MongoDB Stitch 自动创建一个链接到您的集群的 MongoDB 服务。

步骤 7： 在Stitch 服务名称字段中填写 Stitch 将创建的服务的名称。

步骤 8： 为您的应用程序选择一个部署模型和部署区域。然后单击创建按钮。

成功部署后将出现以下窗口。

使用 Stitch CLI 创建 Stitch 应用程序

步骤 1： 首先，为您的应用程序创建一个新目录，并在该目录的根级别添加一个 stitch.json 文件。该文件必须包含一个空的 JSON 对象。

步骤 2： 使用 API 密钥对 MongoDB Stitch 应用程序进行 Atlas 身份验证。

步骤 3： 现在，使用“stitch-cli import”命令导入 Stitch CLI 库。

步骤 4： 您应该验证您的应用程序是否已创建。

使用 Stitch 随处查询

使用 MongoDB 查询语言，我们可以直接从客户端应用程序代码查询存储在 MongoDB 中的数据。 MongoDB 集合的 Stitch 服务器允许我们使用指定的数据访问规则根据登录用户或每个文档的内容安全地过滤结果。

Student 集合包含描述示例拼贴中每个学生的文档。每个文档都包含学生的姓名、电子邮件、地址、费用和关于学生流的信息。在下面给出的示例中，我们比较了所有文档的学生的集合，并将格式化的结果作为表格返回。

HTML 文件

<!-- Base Stitch Browser SDK --> <script src="https://s3.amazonaws.com/stitch                      sdks/js/bundles/4.0.13/stitch.js"></script>

<div class="results-bar">
  <p>Count of Results:</p>
  <span id="num-results" class="results-bar__count"></span>
</div>
<table class="table table-striped">
  <thead class="thead">
    <tr>
      <th>Name</th>
      <th>Email</th>
      <th>Class</th>
      <th>Batch</th>
      <th>Fees</th>
    </tr>
  </thead>
  <tbody id='students'></tbody>
</table>

Java 脚本文件

const {
  Stitch,
  RemoteMongoClient,
  UserPasswordCredential
} = stitch;

const stitchClient = Stitch.initializeDefaultAppClient("stitch-quickstarts-zhpox");

login("javatpoint@example.com", "password123").then(() => {
  // Initialize a MongoDB Service Client
  const mongodb = stitchClient.getServiceClient( RemoteMongoClient.factory,
    "mongodb-atlas");
  // Get a hook to the student collection
  const students = mongodb.db("Admin").collection("students");
  
  return students.find({}, {
    // limit: 2,
    // sort: { "fees": -1 }
  })
    .asArray();
})
  .then(displayStudents)

function login(email, password) {
  const credential = new UserPasswordCredential(email, password);
  return stitchClient.auth.loginWithCredential(credential);
}


// Renders the the students' information in the table
function displayStudents(students) {
  const employeesTableBody = document.getElementById("students");
  const numResultsEl = document.getElementById("num-results");
  const tableRows = students.map(student => {
    return '
      <tr>
        <td>${student.name.last}, ${student.name.first}</td>
        <td>${student.email}</td>
        <td>${student.role}</td>
        <td>${student.manager.name.first}${student.manager.name.last} (${student.admin.id || "no manager"})</td>
        <td>${student.fees}</td>
      </tr>
    ';
  });
  studentTableBody.innerHTML = tableRows.join("");
  numResultsEl.innerHTML = student.length;
}

使用规则保护数据

如果我们不想允许每个学生查看其他每个学生的数据，我们可以使用集合规则。我们可以使用它来控制所有用户可以访问的数据，而无需更改查询的模式。

创建一个博客应用程序

在这里，我们使用 Stitch 创建一个博客和评论系统。我们使用 MongoDB Stitch JavaScript SDK 和 MongoDB 服务直接从客户端代码添加和查询评论。

博客应用程序的架构

博客应用程序架构需要以下功能

登录能力。
博客文章存储能力。
博客帖子评论能力。

当我们使用 MongoDB Atlas Cluster 时，我们可以存储评论和身份验证详细信息，这些信息允许用户使用临时帐户发布评论。

博客架构的三个主要组成部分是

一个 Web 前端，
Stitch 应用程序，
MongoDB Atlas 数据库。

博客应用程序架构的前端处理显示和用户交互。 Stitch 管理来自前端的所有请求，并且只允许经过验证的数据库请求，这为我们的用户保存了评论。

为博客应用程序创建后端

博客应用程序的后端用于存储评论和其他详细信息，例如 - 验证和授权用户、查找博客帖子的现有评论等。我们将评论存储在 MongoDB 应用程序的示例中。在这里，我们将限制用户的权限，使其只能通过授权创建、编辑和删除与其用户 ID 关联的评论。我们还需要确保用户无法以其他用户的身份登录；我们可以通过在 MongoDB Stitch 中使用内置的用户管理系统来实现这一点。

要求

MongoDB Atlas 帐户。
以及托管在 Atlas 上的 MongoDB 集群。我们建议您创建一个 M0 Atlas 集群，该集群是免费的，非常适合学习目的。

步骤 1： 按照上面的指示创建一个 Stitch 应用程序。

步骤 2： 在您创建的 Stitch 应用程序中打开匿名身份验证。

步骤 3： 最后，配置blog.comments MongoDB 集合

从 Stitch UI 的左侧导航中单击 MongoDB Atlas 下的规则。
然后，单击“添加集合”。
现在，输入“博客”作为数据库名称，并输入“评论”作为集合名称。
选择“无模板”选项，然后单击“添加集合”。

步骤 4： 启用对评论的读写。

步骤 5： 最后，通过单击 Stitch GUI 顶部的弹出窗口中的审阅并部署更改来发布您的应用程序。

为博客应用程序创建 Web 客户端

步骤 1： 如下创建 HTML 页面。

<html>
  <head>
  </head>
  <body>
    <h3>This is the first blog post of JavaTpoint</h3>
    <div id="content">
      Learn technology from javaTpoint to keep yourself industry ready.
    </div>
    <hr>
    <div id="comments"></div>
  </body>
</html>

步骤 2： 现在，附加以下 JavaScript SDK。要附加 MongoDB Stitch SDK。将下面给出的脚本标签添加到 html 文件的 head 部分。

<script src="https://s3.amazonaws.com/stitch-sdks/js/bundles/4/stitch.js"></script>

步骤 3： 初始化应用程序客户端和一个 MongoDB 服务客户端以将评论存储在 MongoDB 中。将应用程序 ID 替换为您的 Stitch <app-id>。您可以在 Stitch 界面（客户端页面）上找到您的 App ID。

<script>
  // it initializing the App Client
  const client = stitch.Stitch.initializeDefaultAppClient("<give-your-app-id-here>");
  // Now, it will get a MongoDB Service Client
  const mongodb = client.getServiceClient(
    stitch.RemoteMongoClient.factory,
    "mongodb-atlas"
  );
  // Getting a reference to the blog database
  const db = mongodb.db("blog");
</script>

步骤 4： 现在，添加下面给出的脚本以在页面加载时查询和显示评论。

function displayComments() {
  db.collection("comments")
    .find({}, {limit: 1000})
    .toArray()
    .then(docs => {
      const html = docs.map(doc => '<div>${doc.comment}</div>');
      document.getElementById("comments").innerHTML = html;
    });
}

步骤 5： 您必须创建一个文件，该文件允许用户登录并在加载期间显示评论。

function displayCommentsOnLoad() {
  client.auth

    .loginWithCredential(new stitch.AnonymousCredential())

    .then(displayComments)
    .catch(console.error);
}

步骤 6： 现在，创建一个表单以提交评论。

function addComment() {
  const newComment = document.getElementById("new_comment");
  console.log("add comment", client.auth.user.id)
  db.collection("firstcomment")
    .insertOne({ owner_id : client.auth.user.id, comment: newComment.value })
    .then(displayComments);
  newComment.value = "";
}

下一主题MongoDB Atlas

← 上一个下一个 →