今天就跟大家聊聊有關怎么在ajax中通過調(diào)用springboot框架api傳輸文件,可能很多人都不太了解,為了讓大家更加了解,小編給大家總結(jié)了以下內(nèi)容,希望大家根據(jù)這篇文章可以有所收獲。
10年積累的網(wǎng)站設計、成都做網(wǎng)站經(jīng)驗,可以快速應對客戶對網(wǎng)站的新想法和需求。提供各種問題對應的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡服務。我雖然不認識你,你也不認識我。但先網(wǎng)站設計后付款的網(wǎng)站建設流程,更有玉泉街道免費網(wǎng)站建設讓你可以放心的選擇與我們合作。
首先是前臺頁面的代碼
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>test_api</title> <script type="text/javascript" src="jquery-1.7.2.js"></script> <script type="text/javascript"> function test(){ var obj = new Object; obj.name = $("#name").val(); obj.age = $("#age").val(); var file = document.getElementById("file").files[0]; var formData = new FormData(); formData.append("data",JSON.stringify(obj)); formData.append("file",file); $.ajax({ type:"post", url:"http://localhost:8187/test/upload", contentType:false, processData:false, data:formData, success:function(data){ alert(data.msg); } }); } </script> </head> <body> <div class=""> <table> <tr> <td>sCompany:</td> <td><input type="text" id="name" value="tom" /></td> </tr> <tr> <td>scardtype:</td> <td><input type="text" id="age" value="23" /></td> </tr> <tr> <td>file:</td> <td><input type="file" id="file" /></td> </tr> </table> <input type="button" onclick="test();" value="提交" /> </div> </body> </html>
程序入口類的代碼
package test; import javax.servlet.MultipartConfigElement; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; import org.springframework.boot.web.servlet.MultipartConfigFactory; import org.springframework.context.annotation.Bean; import org.springframework.web.servlet.config.annotation.CorsRegistry; import org.springframework.web.servlet.config.annotation.WebMvcConfigurer; import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; /** * Hello world! * */ @SpringBootApplication public class App { public static void main( String[] args ) { SpringApplication.run(App.class, args); } //設置ajax跨域請求 @Bean public WebMvcConfigurer corsConfigurer(){ return new WebMvcConfigurerAdapter(){ @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/**").allowedOrigins("*"); } }; } @Bean public MultipartConfigElement multipartConfigElement(){ MultipartConfigFactory factory = new MultipartConfigFactory(); //設置上傳文件大小限制 factory.setMaxFileSize("10MB"); //設置上傳總數(shù)據(jù)大小 factory.setMaxRequestSize("15MB"); return factory.createMultipartConfig(); } }
api代碼
package test.controller; import java.io.BufferedOutputStream; import java.io.File; import java.io.FileOutputStream; import java.util.HashMap; import java.util.List; import java.util.Map; import javax.servlet.http.HttpServletRequest; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import org.springframework.web.bind.annotation.RestController; import org.springframework.web.multipart.MultipartFile; import org.springframework.web.multipart.MultipartHttpServletRequest; import test.model.UploadInfo; import com.alibaba.fastjson.JSON; import com.alibaba.fastjson.JSONObject; @RestController @RequestMapping("/test") public class TestController { /** * 上傳文件 * @param req form請求 * @return json字符串 */ @RequestMapping(value="/upload", method=RequestMethod.POST) public String uploadFile(HttpServletRequest req){ // 返回結(jié)果用 json對象 JSONObject returnObj = new JSONObject(); //從請求中獲取請求的json字符串 String strData = req.getParameter("data"); //將獲取到的JSON字符串轉(zhuǎn)換為Imgidx對象 UploadInfo info = JSON.parseObject(strData, UploadInfo.class); //獲取上傳的文件集合 List<MultipartFile> files = ((MultipartHttpServletRequest)req).getFiles("file"); MultipartFile file = files.get(0); // 返回信息頭部 Map<String, String> header = new HashMap<String, String>(); header.put("code", "0"); header.put("msg", "success"); File file1234 = new File(file.getOriginalFilename()); //插入數(shù)據(jù)的影響的數(shù)據(jù)條數(shù) int result = 0; //將文件上傳到save if(!file.isEmpty()){ try{ byte[] arr = new byte[1024]; BufferedOutputStream bos = new BufferedOutputStream(new FileOutputStream(file1234)); bos.write(arr); bos.flush(); bos.close(); }catch(Exception e){ header.put("code", "-1"); header.put("msg", "errorMsg:" + e.getMessage()); } }else{ header.put("code", "-1"); header.put("msg", "errorMsg:上傳文件失敗,因為文件是空的"); } String returnStr = returnObj.toJSONString(header); return returnStr; } }
看完上述內(nèi)容,你們對怎么在ajax中通過調(diào)用springboot框架api傳輸文件有進一步的了解嗎?如果還想了解更多知識或者相關內(nèi)容,請關注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝大家的支持。
網(wǎng)站標題:怎么在ajax中通過調(diào)用springboot框架api傳輸文件
文章分享:http://chinadenli.net/article46/gicoeg.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站建設、云服務器、App設計、域名注冊、響應式網(wǎng)站、手機網(wǎng)站建設
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)