uploadify 上傳外掛的使用(視訊和圖片都可以上傳)
阿新 • • 發佈:2019-01-22
1第一步:引入jquery.js
2第二步:引入jquery.uploadify.js
3.第三步:引入uploadify.css
4第四步:在html加標籤<input id="upload-gooods-video" type="file" name="goods_video">
第五步:新增js程式碼(到了這一步已經把視訊傳到了頁面上了)
<script type="text/javascript">
$(function(){
//將upload-goods-video 替換成一個上傳外掛
$("#upload-goods-video").uploadify({
"height" : 30,
"width" : 120, //定義上傳外掛的寬和高
"swf" : "<?php echo RESOURCE_SITE_URL;?>/js/uploadify/uploadify.swf", //引入上傳外掛的flash
"fileObjName" : "goods_video", //以什麼名字上傳到伺服器上.. 儲存到$_FILES. 預設的名字為 'Filedata'
"buttonText" : "上傳視訊",
"uploader" : "<?php echo SHOP_SITE_URL; ?>/index.php?act=store_goods_add&op=video_upload", //上傳給哪個url地址
'removeTimeout' : 3, //上傳後的提示在幾秒後消失
'multi' : false,//是否執行多檔案上傳
'debug' : false, //是否開啟除錯模式
'formData' : {name:'goods_video',pic_url:''}, //上傳圖片的同時以POST的形式向伺服器引數, 指定上傳到又拍雲的哪個空間
'fileTypeExts' : '*.jpg; *.png; *.gif; *.bmp; *.mp4;', //指定上傳的型別, 它可以幫我們驗證..
'onUploadSuccess' : function(file, data, response) { //上傳成功之後執行該方法
var obj = $.parseJSON(data);
//console.log(data);
$("#video_path").val(obj.name);
//顯示預覽圖片的div
//$('.upload-pre-item img').attr('src','__BRAND__/'+obj.path+'!s'); //將上傳後的路徑設定給img的src中
//$('.upload-img-box').show();
},
'onFallback' : function() {
alert('未檢測到相容版本的Flash.');
}
});
});
</script>
第六步:php功能程式碼(到了這一步已經把檔案儲存到檔案或者upyun上面了)
//上傳視訊
public function video_uploadOp(){
$uploader = new UploadFile();
$uploader->set('default_dir', ATTACH_GOODS . DS . $_SESSION ['store_id'] . DS . $uploader->getSysSetPath());
$uploader->set('max_size', '10240');
$uploader->set('fprefix', $_SESSION['store_id']);
$uploader->set('allow_type', array('gif', 'jpg', 'jpeg', 'png', 'mp4'));
$result = $uploader->upload($_POST['name'],C('target'));
if (!$result) {
if (strtoupper(CHARSET) == 'GBK') {
$uploader->error = Language::getUTF8($uploader->error);
}
$output = array();
$output['error'] = $uploader->error;
$output = json_encode($output);
exit($output);
}
$video_name = $uploader->getSysSetPath() . $uploader->file_name;
$data = array ();
$data ['name'] = $video_name;
// if(C('target')=='upyun'){
// $data ['thumb_name']=UPYUN_URL.$uploader->img_url.'!240';
// }else{
// $data ['thumb_name'] = cthumb($uploader->getSysSetPath() . $uploader->thumb_image, 240, $_SESSION['store_id']);
// }
// 整理為json格式
$output = json_encode($data);
echo $output;
exit();
}
第七步:寫的底層程式碼
/**
* 上傳視訊操作
*
* @param string $field
* @return bool
*/
public function upload($field,$target=''){
//上傳檔案
$this->upload_file = $_FILES[$field];
if ($this->upload_file['tmp_name'] == ""){
$this->setError(Language::get('cant_find_temporary_files'));
return false;
}
//對上傳檔案錯誤碼進行驗證
$error = $this->fileInputError();
if (!$error){
return false;
}
//驗證是否是合法的上傳檔案
if(!is_uploaded_file($this->upload_file['tmp_name'])){
$this->setError(Language::get('upload_file_attack'));
return false;
}
//驗證檔案大小
if ($this->upload_file['size']==0){
$error = Language::get('upload_file_size_none');
$this->setError($error);
return false;
}
if($this->upload_file['size'] > $this->max_size*1024){
$error = Language::get('upload_file_size_cant_over').$this->max_size.'KB';
$this->setError($error);
return false;
}
//檔案字尾名
$tmp_ext = explode(".", $this->upload_file['name']);
$tmp_ext = $tmp_ext[count($tmp_ext) - 1];
$this->ext = strtolower($tmp_ext);
//驗證檔案格式是否為系統允許
if(!in_array($this->ext,$this->allow_type)){
$error = Language::get('image_allow_ext_is').implode(',',$this->allow_type);
$this->setError($error);
return false;
}
//設定路徑
$this->save_path = $this->setPath();
//設定檔名稱
if(empty($this->file_name)){
$this->setFileName();
}
//是否立即彈出錯誤
if($this->if_show_error){
echo "<script type='text/javascript'>alert('". ($this->if_show_error_one ? $error : $this->error) ."');history.back();</script>";
die();
}
if ($this->error != '') return false;
//上傳本地或者upyun
//if($target=='upyun'){
//require_once(BASE_DATA_PATH.'/resource/upyun/upyun.class.php');
//$upyun=new Upyun(C('bucket'),C('user_name'),C('pwd'));
//$opts = array(
//UpYun::X_GMKERL_THUMBNAIL => 'thumbtype'
//);
//$this->img_url=DS.$this->save_path.DS.$this->file_name;
//$fh = fopen($this->upload_file['tmp_name'], 'rb');
//$result = $upyun->writeFile($this->img_url,$fh, True, $opts); // 上傳圖片,自動建立目錄
//fclose($fh);
// $this->assertTrue(is_array($result));
//return 1;
//}else{
if(@move_uploaded_file($this->upload_file['tmp_name'],BASE_UPLOAD_PATH.DS.$this->save_path.DS.$this->file_name)){
//刪除原圖
if ($this->ifremove && is_file(BASE_UPLOAD_PATH.DS.$this->save_path.DS.$this->file_name)) {
@unlink(BASE_UPLOAD_PATH.DS.$this->save_path.DS.$this->file_name);
}
return true;
}else {
$this->setError(Language::get('upload_file_fail'));
return false;
}
//}
//$this->setErrorFileName($this->upload_file['tmp_name']);
return $this->error;
}
2第二步:引入jquery.uploadify.js
3.第三步:引入uploadify.css
4第四步:在html加標籤<input id="upload-gooods-video" type="file" name="goods_video">
第五步:新增js程式碼(到了這一步已經把視訊傳到了頁面上了)
<script type="text/javascript">
$(function(){
//將upload-goods-video 替換成一個上傳外掛
$("#upload-goods-video").uploadify({
"height" : 30,
"width" : 120, //定義上傳外掛的寬和高
"swf" : "<?php echo RESOURCE_SITE_URL;?>/js/uploadify/uploadify.swf", //引入上傳外掛的flash
"fileObjName" : "goods_video", //以什麼名字上傳到伺服器上.. 儲存到$_FILES. 預設的名字為 'Filedata'
"buttonText" : "上傳視訊",
"uploader" : "<?php echo SHOP_SITE_URL; ?>/index.php?act=store_goods_add&op=video_upload", //上傳給哪個url地址
'removeTimeout' : 3, //上傳後的提示在幾秒後消失
'multi' : false,//是否執行多檔案上傳
'debug' : false, //是否開啟除錯模式
'formData' : {name:'goods_video',pic_url:''}, //上傳圖片的同時以POST的形式向伺服器引數, 指定上傳到又拍雲的哪個空間
'fileTypeExts' : '*.jpg; *.png; *.gif; *.bmp; *.mp4;', //指定上傳的型別, 它可以幫我們驗證..
'onUploadSuccess' : function(file, data, response) { //上傳成功之後執行該方法
var obj = $.parseJSON(data);
//console.log(data);
$("#video_path").val(obj.name);
//顯示預覽圖片的div
//$('.upload-pre-item img').attr('src','__BRAND__/'+obj.path+'!s'); //將上傳後的路徑設定給img的src中
//$('.upload-img-box').show();
},
'onFallback' : function() {
alert('未檢測到相容版本的Flash.');
}
});
});
</script>
第六步:php功能程式碼(到了這一步已經把檔案儲存到檔案或者upyun上面了)
//上傳視訊
public function video_uploadOp(){
$uploader = new UploadFile();
$uploader->set('default_dir', ATTACH_GOODS . DS . $_SESSION ['store_id'] . DS . $uploader->getSysSetPath());
$uploader->set('max_size', '10240');
$uploader->set('fprefix', $_SESSION['store_id']);
$uploader->set('allow_type', array('gif', 'jpg', 'jpeg', 'png', 'mp4'));
$result = $uploader->upload($_POST['name'],C('target'));
if (!$result) {
if (strtoupper(CHARSET) == 'GBK') {
$uploader->error = Language::getUTF8($uploader->error);
}
$output = array();
$output['error'] = $uploader->error;
$output = json_encode($output);
exit($output);
}
$video_name = $uploader->getSysSetPath() . $uploader->file_name;
$data = array ();
$data ['name'] = $video_name;
// if(C('target')=='upyun'){
// $data ['thumb_name']=UPYUN_URL.$uploader->img_url.'!240';
// }else{
// $data ['thumb_name'] = cthumb($uploader->getSysSetPath() . $uploader->thumb_image, 240, $_SESSION['store_id']);
// }
// 整理為json格式
$output = json_encode($data);
echo $output;
exit();
}
第七步:寫的底層程式碼
/**
* 上傳視訊操作
*
* @param string $field
* @return bool
*/
public function upload($field,$target=''){
//上傳檔案
$this->upload_file = $_FILES[$field];
if ($this->upload_file['tmp_name'] == ""){
$this->setError(Language::get('cant_find_temporary_files'));
return false;
}
//對上傳檔案錯誤碼進行驗證
$error = $this->fileInputError();
if (!$error){
return false;
}
//驗證是否是合法的上傳檔案
if(!is_uploaded_file($this->upload_file['tmp_name'])){
$this->setError(Language::get('upload_file_attack'));
return false;
}
//驗證檔案大小
if ($this->upload_file['size']==0){
$error = Language::get('upload_file_size_none');
$this->setError($error);
return false;
}
if($this->upload_file['size'] > $this->max_size*1024){
$error = Language::get('upload_file_size_cant_over').$this->max_size.'KB';
$this->setError($error);
return false;
}
//檔案字尾名
$tmp_ext = explode(".", $this->upload_file['name']);
$tmp_ext = $tmp_ext[count($tmp_ext) - 1];
$this->ext = strtolower($tmp_ext);
//驗證檔案格式是否為系統允許
if(!in_array($this->ext,$this->allow_type)){
$error = Language::get('image_allow_ext_is').implode(',',$this->allow_type);
$this->setError($error);
return false;
}
//設定路徑
$this->save_path = $this->setPath();
//設定檔名稱
if(empty($this->file_name)){
$this->setFileName();
}
//是否立即彈出錯誤
if($this->if_show_error){
echo "<script type='text/javascript'>alert('". ($this->if_show_error_one ? $error : $this->error) ."');history.back();</script>";
die();
}
if ($this->error != '') return false;
//上傳本地或者upyun
//if($target=='upyun'){
//require_once(BASE_DATA_PATH.'/resource/upyun/upyun.class.php');
//$upyun=new Upyun(C('bucket'),C('user_name'),C('pwd'));
//$opts = array(
//UpYun::X_GMKERL_THUMBNAIL => 'thumbtype'
//);
//$this->img_url=DS.$this->save_path.DS.$this->file_name;
//$fh = fopen($this->upload_file['tmp_name'], 'rb');
//$result = $upyun->writeFile($this->img_url,$fh, True, $opts); // 上傳圖片,自動建立目錄
//fclose($fh);
// $this->assertTrue(is_array($result));
//return 1;
//}else{
if(@move_uploaded_file($this->upload_file['tmp_name'],BASE_UPLOAD_PATH.DS.$this->save_path.DS.$this->file_name)){
//刪除原圖
if ($this->ifremove && is_file(BASE_UPLOAD_PATH.DS.$this->save_path.DS.$this->file_name)) {
@unlink(BASE_UPLOAD_PATH.DS.$this->save_path.DS.$this->file_name);
}
return true;
}else {
$this->setError(Language::get('upload_file_fail'));
return false;
}
//}
//$this->setErrorFileName($this->upload_file['tmp_name']);
return $this->error;
}