OuZuYu / upload-to-ali

upload to ali-oss easily

Home Page:https://femessage.github.io/upload-to-ali/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

upload-to-ali

Build Status NPM Download NPM Version NPM License PRs Welcome Automated Release Notes by gren

对接阿里云-OSS,可通过环境变量配置 OSS 信息,可自定义域名,支持多选、限制文件大小、删除、粘贴上传功能,拖拽上传功能,让上传功能更加简单

upload

English

Table of Contents

Feature

  • 纯前端实现,不需要后台配合
  • 只需配置 OSS 的基本信息,即可实现上传功能
  • 上传前自动压缩图片,上传过程中有 loading 提示,支持图片显示及删除
  • 可拓展自定义 loading 和默认上传样式
  • 可限制上传文件大小和上传文件数量
  • 可截图粘贴上传
  • 可拖拽上传
  • 可预览图片

⬆ Back to Top

Documentation

⬆ Back to Top

Install

yarn add @femessage/upload-to-ali

⬆ Back to Top

Config

使用时组件以下四个参数必传:

accessKeyId - 阿里云控制台创建的access key

accessKeySecret - 阿里云控制台创建的access secret

bucket - 存储空间的名字

region - 根据 存储空间 所在的存储区域, 相应的上传域名

使用前请务必设置跨域 及 ACL

⬆ Back to Top

Dotenv

推荐使用环境变量配置 OSS 参数

使用 dotenv,我们只需要将环境变量配置写在.env文件中,配合 CI 工具,可满足同一套代码在不同环境对接不同 OSS 的需求

以下是所有可传入的环境变量

# .env文件
# OSS上传设置

# 对应组件必要参数 accessKeyId
OSS_KEY=xxx
# 对应组件必要参数 accessKeySecret
OSS_SECRET=xxx
# 对应组件必要参数 bucket
OSS_BUCKET=your-bucket
# 对应组件必要参数 region
OSS_REGION=oss-cn-beijing
# 对应组件可选参数 dir
OSS_DIR=oss-dir
# 对应组件可选参数 customDomain
OSS_CUSTOM_DOMAIN=cdn.xxx.com

dotenv 文档参考 https://www.npmjs.com/package/dotenv

⬆ Back to Top

Reference

Contributors

Thanks goes to these wonderful people (emoji key):

levy
levy

💻 👀 🚇 📝 🤔
Alvin
Alvin

💻 👀
listars
listars

💻 👀 📖
EVILLT
EVILLT

💻 📖

This project follows the all-contributors specification. Contributions of any kind welcome!

About

upload to ali-oss easily

https://femessage.github.io/upload-to-ali/

License:MIT License


Languages

Language:Vue 76.8%Language:JavaScript 19.2%Language:Shell 4.0%