长椿街网站建设,网站建设哪一家好,德兴市建设局网站,照明做外贸的有那些网站一、.Net Core上传组件Uploader7.0简介
1.当前版本v7.0#xff0c;前端框架丰富升级
2.前端jquery框架封装,cover.js, 腾讯云cos-js-sdk-v5.min.js
3.后端#xff0c;支持Asp.Net 和 Asp.Net Core 矿建
4.数据传输模式支持#xff1a;WebScoket 、Ajax、Form 模式上传到…一、.Net Core上传组件Uploader7.0简介
1.当前版本v7.0前端框架丰富升级
2.前端jquery框架封装,cover.js, 腾讯云cos-js-sdk-v5.min.js
3.后端支持Asp.Net 和 Asp.Net Core 矿建
4.数据传输模式支持WebScoket 、Ajax、Form 模式上传到服务器。
最新版本资料请参考官网uploader上传控件介绍 - 微工具集 二、后端安装前端引入参考之前文章.Net Core上传组件_.Net Core图片上传处理组件_uploadcore_天马3798的博客-CSDN博客
提醒安装v6.0或者v.5.0系列
三、配置使用说明
1.type ,控件类型
type: single,//控件类型
/*
* 1.简单形式(single,单纯上传文件自动提交)
* 2.对话框形式(dialog需要图片剪切处理)
* 3.前台压缩大小图片上传 (imgdouble) 不改变原图片的比例在指定范围内等比例缩放小图(minWidth*minHeight); 大图((maxWidth*maxHeight))
* 4.前台最大比例图片处理fixedsize固定比例缩放最大化图片显示剩余空间填充空白
* 5.前台最大比例图片剪切fixedcut:固定比例缩放(maxWidth*maxHeight)最大化图片剪切
* 6.前台裁剪大小图处理cutdouble:固定最小图(minWidth*minHeight)最大图(maxWidth*maxHeight)裁剪图片
* 7.前端压缩图片上传imgsingle:不改变图片的比例在指定范围内等比例缩放小图(minWidth*minHeight); 大图((maxWidth*maxHeight))
*/
2.uploadType上传协议类型 uploadType: 1,//上传处理方式
1-----Ajax上传处理默认
2----WebSocket上传处理主要用于应对单文件上传 3----tencent 腾讯云上传模式
3.其他参数
subfolder: ,//指定后台保存的子文件夹 more: false, //是否支持多个文件默认 0不支持多个文件上传2支持多个文件上传但是是一个一个的 3支持多文件多连接上传 moreCount:5,//最多支持上传个数 debug: false, //如果是调试模式指定输出内容
maxWidth: 1960,//前台压缩时最大宽度 maxHeight: 1000,//前台压缩时最大高度 minWidth: 300,//前台压缩时最小宽度 minHeight: 300,//前台压缩时最小高度 background: white,// 在使用到背景处理时的默认背景 tempFile: uploadCfg.tempFile,//设置临时文件夹 auto: true,//是否自动上传文件 isImg: false,//是否是图片如果是图片提供预览功能 quality:0.8,//默认导出图片质量大小 0-1 fileExts: jpg;png;gif;bmp;jpeg,//允许上传的文件扩展名*----没有显示 timeout: 30000, 四、使用案例整理常见6打场景
1.简单文件上传single /*******使用WebScoket 方式处理传输*******/var uploader $(#uploadBtn).uploader({url: ws:// location.host /upload/common,fileExts:*,text: 简单上传按钮,maxSize:1024*1024*1000,more:true,debug:true,onSuccess: function (data) {console.info(data);$(#name).text(data.newName);$(#relativeName).text(data.relativeName);}});
2.图片压缩上画攒不改变图片比例imgsingle /*******使用WebScoket 方式处理传输*******/var uploader $(#uploadBtn).uploader({url: ws:// location.host /upload/common,fileExts:jpg;png;gif;jpeg,text: 图片上传按钮,type:imgsingle,maxSize:1024*1024*1000,more:true,//isImg:true,debug:true,maxWidth: 1200,maxHeight: 1200,onSuccess: function (data) {console.info(data);$(#name).append(divdata.newName/div);$(#relativeName).append(divdata.relativeName/div);$(#result).append(img srcdata.relativeName /)}});
3.固定大小图片上传裁剪图片fixedcut /*******使用WebScoket 方式处理传输*******/var uploader $(#uploadBtn).uploader({url: ws:// location.host /upload/common,fileExts:jpg;png;gif;jpeg,text: 图片上传按钮,type:fixedcut,maxSize:1024*1024*1000,more:true,//isImg:true,debug:true,maxWidth: 200,maxHeight: 200,onSuccess: function (data) {console.info(data);$(#name).append(divdata.newName/div);$(#relativeName).append(divdata.relativeName/div);$(#result).append(img srcdata.relativeName /)}});
4.大小图上传不改变图片比例imgdouble /*******使用WebScoket 方式处理传输*******/var uploader $(#uploadBtn).uploader({url: ws:// location.host /upload/common,fileExts: jpg;png,text: 选择图片,maxSize: 1024 * 1024 * 1000,more: true,debug: true,type: imgdouble,minWidth: 100,minHeight: 100,maxWidth: 1200,maxHeight: 1200,onSuccess: function (data) {console.info(data);var small data.small;var big data.big;$(#imgSmallInfo #name).text(small.newName);$(#imgSmallInfo #relativeName).text(small.relativeName);$(#imgSmallInfo img).attr(src, small.relativeName);$(#imgBigInfo #name).text(big.newName);$(#imgBigInfo #relativeName).text(big.relativeName);$(#imgBigInfo img).attr(src, big.relativeName);}});
5.大小图上传裁剪图片压缩cutdouble /*******使用WebScoket 方式处理传输*******/var uploader $(#uploadBtn).uploader({url: ws:// location.host /upload/common,fileExts: jpg;png,text: 选择图片,maxSize: 1024 * 1024 * 1000,more: true,debug: true,type: cutdouble,minWidth: 100,minHeight: 100,maxWidth: 1200,maxHeight: 1200,onSuccess: function (data) {console.info(data);var small data.small;var big data.big;$(#imgSmallInfo #name).text(small.newName);$(#imgSmallInfo #relativeName).text(small.relativeName);$(#imgSmallInfo img).attr(src, small.relativeName);$(#imgBigInfo #name).text(big.newName);$(#imgBigInfo #relativeName).text(big.relativeName);$(#imgBigInfo img).attr(src, big.relativeName);}});
6.选择裁剪图片上传dialog /*******使用WebScoket 方式处理传输*******/var uploader $(#uploadBtn).uploader({url: ws:// location.host /upload/common,fileExts:jpg;png;gif;jpeg,text: 图片上传按钮,type:dialog,maxSize:1024*1024*1000,more:false,debug:true,coverParams: {title:选择头像,targetWidth:300,targetHeight:300},onSuccess: function (data) {console.info(data);$(#name).text(data.newName);$(#relativeName).text(data.relativeName);$(img).attr(src,data.relativeName)}});
7.上传腾讯云内部使用了解更多添加微信tianma104私聊 /*******使用tencent 方式处理传输 视频 mp4*******///不需要指定上传路径var uploader $(#uploadBtn).uploader({fileExts: mp4,text: 视频上传按钮,type: single,maxSize: 1024 * 1024 * 1000,more: false,debug: true,uploadType: 3,//使用腾讯云方式//oldFileName: 1677044999702-35.mp4, // 重点指定就的视频文件名可以执行远程删除任务oldFileName:,onSuccess: function (data) {console.info(data);$(#name).text(data.newName);$(#relativeName).text(data.absoluteName);$(video).attr(src, data.absoluteName)}});
更多
.Net Core上传组件_.Net Core图片上传处理组件
Asp.Net Core WebSocket绑定
删除github上的远程分支