1.前端文件
<div class="control-group">
<label class="control-label"><em>*</em>图片:</label>
<div class="controls">
<input type="hidden" id="Form_image" name="Form[imgurl]" value="<?php echo $data ? Html::encode($data->imgurl) : '';?>" placeholder="">
<a type="button" class="btn btn-default" id="upload">选择文件</a>
<img src="<?php echo $data ? Html::encode($data->imgurl) : '';?>" style="max-height:100px;" id="show_image">
<p class="font-red" id="img-upload-error"></p>
</div>
</div>
通过button_placeholder_id:"upload"关联a标签上传
//指定一个dom元素的id,该dom元素在swfupload实例化后会被Flash按
钮代替,这个dom元素相当于一个占位符
var uploadAvatar = new ksFileUpload({
//swfupload.swf文件的绝对或相对地址,相对地址是指相对于当前的页面地址。实例化swfupload后,就不能再改变该属性的值了。
flashUrl: "/static/js/upload/swfupload.swf",
//处理上传文件的服务器端页面的url地址,可以是绝对地址,也可以是相对地址,当为相对地址时相对的是当前代码所在的文档地址
upload_url : "<?php echo Yii::$app->params['apiUrl'];?>/site/upload",
//
file_post_name : "file",
//一个对象直接量,里面的键/值对会随着每一个文件一起上传,文件上传要附加一些信息时很有用
post_params : {type: "picture"},
//该属性指定了允许上传的文件类型,当有多个类型时使用分号隔开
file_types : ["jpg", "jpeg", "png"],
//指定要上传的文件的最大体积,可以带单位,合法的单位有:B、KB、MB、GB,如果省略了单位,则默认为KB。该属性为0时,表示不限制文件的大小
file_size_limit : "5MB",
//是否选中后自动上传
auto_upload: true,
//指定一个dom元素的id,该dom元素在swfupload实例化后会被Flash按钮代替,这个dom元素相当于一个占位符
button_placeholder_id: "upload",
msg: {
"-110": "上传的图片不能超过100M",
"-130": "请上传jpg、jpeg、png格式的图片",
"-140": "图片上传失败,请稍后重试",
"-150": "请先选择图片"
},
/** upload_start_handler: null, 文件开始上传事件,选填,默认为null
* upload_progress_handler: null, 文件上传中进度事件,选填,默认为null
* upload_error_handler: null, 文件上传出错事件,选填,默认为null
* upload_success_handler: null, 文件上传成功事件,选填,默认为null
* upload_complete_handler: null, 文件开始上传后事件,不论成功或者失败都会触发,选填,默认为null
*/
file_queue_error_handler: function(msg) {
$("#img-upload-error").html(msg);
},
upload_error_handler: function(msg) {
$("#img-upload-error").html(msg);
},
upload_success_handler: function(file, res) {
if(res.code == 1) {
var src = res.data.url + res.data.path;
$("#Form_image").val(src);
$("#show_image").attr("src", src);
} else {
$("#img-upload-error").html(res.msg);
}
}
});
2.后台处理
请求路径:/site/upload
核心方法:$res = (new hlp\Upload())->run();
$res = $isBase64 ? $this->uploadByBase64() : $this->uploadByFile();
//通过Base64编码方式上传或通过HTTP form multipart/form-data 方式上传
3.待看:使用一致性哈希实现Redis分布式部署
http://ju.outofmemory.cn/entry/152607
网友评论