npm 包 @machinshin/multer-gcs 使用教程

阅读时长 4 分钟读完

在前端开发中,我们经常需要上传文件。而如果你的服务端是部署在 Google Cloud Platform(GCP)上的,那么使用 @machinshin/multer-gcs 这个 npm 包可以方便地将文件上传到 GCP 的 Google Cloud Storage (GCS) 中。

安装

使用以下命令安装 @machinshin/multer-gcs:

使用

使用 @machinshin/multer-gcs 进行文件上传需要以下步骤:

  1. 创建 GCP 的服务账户
  2. 准备上传文件的表单
  3. 前端代码完成文件上传到服务端
  4. 服务端使用 @machinshin/multer-gcs 进行文件保存到 GCS

接下来,我们将以 Node.js 为例进行具体的操作。

创建 GCP 的服务账户

在 GCP 控制台中创建一个服务账户,并将其角色设置为 Storage Object Admin。在创建服务账号时会自动生成一个 JSON 格式的私钥(秘钥)。将其下载保存到本地,后续会用到。

准备上传文件的表单

在 HTML 页面中提供一个表单,用于文件上传。

前端代码完成文件上传到服务端

使用 XMLHttpRequest 或 fetch 等方式将文件上传到服务端,并接收服务端返回的链接地址。这里以 fetch 为例。

-- -------------------- ---- -------
----- ---- - ---------------------------------
------------------------------- ----- --- -- -
  -------------------
  ----- -------- - --- ---------------
  --- -
    ----- -------- - ----- ---------------- -
      ------- -------
      ----- --------
    ---
    ----- ------ - ----- ----------------
    ------------------------
  - ----- ------- -
    ---------------------
  -
---

服务端使用 @machinshin/multer-gcs 进行文件保存到 GCS

安装 @machinshin/multer-gcs 后,服务端代码如下:

-- -------------------- ---- -------
----- ------- - -------------------
----- ------ - ----------------------------------

----- ------ - --------
  -------- -----------------------
  ------- -
    --------- - - ---- - ---- -- --------- --
  --
  ------------ ------------------------ -- ----------
  ------- -------------- -- -----
  ---- ------------ -- --- ----------- ---------- -------
---

----- --- - ----------

------------------- ---------------------- ----- ---- -- -
  ----- ---- - ---------
  ----------
    ---- --------------
  ---
---

---------------- -- -- -
  ---------------- --------- -- ---- --------
---

这里定义了 keyFilename、bucket、acl 三个参数。其中,keyFilename 参数指定了账户的私钥路径;bucket 参数指定将文件保存在 GCS 的哪个存储桶中;acl 参数指定了访问权限,默认为 private,设置为 publicRead 后可以公开访问。

该示例服务端将文件保存到 GCS 后,返回的响应数据包含一个链接地址。

总结

通过本文的介绍,可以了解到如何使用 @machinshin/multer-gcs 将文件上传到 GCP 的 GCS 中。如果你的服务端是部署在 GCP 上的,那么这个 npm 包可以为你提供便利。注意,需要提供 GCP 服务账户的私钥,并将其下载保存到本地进行使用。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/600562ba81e8991b448dff9e

纠错
反馈