seiue-c3-file v1.0.1

Seiue Chalk3.0 File

Seiue Chalk 3 文件上传机制

Get Started

初始化

// File 依赖于 Session
import { SeiueSession } from 'seiue-c3-session'
import { seiueFiles, SeiueFiles } from "seiue-c3-file";

// 设置 Session 的环境变量
SeiueSession.setEnv({
  SERVER_PASSPORT: 'Seiue Passport 服务地址"',
  CLIENT_WEB_CLIENT_ID: "客户端 ID"
})

SeiueSession.create().then(res => {
  // 登录成功后，res 将会返回登录信息，然后注册 File
  SeiueFiles.init({
    env: {
      RID: res.rid,
      SERVER_CHALK: "Seiue Chalk 服务地址",
      SERVER_PLATFORM: "Seiue Platform 服务地址",
      SERVER_PASSPORT: "Seiue Passport 服务地址",
      REFRESH_TOKEN_IF_NEEDED: SeiueSession.refreshOAuthTokenIfNeeded,
    },
  });
})

上传

function Upload() {
  return (
    <div>
      <input
        type="file"
        onChange={async e => {
          // 直接上传文件
          const result = await seiueFiles.uploadDirect(e.target.files[0])

          // 获取 Hash，然后再通过 seiueFiles.hashToUrl 得到完整的文件地址

          console.log(seiueFiles.hashToUrl(result.hash))
        }}
      />
    </div>
  )
}

SeiueFiles Apis

SeiueFiles 文件上传类

仅在初始化时使用

SeiueFiles.init({ envs }) 初始化与配置环境变量

在使用其他 Api 前，请先完整配置环境变量。注意在 Session 初始化完毕后，再进行本 SDK 的初始化。

参数

envs: {
  // Seiue Chalk 服务地址
  SERVER_CHALK: string
  // Seiue Platform 服务地址
  SERVER_PLATFORM: string
  // Seiue Rid 登录的用户 rid，可从 Session.create 中取出
  RID: number
  // 是否是本地部署
  LOCAL_DEPLOY: boolean
  // 当 Token 过期时的刷新方法，可以直接传入 SeiueSession.refreshOAuthTokenIfNeeded
  REFRESH_TOKEN_IF_NEEDED: () => Promise<OAuthToken>
}

返回值

void

seiueFile 文件上传单例

将 SeiueFiles 初始化后，可以从 'seiue-c3-file' export 出 seiueFile，进而进行一系列上传操作

seiueFile.uploadDirect(file) 直接上传文件

参数

file - File - 文件本件，通常从 input(type="file") 中获取

返回值

result: {
  hash: string // 文件的唯一标识
  name: string // 文件名
  size: number // 文件大小
}

seiueFile.uploadImageDataUrl(dataUrl) 上传 dataUrl 形态的图片文件

参数

dataUrl - string - dataUrl，通常借助 Canvas 生成

返回值

hash: string // 文件的唯一标识

seiueFile.hashToUrl(hash, { compress }) 将文件标识转化为可访问地址

参数

hash: string // 文件唯一标识
compress: {
  zoom?: ['lfit' | 'fill', number | null, number | null] // 图片缩放配置，分别为 [等比/填充，宽，高]
  quality?: number // 图片的压缩质量
}

返回值

url: string // 文件的可访问地址

seiue.uploaderFactory(file, onChange) 文件上传构造器

额外的接受一个 onChange 参数，通过 onChange，可以获取到文件上传前，中，后的各种进度和状态

Notes

• 目前仅适用于会部署在希悦内部的项目

Bug and Discussions

如果你遇到 bug，可以通过相关微信群或者联系 lrc@seiue.com