npm 包 gcslift 使用教程-JavaScript中文网-JavaScript教程资源分享门户

前言

在前端开发中，常常需要使用文件上传功能。由于浏览器自身的限制，很多时候需要在后台完成文件上传操作。而这种情况下，通常需要将文件上传到云端存储服务，如 Google Cloud Storage。针对这种需求，提供了一个方便的 npm 包，即 gcslift。

本文将介绍 gcslift 的使用教程，包括安装、配置和使用方法，以及一些示例代码。

安装

使用 npm 包管理工具，可轻松完成 gcslift 的安装。

npm install --save gcslift

配置

使用 gcslift 需要以下几个信息：

Google Cloud Storage 项目 ID
Google Cloud Storage 访问密钥文件路径（JSON 格式）
存储桶（Bucket）名称

如果还没有创建 Google Cloud Storage 项目 ID 和存储桶，需要先在 Google Cloud Platform 创建。

创建完成后，在 Google Cloud Console 里找到存储桶名称，以及生成密钥文件（JSON 格式），将其下载并保存在本地。可以参考官方文档了解生成密钥文件的详细步骤。

有了以上信息后，可以通过配置文件或环境变量的方式设置 gcslift 的配置。具体示例代码如下：

配置文件

在项目根目录下面创建配置文件 .env ，把以下三个变量添加进去。

GCLOUD_PROJECT_ID=<PROJECT_ID>
GCLOUD_KEY_FILE=<KEY_FILE_PATH>
GCLOUD_BUCKET_NAME=<BUCKET_NAME>

其中 <PROJECT_ID> 为 Google Cloud Storage 项目 ID， <KEY_FILE_PATH> 为密钥文件路径， <BUCKET_NAME> 为存储桶名称。

环境变量

也可以通过环境变量的方式设置 gcslift 的配置，直接在终端输入以下命令。

export GCLOUD_PROJECT_ID=<PROJECT_ID>
export GCLOUD_KEY_FILE=<KEY_FILE_PATH>
export GCLOUD_BUCKET_NAME=<BUCKET_NAME>

注意：

使用环境变量和配置文件都需要确保变量名和值的正确性。在环境变量中祛除了文件路径的引号，而在配置文件中必须使用引号，并确保 KEY_FILE_PATH 是真正密钥文件的完整路径。

使用

完成配置后，我们就可以使用 gcslift 来进行文件上传了。具体使用方法请见下文。首先，需要引入 gcslift：

import GCSLift from 'gcslift';

const gcslift = new GCSLift();

之后，就可以使用 gcslift 的相关方法了。

方法

`uploadFile`

上传文件到 Google Cloud Storage，方法签名如下：

uploadFile(file: File | Blob, options?: UploadOptions) : Promise<{ uploadUrl: string, publicUrl: string}>

其中，file 参数是要上传的文件对象，支持 File 和 Blob 类型。options 参数是可选的上传选项，类型为 UploadOptions，具体如下：

interface UploadOptions {
  contentType?: string; // 文件类型，如 'image/png'
  folder?: string; // 上传到指定文件夹
  fileName?: string; // 上传的文件名称
  acl?: 'private' | 'public'; // 访问控制，默认为 'private'
}

例如，上传一个文件可以这样做：

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

`getSignedUrl`

获取文件下载链接，方法签名如下：

getDownloadUrl(file: string, opts?: GetDownloadUrlOptions): Promise<{ downloadUrl: string}>

其中，file 参数是要下载的文件名；options 参数是可选的选项，类型为 GetDownloadUrlOptions，具体如下：

interface GetDownloadUrlOptions {
  expires?: number; // 过期时间，默认为 1 小时 (in seconds)
  baseUrl?: string; // 如果需要设置 CDN 地址
}

例如，获取文件下载链接可以这样做：

async function download() {
  try {
    const result = await gcslift.getDownloadUrl('sample.txt');
    console.log(result);
  } catch (e) {
    console.log(e);
  }
}

`deleteFile`

删除文件，方法签名如下：

deleteFile(file: string) : Promise<void>

其中，file 参数是要删除的文件名。

例如，删除文件可以这样做：

async function remove() {
  try {
    await gcslift.deleteFile('sample.txt');
  } catch (e) {
    console.log(e);
  }
}

结语

本文介绍了如何使用 gcslift 进行文件上传到 Google Cloud Storage，并提供了详细的示例代码。对于一些常常需要上传文件的项目，这个包可以帮助我们方便地完成文件上传操作，节省了开发时间和精力。学习了 gcslift 的使用方法后，我们可以根据实际需要在自己的项目中灵活应用。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/60057c2f81e8991b448ebbde