无头商务已经存在很长时间了，Medusa 是提供模块化组件的最佳工具之一。 Medusa 的可组合架构允许您使用您选择的任何框架或语言构建商店，从而提供完全的定制能力。 Medusa 同样允许您通过提供一组工具和基本构建块来构建独特的电子商务体验，开发人员可以将它们加起来创建一个强大的电子商务网站。它提供开箱即用的功能，例如客户、产品、运输、税收和区域管理以及 RMA Flow。在今天的教程中，您将学习如何添加文件服务插件，以便能够通过 将产品添加到您的 Medusa 商店 管理仪表板 什么是美杜莎 Medusa 是一组开源工具，可让您构建出色且可靠的电子商务网站。 ，这个无头商务解决方案附带了一些从基础到高级的商务模块，并且可以免费使用。其 也有助于其成功，因为有关于如何添加模块或插件的分步指南。一些流行的插件包括支付、通知、搜索和文件服务插件。 在 GitHub 上拥有超过 17.8k 颗星和 1.3k 个分支 精心编写的文档 什么是文件服务插件 文件服务插件允许您托管文件，例如美杜莎中使用的图像。如果您没有正确使用或设置 Medusa 商店的文件服务，您可能会遇到问题。 Medusa 提供三种不同的方式来管理文件存储； S3、  和 。本教程仅关注 S3 文件存储，以存储在 Medusa 中上传的图像和文件。 MinIo 空间  S3 或简单存储服务是一种对象存储，用于随时随地存储和检索任意数量的数据。我们将使用 Amazon S3 进行此演示。 如何将文件上传到您的 Medusa 商店 Amazon 将数据作为对象保存在存储桶中。一个对象由一个文件和描述它的可选数据组成。文件存储需要上传到桶中（桶是对象的容器），上传后可以 。 对对象设置权限 现在让我们让您快速上传 Medusa 项目中的文件。 先决条件 。美杜莎项目基本上分为三个部分；一个店面，一个管理仪表板和一个 一家美杜莎商店 美杜莎后端 AWS 账户 如果您已设置好所有内容，请按照以下步骤将文件服务插件添加到您的 Medusa 商店。 第 1 步：创建 S3 存储桶 登录到您的 AWS 帐户，搜索并 选择 S3 在下一页中，单击 创建存储桶 在打开的窗口中，提供创建存储桶所需的信息。 一般配置 为您的存储桶提供一个名称并保留默认区域或根据您的要求选择另一个区域。 对象所有权 对于所有权，允许存储桶中的对象归您的账户所有。 在阻止公共访问设置中，取消选中 所有公共访问。这样做将显示一条警告消息，如图所示选中消息中的框。 阻止 至于 Bucket 版本控制、标签、默认加密和高级设置，保留默认设置或根据项目要求更改它们，然后单击  。 Create bucket   第 2 步：管理策略 下一步包括管理您创建的存储桶策略。前往您的存储桶页面并打开 然后向下滚动到存储桶策略部分，单击编辑，添加下面的代码并 权限选项卡。 保存。   { "Version": "2012-10-17", "Id": "Policy1397632521960", "Statement": [ { "Sid": "Stmt1397633323327", "Effect": "Allow", "Principal": { "AWS": "*" }, "Action": "s3:GetObject", "Resource": "arn:aws:s3:::<YOUR_BUCKET_NAME>/*" } ] } 将 替换为您的存储桶名称。这是 <YOUR_BUCKET_NAME> medusastorebucket 第 3 步：附加策略 在您的帐户中，导航至 IAM 并在左侧菜单中选择访问管理->策略。 如果这是您第一次选择策略，那么您将看到欢迎使用管理策略页面并选择开始，否则选择 创建策略。 然后选择 JSON 选项卡并添加以下代码：   { "Version": "2012-10-17", "Statement" : [ { "Effect" : "Allow", "Action" : [ "action-statement" ], "Resource" : [ "resource-statement" ] }, { "Effect" : "Allow", "Action" : [ "action-statement" ], "Resource" : [ "resource-statement" ] } ] } 根据您的要求替换 和  ，然后单击 action-statement resource-statement Next:tag 详细了解 政策和权限 标签是可选的，因此您可以跳过此步骤并单击审查按钮来审查您的政策。  接下来，为您的策略提供名称和描述，然后单击 创建策略 现在您已经创建了策略，您需要将其附加到用户组，导航到 并选择  。选择群组名称，然后打开 Amazon 控制台 User Groups “权限”选项卡 选择 ，然后 添加权限 附加策略 在打开的窗口中，选择要附加的策略，然后单击页面底部的添加权限。 第 4 步：获取您的访问密钥 您需要获取访问密钥才能将 S3 插件集成到您的项目中。您将需要两个要素；  和  。 Access Key ID Secret Access Key 要获取您的 AWS 访问密钥 ID 和秘密访问密钥，请前往左侧导航中的 ，然后选择 Amazon 控制台 用户。 选择您的 并打开 IAM 用户名 安全凭证选项卡 向下滚动到访问密钥并单击 创建访问密钥 在下一个窗口中，系统会要求您选择要在何处使用访问密钥。如果您在本地开发环境中工作，请检查 。  本地代码 通过选择本地，将出现一条警告消息，询问您是否理解该建议。选中该框并单击下一步按钮。 最后，如果您想添加标签描述，请添加标签描述，然后单击 “创建访问密钥” 在下一个窗口中，您将看到您的访问和秘密访问密钥。请将其复制并粘贴到您 PC 上的某个位置，因为您将在下一步中使用它或下载 CSV 文件。  第 5 步：安装 S3 插件 现在您已经设置了存储桶并创建了访问密钥，是时候安装 S3 插件了。为此，请前往您的 Medusa 后端文件夹并使用以下命令安装它：   yarn add medusa-file-s3 或者 npm install medusa-file-s3 然后打开你的 文件并添加以下内容 .env S3_URL=<YOUR_BUCKET_URL> S3_BUCKET=<YOUR_BUCKET_NAME> S3_REGION=<YOUR_BUCKET_REGION> S3_ACCESS_KEY_ID=<YOUR_ACCESS_KEY_ID> S3_SECRET_ACCESS_KEY=<YOUR_SECRET_ACCESS_KEY> 在哪里 是您的存储桶的 URL。它的格式为  。其中 是您的存储桶的名称，  是区域。 <YOUR_BUCKET_URL> https://<BUCKET_NAME>.s3.<REGION>.amazonaws.com <BUCKET_NAME> <REGION>   是创建的存储桶的名称 <YOUR_BUCKET_NAME> 您的存储桶区域 <YOUR_BUCKET_REGION> <YOUR_ACCESS_KEY_ID> 是您的访问密钥 是您的密钥 <YOUR_SECRET_ACCESS_KEY> 最后在你的 添加以下代码： medusa-config.js   const plugins = [ // ... { resolve: `medusa-file-s3`, options: { s3_url: process.env.S3_URL, bucket: process.env.S3_BUCKET, region: process.env.S3_REGION, access_key_id: process.env.S3_ACCESS_KEY_ID, secret_access_key: process.env.S3_SECRET_ACCESS_KEY, }, }, ] 请注意，如果您配置了许多存储插件，那么将使用最后声明的插件。因此，如果您希望使用 S3，请确保它是最后添加的存储插件。 第 6 步：测试插件 现在您已经成功添加了您的插件。现在是测试以确保一切都在正确位置的时候了。您可以使用 或 Medusa Admin 进行测试。 REST API 分别导航到您的 admin 和 backend 文件夹并运行以下命令：   // admin yarn run start   // backend yarn run start 默认管理员电子邮件和密码分别为 和  。使用 打开你的管理面板 admin@medusa-test.com supersecret http://localhost:7000/ 在菜单中单击  ，然后单击  。提供产品的详细信息并发布。 Products Add Product 最后，如果您使用的是 ，您需要在店面中添加一个配置，将 S3 存储桶域名添加到配置的图像的域名中。如果您不这样做，您将收到以下错误  。 NextJS 店面 next/image Un-configured Host 所以在你的 添加以下内容： next.config.js   const { withStoreConfig } = require("./store-config")   // ...module.exports = withStoreConfig({ // ... images: { domains: [ // ... "<BUCKET_NAME>.s3.amazonaws.com", ], }, })   代表您的存储桶的名称。 <BUCKET_NAME> 使用 运行您的店面，检查您添加的新产品是否存在，然后继续项目的下一阶段。 yarn run dev 结论 这标志着本教程的结束，希望您能够将文件服务插件添加到您的 Medusa 商店。要充分利用该工具，请考虑添加支付服务、搜索和通知服务。

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

The code in this story is for educational purposes. The readers are solely responsible for whatever they build with it.

将文件服务插件添加到您的 Medusa 商店：基本指南

About Author

註釋

標籤

这篇文章刊登在

Related Stories

如何将您的工作流程提高 10 倍：17 个必备应用程序

点击赚钱：Telegram 可能会在 Solana 之前吸引下一个 100 亿加密用户

比特币 UTXO 模型，为独特的生态系统提供动力

HackerNoon Decoded: The Top 10 Countries Where HackerNoon Is the Most Active

如何将您的工作流程提高 10 倍：17 个必备应用程序

点击赚钱：Telegram 可能会在 Solana 之前吸引下一个 100 亿加密用户

比特币 UTXO 模型，为独特的生态系统提供动力

HackerNoon Decoded: The Top 10 Countries Where HackerNoon Is the Most Active

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps