創(chuàng)建項目柠衅,然后在build.gradle中引入:
compile group: 'commons-fileupload', name: 'commons-fileupload', version: '1.3.3'
compile group: 'commons-io', name: 'commons-io', version: '2.5'
創(chuàng)建一個名為FileResource的域類(domain),用來保存文件信息
package com.system
/**
* 文件資源
*/
class FileResource {
//文件編號
String uuid
//原文件名
String oldName
//新文件名
String newName
//相對路徑
String relPath
//絕對路徑
String absolutePath
FileResource(String oldName, String newName, String relPath, String absolutePath) {
this.uuid = UUID.randomUUID().toString()
this.oldName = oldName
this.newName = newName
this.relPath = relPath
this.absolutePath = absolutePath
}
static constraints = {
uuid unique: true
}
static mapping = {
version false
}
def beforeInsert() {
uuid = UUID.randomUUID().toString()
}
}
創(chuàng)建UploadController類
package com.system
import grails.converters.JSON
import grails.transaction.Transactional
class UploadController {
def index() {
}
@Transactional
def upload() {
def info = [result:false,msg: "文件上傳失敺舛稀萤悴!"]
try {
def file = request.getFile("file")
//原文件名
String oldName = file.getOriginalFilename()
//用時間戳作為新文件名
String newName = System.currentTimeMillis()+oldName.substring(oldName.lastIndexOf(".",oldName.length()-1))
//文件保存相對路徑
String path = "/upload"
//文件保存絕對路徑
String dirPath = request.getSession().getServletContext().getRealPath(path)
File saveFile = new File(dirPath)
if(!saveFile.exists()){
saveFile.mkdirs()
}
if(file){
//上傳文件
file.transferTo(new File(dirPath + File.separator + newName))
//文件上傳成功后访圃,文件信息錄入文件信息表
FileResource fr = new FileResource(oldName,newName,path,dirPath)
fr.save(failOnError:true,flash:true)
info.result = true
info.msg = "文件上傳成功理郑!"
}
} catch (e) {
log.error("文件上傳失敗,errorMsg={}",e)
}
//返回json
render info as JSON
}
}
我這里文件上傳插件用的layui2.0的攒钳,請到layui官網(wǎng):http://www.layui.com/自行下載帮孔,也可以用其他上傳插件 下載后雷滋,復(fù)制里面的layui到grails-app/assets/javascripts下面,目錄結(jié)構(gòu)如下:
├─grails-app
│ ├─assets
│ │ ├─images
│ │ │ └─skin
│ │ ├─javascripts
│ │ │ └─layui
│ │ │ ├─css
│ │ │ │ └─modules
│ │ │ │ ├─laydate
│ │ │ │ │ └─default
│ │ │ │ └─layer
│ │ │ │ └─default
│ │ │ ├─font
│ │ │ ├─images
│ │ │ │ └─face
│ │ │ └─lay
│ │ │ └─modules
│ │ └─stylesheets
在grails-app/views下面創(chuàng)建upload/index.gsp,頁面內(nèi)容:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>upload模塊快速使用</title>
<asset:stylesheet href="layui/css/layui.css"/>
</head>
<body>
<button type="button" class="layui-btn" id="fileUpload">
<i class="layui-icon"></i>上傳圖片
</button>
<asset:javascript src="layui/layui.js"/>
<script>
layui.use(['upload', 'layer'], function(){
var upload = layui.upload;
var layer = layui.layer;
//執(zhí)行實例
var uploadInst = upload.render({
elem: '#fileUpload' //綁定元素
,url: '${createLink(controller: "upload", action: "upload")}' //上傳接口
,done: function(res){
//上傳完畢回調(diào)
layer.msg(res.msg);
}
,error: function(){
//請求異巢怀牛回調(diào)
}
});
});
</script>
</body>
</html>
在grails-app/conf/application.yml最后面配置grails文件上傳限制大小(200M):
---
grails:
controllers:
upload:
maxFileSize: 2000000
maxRequestSize: 2000000```
到此配置已經(jīng)ok晤斩,啟動項目焕檬,訪問:[http://localhost:8080/upload/index](http://localhost:8080/upload/index)進行測試
注意事項:
1、如果不配置文件上傳大小限制澳泵,默認(rèn)限制大小為128kb实愚,超過就會報錯
2、頁面引入js和css方式最好用:
<asset:stylesheet href="xxx.css"></asset:stylesheet>
<asset:stylesheet src="xxx.js"></asset:stylesheet>
且一般css放head里面兔辅,js放前面