layui(1.0.9)文件上傳upload,前后端的實例代碼
因為公司還在使用老版本的layui，文件上傳在新版本中全部重寫了，這里記錄下老版本layui的文件上傳。
前端代碼：（引入layui相關(guān)包）
<input type="file" lay-type="file" id="xxxxx" name="file" class="layui-upload-file">
這里可以參考layui官方文檔，有一點需要注意，name屬性是必需的，當你選擇好文件后，name屬性的值，會在后臺被相應(yīng)的參數(shù)接收。
如果你只寫了上面的代碼，會發(fā)現(xiàn)文件上傳的按鈕消失了。這很正常，因為框架就是這么設(shè)計的。
layui.upload({
url: '/pay_channel/upload'
,before: function(input){
//返回的參數(shù)item，即為當前的input DOM對象
$(input).after('<input type="hidden" name="mchId-file" value="11111"/>');
//layer.msg('文件上傳中',{zIndex:20180509});
}
,success: function(res){
if(res.code == 'success'){
layer.msg(res.message,{zIndex:20180510});
certLocalPath = res.filePath
}else{
layer.msg(res.message,{zIndex:20180510});
}
}
});
url是請求地址，必須是AJAX請求（POST），必須返回JSON，返回的數(shù)據(jù)在success中操作，以上代碼簡單易懂，不用照抄。
before是指在上傳請求進行之前，進行的一些操作，$(input).after('<input type="hidden" name="mchId-file" value="'+mchIdxx+'"/>');這段代碼是為了追加一個參數(shù)，參數(shù)名字位mchId-file，值為11111，所以后端接收會有兩個參數(shù)，file和mchId-file。
后端代碼：
@RequestMapping("/upload")
@ResponseBody
public String importFile(MultipartFile file, HttpServletRequest request) {
JSONObject object = new JSONObject();
try {
String mchId = request.getParameter("mchId-file");
String originalFilename = file.getOriginalFilename();
// String dirPath = System.getProperty("user.dir")+"/wx";
// String dirPath = this.getClass().getClassLoader().getResource("").getPath()+"wx";
String dirPath = "/xxxx/java/pay/wx/cert";
_log.info("證書上傳的文件目錄{}", dirPath);
String filePath = "/"+mchId+"_"+originalFilename;
boolean b = new File(dirPath).mkdirs();
file.transferTo(new File(dirPath + filePath).getAbsoluteFile());
object.put("filePath", filePath);
object.put("code", "success");
object.put("message", "文件上傳成功");
} catch (IOException e) {
e.printStackTrace();
object.put("code", "fail");
object.put("message", "文件上傳失敗");
}
return object.toJSONString();
}
獲得的file是MultipartFile類對象，org.springframework.web.multipart.MultipartFile
該對象可以獲取文件名字getOriginalFilename，獲取文件流getInputStream，傳輸?shù)搅硪粋€文件的方法transferTo等。
以上后端方法是將獲取到的文件，保存到另一個特別目錄中去。
再說幾句題外話：
String dirPath = System.getProperty("user.dir");//獲取項目地址根目錄，就是說你workspace中，該項目初始目錄。
String dirPath = this.getClass().getClassLoader().getResource("").getPath();//獲取項目resource目錄位置，即springboot中application.yml所在文件夾。
再windows中其實不需要寫盤符來表示這個目錄的絕對路徑，String dirPath = "/xxxx/java/pay/wx/cert";如果你項目在D盤，那絕對路徑就會變成D:/xxxx/java/pay/wx/cert,這樣就避免了服務(wù)器windows與linux的問題。
但有一點要注意：File file = new File(dirPath + filePath).getAbsoluteFile()，如果使用/開頭，需要用getAbsoluteFile()獲取到D:/xxxx/java/pay/wx/cert路徑的文件對象。
以上這篇layui(1.0.9)文件上傳upload,前后端的實例代碼就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
Javascript 在瀏覽器中的性能問題，可能是最重要的可用性問題;Js的阻塞性 瀏覽器用單一進程來處理UI進程和Js的執(zhí)行;不管是內(nèi)嵌的還是外鏈的，下載并立即執(zhí)行 因為它有可能會修改頁面2012-12-12
插件：檢測javascript的內(nèi)存泄漏...2007-03-03
這篇文章主要為大家詳細介紹了js原生瀑布流插件制作，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
這篇文章主要介紹了js判斷元素是否隱藏的方法,需要的朋友可以參考下2014-06-06
這篇文章主要介紹了探索JavaScript中私有成員的相關(guān)知識，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，,需要的朋友可以參考下2019-06-06
這篇文章主要介紹了如何使用js實現(xiàn)瀏覽歷史記錄,需要的朋友可以參考下2014-04-04
這篇文章主要介紹了JavaScript 繪制餅圖的示例，幫助大家更好的利用JavaScript繪制圖表，感興趣的朋友可以了解下2021-02-02
今天小編就為大家分享一篇layui-select動態(tài)選中值的例子，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
js 獲取屏幕各種寬高的方法(瀏覽器兼容)，需要的朋友可以參考一下2013-05-05
這篇文章主要介紹了uniApp獲取當前位置經(jīng)緯度,以下是使用uni.getLocation獲取當前位置的示例代碼,需要的朋友可以參考下2024-01-01