3. 部署 Apollo Cient
2m

💻 部署客户端应用

我们的服务器目前正在生产中运行，但尚未完成。不要忘记我们的客户端应用；这是正在训练的猫航天员将要使用的东西！

让我们的客户端应用程序在 Railway 上启动并运行的步骤与我们之前对服务器执行的步骤类似。我们将使用方便的“Deploy to Railway”按钮并生成一个域名！

部署到 Railway

要开始，请点击下方按钮 ⬇️

Deploy on Railway

然后，完成 Railway 中的部署设置步骤。

按照与完成服务器部署时相同的步骤操作，一直到生成 URL！

任务！

在我们继续查看 URL 之前，我们需更改客户端代码中的一个属性。(如果你确实去查看，可能会看到 Failed to fetch 的错误。)

👩🏽‍💻 更新客户端代码

这次我们转到我们的 client 回购。若要找到该回购，请前往 设置，向下滚动到 服务，然后找到 源回购 链接。

注意：以下说明假定你熟悉克隆回购、在本地代码编辑器中进行更改以及使用 Git 提交和将这些更改推回到回购。不过，你也可以使用 GitHub Web UI 进行相同更改！请参阅下面的可折叠部分，了解有关使用 GitHub Web UI 的说明。

打开 src 文件夹和 index.js 文件。在此，我们之前已用 这样的属性初始化了我们的 uri 和 cache。

目前，我们的 uri 属性已设置为 https://127.0.0.1:4000。现在我们的服务器处于 Railway 上，我们可以将此值更改为该生产 uri。

从上一课获取你的服务器 Railway 部署 URL 并将其粘贴到 uri 值中。

const client = new ApolloClient({
  uri: "https://odyssey-lift-off-part5-server-production.up.railway.app/", // change this to YOUR server URI
  cache: new InMemoryCache(),
});

这就是我们唯一需要进行的更改。这样一来，让我们保存并提交更改，然后将这些更改推送到 GitHub 上的 main 分支。

任务！

在 Railway 中，我们应该看到新的提交触发了另一次部署。

让部署成功生成，返回到客户端生成 URL（花几分钟更新！）和...

休斯顿，我们起飞了！ 🚀🐱🧑‍🚀

GIF of cat being picked up with space background appearing as if being launched into space
任务！

我们的 Catstronauts 应用程序现在完全在生产中运行，这意味着它可以供全世界查看。非常激动。也许有点可怕。

幸运的是，我们有一些东西可以帮助你更自信地添加新功能、修复错误和扩展你的架构。在Voyage 系列中，你将使用 Apollo GraphOS 将你的 API 变成 ，它是专为规模而设计的联合 API。

感谢你加入我们参加这次支线任务，我们期待下次见到你！

上一个