uni-app 拍照或从相册上传图片

超、凢脫俗 2024-04-18 22:39 81阅读 0赞

后台使用的是Java SSM框架

<template>
    	<view>
    		<view class="cu-bar bg-white margin-top">
    			<view class="action">
    				图片上传
    			</view>
    			<view class="action">
    				{
       {imgList.length}}/{
       {imgMaxNum}}
    			</view>
    		</view>
    		<view class="cu-form-group">
    			<view class="grid col-4 grid-square flex-sub">
    				<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
    					<image :src="imgList[index]" mode="aspectFill"></image>
    					<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
    						<text class='cuIcon-close'></text>
    					</view>
    				</view>
    				<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
    					<text class='cuIcon-cameraadd'></text>
    				</view>
    			</view>
    		</view>
    		<view class="cu-form-group upload-btn">
    			<button class="cu-btn block bg-blue margin-tb-sm lg">上传</button>
    		</view>
    	</view>
    </template>

@RequestMapping("uploadImgAPP")
    public String uploadImgAPP(@RequestParam("file") MultipartFile file,HttpServletRequest request){
    	String fileName = "";
    	if (file != null && !file.isEmpty()) {
    		try {
    			String targetSrc = request.getServletContext().getRealPath("/")+"files";
    			fileName = file.getOriginalFilename();
    			fileName = fileName.substring(fileName.lastIndexOf("."));
    			fileName = UUID.randomUUID().toString() + fileName;
    			File targetDir = new File(targetSrc);
    			if (!targetDir.exists()) {
    				targetDir.mkdirs();
    			}
    			File targetFile = new File(targetSrc, fileName);
    			if (targetFile.exists()) {
    				targetFile.delete();
    			}
    			file.transferTo(targetFile);
    		} catch (Exception e) {
    			e.printStackTrace();
    		}
    	}
    	return fileName;
    }