# @winman-f2e/nos-js

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

- [@winman-f2e/nos-js](#winman-f2enos-js)
  - [已提供的平台](#已提供的平台)
  - [调试日志](#调试日志)
  - [自定义适配](#自定义适配)
    - [自定义平台适配](#自定义平台适配)
      - [Adapter.upload 上传适配器](#adapterupload-上传适配器)
      - [Adapter.fetch 请求适配器](#adapterfetch-请求适配器)
      - [Adapter.storage 本地存储适配器](#adapterstorage-本地存储适配器)
    - [自定义上传行为](#自定义上传行为)
  - [API](#api)
      - [NOSDefaultUploader](#nosdefaultuploader)
      - [NOSBlockUploader](#nosblockuploader)
      - [NOSConcurrentUploader](#nosconcurrentuploader)
  - [RichMediaURL 富媒体url处理工具](#richmediaurl-富媒体url处理工具)
    - [使用方法](#使用方法)

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

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


## 调试日志

SDK 内部包含详细的调试日志，用于追踪上传流程和排查问题。默认情况下日志是关闭的，需要通过配置环境变量来开启。

### 开启日志

设置 `NOS_SDK_LOG` 环境变量为 `enable` 即可开启调试日志：

## 自定义适配
### 自定义平台适配
```ts
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 本地存储适配器

### 自定义上传行为
```ts
import { NOSUploader }  from '@winman-f2e/nos-js';

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

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

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

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

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

## RichMediaURL 富媒体url处理工具
[对应NOS文档](https://sf.163.com/help/documents/18124068855332864)
nos是给予

### 使用方法
```ts
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()
)
```