# xl-uploadfile

> Uploading video and audio files can control the upload file suffix and upload carrying parameters

Latest version **1.0.0** (published 2022-06-06) · ISC license · 0 weekly downloads

## Install

```sh
npm install xl-uploadfile
pnpm add xl-uploadfile
yarn add xl-uploadfile
bun add xl-uploadfile
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2022-06-06 |
| First published | 2022-06-06 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 8.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | coderl |
| Maintainers | coderl |
| Keywords | upload, file, video, audio |

## Links

- npm: https://www.npmjs.com/package/xl-uploadfile
- Repository: https://github.com/RUIBAO0113/upload-file
- Homepage: https://github.com/RUIBAO0113/upload-file#readme
- Issues: https://github.com/RUIBAO0113/upload-file/issues
- npm.io page: https://npm.io/package/xl-uploadfile

## Alternatives

- [unionfs](https://npm.io/package/unionfs.md) — 2.2M weekly downloads
- [path-starts-with](https://npm.io/package/path-starts-with.md) — 35.9K weekly downloads
- [redzip](https://npm.io/package/redzip.md) — 1.2K weekly downloads
- [vscode-anymatch](https://npm.io/package/vscode-anymatch.md) — 848 weekly downloads
- [@ledgerhq/coin-filecoin](https://npm.io/package/@ledgerhq/coin-filecoin.md) — 793 weekly downloads

## Recent versions

- 1.0.0 (latest) — 2022-06-06

## README

克隆下来 导入 uploadFile.js
git https://gitee.com/ruibao-0113_admin/upload-file.git

```html
<!-- 1. -->
<!-- html中 -->
<div class="sub">点击我上传</div>
<p class="file_name"></p>
<p class="progress"></p>
<p class="file_url"></p>
<!-- script引用  -->
<script src="uploadFile.js"></script>
```

```javascript
/* 2. */
/* 实例化 */
function createUploadFile() {
  return new uploadFile({
    // 上传api地址
    uploadUrl:
      "https://web.wbthink.cn/benVideoTest/CommonHelper.aspx?Method=UpLoadVideo",
    // 上传格式后缀要求 小写大写都可
    canUploadFormat: [
      "rm",
      "mp3",
      "aif",
      "aiff",
      "mid",
      "ra",
      "aqe",
      "wma",
      "rm",
      "flac",
      "ape",
      "midi",
    ],
    // 上传时携带参数
    formDataAppend: {
      title: "MeiDi.G.220408",
      Date: new Date().getTime(),
    },
    // 本地上传完成 isSuccess是否成功 fileName上传文件名
    onChange(isSuccess, fileName) {
      console.log(fileName);
      if (isSuccess) {
        // 包含可上传文件后缀名！
        document.querySelector(".file_name").innerHTML = "文件名" + fileName;
      } else {
        alert("不包含可上传文件后缀名！");
        // "不包含可上传文件后缀名！"
        document.querySelector(".file_name").innerHTML = "文件名" + fileName;
      }
    },
    // 上传过程 progress 上传进度百分比 resTime 剩余时间 上传速度
    onLoad(progress, resTime, speed) {
      console.log(progress);
      console.log(resTime);
      console.log(speed);
      document.querySelector(
        ".progress"
      ).innerHTML = `进度:${progress}%-剩余时间:${resTime}-速度:${speed}`;
    },
    // 上传完毕 url视频地址
    onComplete(url) {
      if (url) {
        console.log("上传成功！");
        document.querySelector(".file_url").innerHTML = `链接:${url}`;
      } else {
        document.querySelector(".file_url").innerHTML = `链接:暂无`;
      }
    },
  });
}
```

```javascript
// 调用上传 这里通过原生点击事件
document.querySelector(".sub").addEventListener("click", () => {
  createUploadFile().start();
});
```

---
_Source: https://npm.io/package/xl-uploadfile · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._