# Niushop開源商城后臺上傳
---
### **1.引入上傳js文件**
```js
<script src="__STATIC__/js/ajax_file_upload.js" type="text/javascript"></script>
<script src="__STATIC__/js/file_upload.js" type="text/javascript"></script>
```
### **2. 前臺上傳表單，調用上傳事件**
```js
<div class="upload-btn-common">
<div>
<input class="input-file" name="file_upload" id="uploadTitleImg" type="file" onchange="imgUpload(this);" title="上傳">
<input type="hidden" id="title_img" value="">
</div>
<input type="text" id="text_title_img" class="input-common" readonly="readonly" value="">
<em>上傳</em>
<img id="preview_title_img" src="__STATIC__/blue/img/upload-common-select.png" data-src="" data-html="true" data-container="body" data-placement="top" data-trigger="manual" data-original-title="" title="">
</div>
<p class="hint">
建議使用<i class="important-note">寬200</i>像素-<i class="important-note">高60</i>像素內的<i class="important-note">GIF</i>或<i class="important-note">PNG</i>透明圖片
</p>
<p class="error">請上傳圖片</p>
```
```js
function imgUpload(event) {
var fileid = $(event).attr("id");
var data = {};
var id = $(event).next().attr("id");
var only_type = $(event).attr('only-type');
var url = "";
if(!only_type){
data.file_path = "cms_article_img";
url = __URL(ADMINMAIN + '/cms/uploadimage');
}else{
data.file_path = "cms_article_file";
url = __URL(ADMINMAIN + '/cms/uploadcompressedfile');
}
uploadFile({
url: url,
fileId: fileid,
data: data,
callBack: function (res) {
if(res.code){
$("#" + id).val(res.data.path);
$("#text_" + id).val(res.data.path);
$("#preview_"+ id).attr("data-src",__IMG(res.data.path));
showTip(res.message,"success");
}else{
showTip(res.message,"error");
}
}
});
}
```
### **3. 后臺配置上傳接收控制器方法,后臺base控制器定義了不同的上傳方法，包括：圖片，縮略圖，壓縮文件，其他文件，視頻**
```php
/**
* 圖片上傳
*/
public function uploadImage()
{
if (!empty($_FILES['file_upload'])) {
$file_path = request()->post("file_path", "common_image");
$upload = new Upload();
$result = $upload->image($_FILES["file_upload"], $file_path);
return json_encode($result);
}
}
/**
* 縮略圖上傳（根據設置不同的格式）
*/
public function uploadGoodsImage()
{
if (!empty($_FILES['file_upload'])) {
$file_path = request()->post("file_path", "common_image");
$thumb_type = request()->post("thumb_type", "");//縮略圖類型 big,mid,small,thumb
$upload = new Upload();
$result = $upload->image($_FILES["file_upload"], $file_path, $thumb_type);
return $result;
}
}
/**
* 壓縮包上傳
*/
public function uploadCompressedFile()
{
if (!empty($_FILES['file_upload'])) {
$file_path = request()->post("file_path", "common_zip");
$upload = new Upload();
$result = $upload->compressedFiles($_FILES["file_upload"], $file_path);
return json_encode($result);
}
}
/**
* 文件上傳
*/
public function uploadFile()
{
if (!empty($_FILES['file_upload'])) {
$file_path = request()->post("file_path", "common_file");
$upload = new Upload();
$result = $upload->file($_FILES["file_upload"], $file_path);
return json_encode($result);
if (request()->isAjax()) {
return $result;
} else {
return json_encode($result);
}
}
}
/**
* 上傳到相冊
*/
public function imageToAlbum()
{
if (!empty($_FILES['file_upload'])) {
$file_path = request()->post("file_path", "common_album");
$album_id = request()->post("album_id", 0);
$pic_id = request()->post("pic_id", 0);
$thumb_type = request()->post("thumb_type", "");//縮略圖類型 big,mid,small,thumb
$upload = new Upload();
$result = $upload->imageToAlbum($_FILES["file_upload"], $file_path, $thumb_type, [ 'album_id' => $album_id, 'pic_id' => $pic_id ]);
if (request()->isAjax()) {
return $result;
} else {
return json_encode($result);
}
}
}
/**
* 視頻上傳
*/
public function uploadVideo()
{
if (!empty($_FILES['file_upload'])) {
$file_path = request()->post("file_path", "common_album");
$upload = new Upload();
$result = $upload->video($_FILES["file_upload"], $file_path);
if (request()->isAjax()) {
return $result;
} else {
return json_encode($result);
}
}
}
```
```
```
