前端上傳excel文件 ,後臺java接收上傳到服務器指定位置,並插入數據到postgresql數據庫

效果圖:

思路:前臺 使用bootstrap-fileInput插件,將excel文件上傳到服務器對應地址,然後後臺java讀取服務器對應地址的這個excel文件,然後將數據上傳到數據庫(使用MyBatis框架

前端:

html代碼:

<input id="uploadFile" type="file" name='file'class='file' accept=".xls,.xlsx" 
data-show-upload="false" data-show-cancel="false" data-show-preview="false" >

bootstrap-fileInput初始化js代碼:

其中uploadUrl參數是後臺controller的方法地址

initFileUpload('uploadFile');
function initFileUpload(idName){
	$("#" + idName + "").fileinput({
	    language: 'zh', //設置語言
	    uploadUrl: '../../gis/poi/upload', //上傳的地址
	    allowedFileExtensions : ['xls', 'xlsx'],
	    uploadAsync : false,
	    browseOnZoneClick: true,
	    dropZoneEnabled : true,
	    showPreview : true,
	    enctype: 'multipart/form-data',
	    showCaption: true,//是否顯示標題
	    browseClass: "btn btn-primary", //按鈕樣式      
	    dropZoneEnabled: false,
	    showPreview: true,
	    uploadExtraData: function(type) {   //額外參數的關鍵點
            var obj = {};
            obj.type = $('input:radio[name="type"]:checked').val();
            return obj;
        },
	    previewFileIcon: "<i class='glyphicon glyphicon-king'></i>", 
	})
}

點擊上傳按鈕後 執行的js代碼

//出發fileInput上傳方法
$('#uploadFile').fileinput('upload');
			
//上傳成功回調方法
 $('#uploadFile').on('filebatchuploadsuccess', function(event, filestack, extraData) {
				 var data = filestack.response;
				 if (data.code == "200") {
                                    alert("上傳成功")
				    } 
			});


後端:

controller層:


	@PostMapping("/upload")
	@ResponseBody
	public Map<String, Object> upload(@RequestParam("file") MultipartFile file,HttpServletRequest request) {
		
		Map<String, Object> map = new HashMap<>();
		gisPoiService.importData(request,file);
		map.put("code",200);
		return map;
	}

 service實現層:

	/**
	 * 導入數據
	 * 
	 * @param id
	 * @return
	 */
	@Override
	public R importData(HttpServletRequest request, MultipartFile file) {
		List<String> lst = this.upLoadFile(request, file);
		this.insertData(request, lst);

		return CommonUtils.msg("導入完成");
	}



	// 上傳文件到服務器
	private List<String> upLoadFile(HttpServletRequest request, MultipartFile file) {
		List<String> lst = new ArrayList<String>();
		String fileName = file.getOriginalFilename();
		String[] sArray = fileName.split("\\.");

		Date dNow = new Date();
		SimpleDateFormat ft = new SimpleDateFormat("yyyyMMddHHmmss");
		String dt = ft.format(dNow);
		String uploadFileName = sArray[0] + "_" + dt + "." + sArray[1];
		String filePath = request.getServletContext().getRealPath("poiUploadedFile/") + uploadFileName;

		File dest = new File(filePath);
		try {
			file.transferTo(dest);
		} catch (IOException e) {
			
		}
		lst.add(filePath);
		lst.add(dt);
		return lst;
	}

        // 插入數據
	// 1.新建
	// 0.追加
	private void insertData(HttpServletRequest request, List<String> lst) {
		String strTime = lst.get(1);
		String strServerFilePath = lst.get(0);
		String type = request.getParameter("type");

		
		String tableName1 = this.getLatestVerisonName();
		this.batchSaveGisPoi(tableName1, strServerFilePath);
		
	}



/**
	 * 批量新增
	 * 
	 * @param gisPoi
	 * @return
	 */
	public R batchSaveGisPoi(String strTableName, String filePath) {
		int count = 0;
		List<GisPoiEntity> lstGisPoiEntity = this.readExcel(filePath);
		for (int i = 0; i < lstGisPoiEntity.size(); i++) {

			GisPoiEntity gispoi = lstGisPoiEntity.get(i);

			Map<String, Object> args = new HashMap<String, Object>();
			args.put("tabName", strTableName);
			args.put("name", addyinhao(gispoi.getName()));
			args.put("x", addyinhao(gispoi.getX()));
			args.put("y", addyinhao(gispoi.getY()));

			args.put("xzqdm", addyinhao(gispoi.getXzqdm()));
			args.put("xzqmc", addyinhao(gispoi.getXzqmc()));

			args.put("address", addyinhao(gispoi.getAddress()));
			args.put("city", addyinhao(gispoi.getCity()));
			args.put("typeName", addyinhao(gispoi.getTypeName()));

			count += gisPoiMapper.saveFromTable(args);
		}

		return CommonUtils.msg(count);
	}

實體entity層:

    實體層,我就不貼了, 貼出來的代碼的目的是爲了給大家有個參考,需要大家改一改,才能在自己的項目上使用的。

 

mapper層:

mapper.xml:

<insert id="saveFromTable" parameterType="hashmap" statementType="STATEMENT">
		INSERT INTO ${tabName} (
			name, 
			x, 
			y, 
			address, 
			city, 
			xzqmc, 
			xzqdm, 
			type
		)
		VALUES (
			${name}, 
			${x}, 
			${y}, 
			${address}, 
			${city}, 
			${xzqmc}, 
			${xzqdm}, 
			(select macro_id from sys_macro where sys_macro.name=${typeName})
		)
	</insert>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章