@winman-f2e/nos-js

本包是用于创建多端适配的nos直传的基础包。 可用于创建自定义的平台适配工具。

• @winman-f2e/nos-js
  • 已提供的平台
  • 自定义适配
    • 自定义平台适配
      • Adapter.upload 上传适配器
      • Adapter.fetch 请求适配器
      • Adapter.storage 本地存储适配器
    • 自定义上传行为
  • API
    • NOSDefaultUploader
    • NOSBlockUploader
    • NOSConcurrentUploader
  • RichMediaURL 富媒体url处理工具
    • 使用方法

已提供的平台

可以查看对应平台的包，以获取更方便的使用

1. 浏览器： @winman-f2e/nos-js-web

自定义适配

自定义平台适配

import { NOSClass }  from '@winman-f2e/nos-js';

class CustomNOSClass extends NOSClass {
  // 平台的上传适配器
  uploadAdapter = Adapter.upload;

  // 平台的请求适配器
  fetchAdapter = Adapter.fetch;

  // 平台的本地存储适配器
  storage = Adapter.storage;
}

Adapter.upload 上传适配器

Adapter.fetch 请求适配器

Adapter.storage 本地存储适配器

自定义上传行为

import { NOSUploader }  from '@winman-f2e/nos-js';

class CustomNOSUploader extends NOSUploader {
  // 实现自己要想上传行为即可
  // 最后调用 setComplete 就能完成
  upload () {}
}

API

import {
  NOSClass,
  NOSUploader,
  NOSConcurrentUploader,
  NOSBlockUploader,
  NOSDefaultUploader
} from '@winman-f2e/nos-js';

NOSDefaultUploader

默认的上传。不使用分块上传。 适合一些小文件场景，比如图片

NOSBlockUploader

顺序分块上传。 第一版的分块上传，但是由于是按顺序上传，非并行，可能无法充分利用用户带宽。 推荐使用 NOSConcurrentUploader 并行分块上传。有更好的上传体验。

NOSConcurrentUploader

并行分块上传。 适合大文件上传，默认分块大小为 10M

RichMediaURL 富媒体url处理工具

对应NOS文档 nos是给予

使用方法

const url = 'https://test.com/abc.png?imageView&thumbnail=100x200'
const richMediaURL = new RichMediaURL(url);

// 设置宽高及裁剪方法
richMediaURL.imageView.setThumbnail({
  width: 300,
  height: 400,
  type: 'z'
})
// 直接设置对应的图片处理参数
richMediaURL.imageView.set('tostatic', '1')

// 设置水印为文字水印
richMediaURL.watermark.set('type', '2');
// 设置水印内容为abc
richMediaURL.watermark.set('text', 'abc');

// 其他更多参数可以参考nos文档

console.log(
  // 最后通过调用toString，导出生成好的url
  richMediaURL.toString()
)