文件的上傳和下載
1->文件的上傳
文件的上傳,采用的是uploadify.js這個插件.
本事例實現的是上傳圖片文件,其他的文件上傳也一樣。
2->文件的下載
文件的下載有兩個實現的方式:
1->url路徑指向文件的路徑,瀏覽器自行下載。但此方法存在缺陷:圖片文件,text,pdf等文件會在瀏覽器中自動顯示,不會執行下載功能
2->使用beego帶有的下載方法,執行下載功能
3>新建一個fileopt.go控制器,具體代碼如下:
package controllers
import (
"fmt"
"strings"
"path"
"github.com/astaxie/beego"
)
type FileOptUploadController struct {
beego.Controller
}
//上傳下載文件的頁面
func (c *FileOptUploadController) Get() {
c.TplName = "fileopt.html"
}
//上傳文件
func (this *FileOptUploadController) Post() {
//image,這是一個key值,對應的是html中input type-‘file’的name屬性值
f, h, _ := this.GetFile("image")
//得到文件的名稱
fileName := h.Filename
arr := strings.Split(fileName, ":")
if len(arr) > 1 {
index := len(arr) - 1
fileName = arr[index]
}
fmt.Println("文件名稱:")
fmt.Println(fileName)
//關閉上傳的文件,不然的話會出現臨時文件不能清除的情況
f.Close()
//保存文件到指定的位置
//static/uploadfile,這個是文件的地址,第一個static前面不要有/
this.SaveToFile("image", path.Join("static/uploadfile",fileName))
//顯示在本頁面,不做跳轉操作
this.TplName = "fileopt.html"
}
//下載文件
type FileOptDownloadController struct {
beego.Controller
}
func (this *FileOptDownloadController) Get() {
//圖片,text,pdf文件全部在瀏覽器中顯示了,並沒有完全的實現下載的功能
//this.Redirect("/static/img/1.jpg", 302)
//第一個參數是文件的地址,第二個參數是下載顯示的文件的名稱
this.Ctx.Output.Download("static/img/1.jpg","tu1.jpg")
}
4>新建一個html頁面,名為fileopt.html,其代碼如下:
<!DOCTYPE html>
<html>
<head>
<title>首頁 - 用戶列表頁面</title>
<link rel="shortcut icon" href="/static/img/favicon.png" />
<link rel="stylesheet" href="/static/uploadify/uploadify.css" rel="stylesheet"/>
<script type="text/javascript" src="/static/js/jquery-2.1.1.min.js"></script>
<script src="/static/uploadify/jquery.uploadify.min.js"></script>
</head>
<body>
<!--上傳部分-->
<form method="POST" action="/Home/UploadFile" enctype="multipart/form-data">
<input type="file" name="image" id="file_upload">
<div id="imgdiv" style="display:none;">
</div>
</form>
<!--下載圖片-->
<button value="下載圖片" onclick="download()">下載圖片</button>
<!--JS部分-->
<script type="text/javascript">
//頁面的初始化
$(function () {
$("#file_upload").uploadify({ //綁定元素
'fileObjName':'image',//html input標簽的name屬性的值吧。
'debug':false,
'auto':true, //自動上傳
'multi':true,
'removeCompleted':false, //上傳完成以后是否保存進度條
'buttonText':'選擇文件',
'cancelImg':'/static/uploadify/uploadify-cancel.png',
'swf':'/static/uploadify/uploadify.swf', //必須設置 swf文件路徑
'uploader':'/Home/FileOpt', //必須設置,上傳文件觸發的url
'fileTypeDesc':'FileType',
'fileTypeExts':'*.jpg;*.jpge;*.gif;*.png;',
'multi':true,
'onUploadSuccess': function (file, data, response) {
$("#imgdiv").show();
var html='<image src="/static/uploadfile/'+file.name+'" style="height:150px;width:150px;margin:20px;"/>';
$("#imgdiv").append(html);
}
});
});
//下載圖片
function download(){
window.location.href="/Home/FileDown";
}
</script>
</body>
</html>
5>在路由中添加路由
package routers
import (
"secondweb/controllers"
"github.com/astaxie/beego"
)
func init() {
beego.Router("/", &controllers.MainController{})
beego.Router("/Home/PageData", &controllers.UserController{})
beego.Router("/Home/PageNextData", &controllers.YonghuController{})
beego.Router("/Home/Index", &controllers.PageController{})
beego.Router("/Home/EasyUI", &controllers.EasyUIController{})
beego.Router("/Home/EasyUIData", &controllers.EasyUIDataController{})
beego.Router("/Home/FileOpt", &controllers.FileOptUploadController{})
beego.Router("/Home/FileDown", &controllers.FileOptDownloadController{})
}
6>項目的結構如下:

7>執行的效果如下:
1->文件操作的頁面如下,路由如下:

2->點擊選擇文件按鈕,選擇需要上傳的圖片,點擊打開按鈕,效果如下:

3->點擊下載圖片按鈕,瀏覽器下載一張指定的圖片

8>下一章,將文件內容的讀取。
