前端自己动手使用nodejs上传打包文件到aliyun oss

前端人人

发布于 2019-06-05 15:58:35

7.2K0

发布于 2019-06-05 15:58:35

文章被收录于专栏：前端人人前端人人

我们现在做的这个项目，前端文件选择放到aliyun oss上，oss 提供了各种语言的SDK。我们前端本着不麻烦后端，能自己动手，就自己动手的原则，使用nodejs来上传打包后的文件到aliyun oss。

官方提供的示列：

通过put接口将本地文件上传到 OSS：

let OSS = require('ali-oss')

let client = new OSS({
  region: '<Your region>',
  accessKeyId: '<Your AccessKeyId>',
  accessKeySecret: '<Your AccessKeySecret>',
  bucket: '<Your bucket name>',
});

async function put () {
  try {
    let result = await client.put('object-name', 'local-file');
    console.log(result);
  } catch (e) {
    console.log(e);
  }
}

put();

我们先来使用下官方提供的示列：

首先安装这个包

npm i -D ali-oss

然后在根目录下新建 ali-oss.js 文件，并复制上面的代码到该文件中，并填写上各种配置信息，如图所示：

这里是关键我也是试了几次才知道：

let result = await client.put('object-name', 'local-file');

object-name：你必须制定oss 文件管理的文件名称，子目录下的要指定目录及文件名称及后缀。

local-file：就是本地文件路径。

比如改成这样：

let result = await client.put('index.html', 'dist/index.html');

然后在终端里执行:

node ali-oss.js

然后查看aliyun oss 文件管理

该文件就上传成功了。

你可能需要自己写个文件遍历，才能把你dist下所有文件擅上传上去，默认是覆盖oss里的文件。如果你想每次上传，都清空oss 文件管理，你可能还需要写一个遍历oss文件，并删除的逻辑代码。

推荐：

如果不想自己写的话，这里推荐另一个包（ali-oss-publish，详细使用说明请移步至github），也是基于ali-oss开发的。

我们安装这个包:

npm i -D ali-oss-publish

我们在根目录下新建 ali-oss-publish.js

代码如下：


const publish = require("ali-oss-publish");

publish(
  {
    id: "xxxxx",
    secret: "xxxxx",
    region: "xxxxx",
    bucket: "xxxxx",
    entry: "dist", // defaults to '.'
    // include: /bin|cli|lib|*.js$|\.md$/,
    exclude: /.DS_Store$/,
    mime: filename => {
      if (/\.md$/.test(filename)) {
        return "text/markdown";
      }

      return undefined;
    },
    meta: {
      ref: Date.now()
    },
    headers: {
      "Cache-Control": "max-age=30672000"
    },
    rules: [
      {
        test: /(index\.html|service-worker\.js)$/,
        use: {
          headers: {
            "Cache-Control": "no-cache"
          }
        }
      }
    ],
    output: ".",
    config: "", // defaults to try load config from 'ali-oss-publish.config.js' when config is not set
    retry: 1,
    concurrency: 4,
    force: true
  },
  (err, stats) => {
    if (err) {
      console.error("ali-oss-publish encountered a fatal error.");
      console.error(err);

      process.exit(1);
    }

    if (stats.hasProgress()) {
      const { type, index, current, total, message } = stats;

      console.log("[%s] [%s/%s] #%s: %s", type, current, total, index, message);
    } else {
      console.log(stats.message);
    }

    if (stats.hasWarnings()) {
      console.warn("ali-oss-publish encountered some warnings.");
      stats.warnings.forEach(x => {
        console.warn(x);
      });
    }

    if (stats.hasErrors()) {
      console.error("ali-oss-publish encountered some errors.");
      stats.errors.forEach(x => {
        console.error(x);
      });
    }
  }
);

这里主要3个地方: