存储 - kuiyu/RsCode GitHub Wiki

本地服务器存储

引用RsCode.Storage.LocalStorage

使用服务

services.AddLocalStorage(Configuration);

七牛服务器存储

引用RsCode.Storage.QiniuStorage

使用服务

services.AddQiniuStorage(Configuration);

//七牛存储配置
  "QiniuStorage": {
    "UploadTokenUrl":"自定义的token获取地址", 
	"ManageTokenUrl":"自定义的token获取地址", 
	"DownloadTokenUrl":"自定义的token获取地址", 
    "AccessKey": "x",
    "SecretKey": "x",
    "Domain": "在七牛云存储配置的域名", //上传后资源地址，例：http://res.rscode.cn
    "Bucket": "在七牛云存储配置的bucket",
    "Zone": "bucket存储区域", //华东 ZONE_CN_East  华北 ZONE_CN_North 华南 ZONE_CN_South  北美 ZONE_US_North
    "UploadTokenExpireTime": 30, // 上传token有效时间单位：秒
    "DownloadTokenExpireTime": 5,//下载token有效时间
    "ManageTokenExpireTime": 5   //管理token有效时间
  }
  
  //本地存储配置 
  "LocalStorage": {
    "UploadTokenUrl":"自定义的token获取地址", //例 /storage/uptoken
	"UploadUrl": "https://localhost:5001/storage/upload",
    "AccessKey": "",//不填
    "SecretKey": "",//不填
    "Domain": "上传后资源地址", //上传后资源地址，例：http://res.rscode.cn
    "Bucket": "", //不填
    "Zone": "", //不填
    "UploadTokenExpireTime": 30, // 上传token有效时间单位：秒
    "DownloadTokenExpireTime": 5,//下载token有效时间
    "ManageTokenExpireTime": 5   //管理token有效时间
  }

自定义获取uptoken的逻辑例：

public class StorageController : Controller
    {
        public IActionResult UpToken([FromServices]IEnumerable<IStorageProvider> providers,string key,string provider="qiniu")
        {
            var qiniu = providers.FirstOrDefault(s => s.StorageName == provider);
            var tokenInfo= qiniu.GetUploadToken(key,DateTime.Now.AddMinutes(4));
            return Json(tokenInfo);
        }
	[HttpPost]
        public async Task<IActionResult> Upload([FromServices] IEnumerable<IStorageProvider> providers)
        {
            var local = providers.FirstOrDefault(s => s.StorageName == "local");
            var tokenInfo= await local.UploadAsync();
            return Json(tokenInfo);
        }
    }

获取上传token的返回值： {domain:'合法域名',token:'上传token',upload_url:'上传地址'}

上传成功后的返回值 {res:'',key:'上传后的key'}

注意：使用本地上传时，在wwwroot文件夹中，确保保存文件的文件夹是存在的 razor页面，使用 @Html.Raw(info.UploadUrl)防止字符被转义

实例：

vue文件上传 html

@{
    Layout = null;
    ViewData["title"] = "上传demo";
    var info = ViewBag.TokenInfo as RsCode.Storage.TokenResult;
   
}
<el-upload class="avatar-uploader"
                   ref="upload"
                   :action="upload_url"
                   :data="upload_data"
                   :show-file-list="false"
                   :on-success="handleAvatarSuccess"
                   :on-error="handleError"
                   :before-upload="beforeAvatarUpload">
            <img v-if="imageUrl" :src="imageUrl" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
        </el-upload>

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                imageUrl: '',
                // 七牛云上传储存区域的上传域名（华东、华北、华南、北美、东南亚）
                upload_url: "@Html.Raw(info.UploadUrl)",
                domain:"@info.Domain",
                upload_data: {
                    key: "",
                    token:"@info.Token"
                }
            };
        },
        methods: {
            handleAvatarSuccess(res, file) {
                console.log('res=' + JSON.stringify(res));
                console.log('file=' + JSON.stringify(file));
                if (res.key && res.key.length > 0) {
                    let fileUrl = this.domain + res.key;
                    //本地url
                    //this.imageUrl = URL.createObjectURL(file.raw);
                    this.imageUrl = fileUrl;
                } else {
                    this.handleError(res);
                }
            },
            handleError: function (res) {
                this.$message({
                    message: "上传失败,请重试",
                    duration: 2000,
                    type: "warning"
                });

                if (res.error == "expired token")
                {
                    //重新获取token
                }
            },
            beforeAvatarUpload(file) {
                const isJPG = file.type === 'image/jpeg';
                const isLt2M = file.size / 1024 / 1024 < 2;

                if (!isJPG) {
                    this.$message.error('上传头像图片只能是 JPG 格式!');
                }
                if (!isLt2M) {
                    this.$message.error('上传头像图片大小不能超过 2MB!');
                }

                let key = file.name; // 文件资源名
                //wwwroot下准备好文件夹file
                key = 'file/' + Math.random().toString(36).substr(2) + '.' + key.split(".")[1];
                this.upload_data.key = key;
                return isJPG && isLt2M;
            },
            getUploadToken() {
                this.http.get("/storage?provider=qiniu&action=uptoken")
                    .then(ret => {
                        this.domain = ret.domain;
                        this.token = ret.token;
                    })
                    .catch(err => {

                    })
            } 
        }
    })
</script>

css

<style>
        .avatar-uploader .el-upload {
            border: 1px dashed #d9d9d9;
            border-radius: 6px;
            cursor: pointer;
            position: relative;
            overflow: hidden;
        }

            .avatar-uploader .el-upload:hover {
                border-color: #409EFF;
            }

        .avatar-uploader-icon {
            font-size: 28px;
            color: #8c939d;
            width: 178px;
            height: 178px;
            line-height: 178px;
            text-align: center;
        }

        .avatar {
            width: 178px;
            height: 178px;
            display: block;
        }
</style>

存储 - kuiyu/RsCode GitHub Wiki

⚠️ **GitHub.com Fallback** ⚠️

⚠️ GitHub.com Fallback ⚠️