精华内容
下载资源
问答
  • uniapp上传附件
    千次阅读
    2021-09-15 13:48:31

    uniapp 实现表单中包括上传附件

    uniapp做的原生android开发,动态表单数据录入的时候有时候需要上传附件和拍照视频功能

    1.进行android平台的判断

    if (plus.os.name.toLowerCase() != "android") {
    	uni.showModal({
    		title: '提示',
    		content: '仅支持Android平台',
    		success: function(res) {}
    	});
    	return false
    }
    
    
    let main = plus.android.runtimeMainActivity();
    let Intent = plus.android.importClass("android.content.Intent");
    let fileIntent = new Intent(Intent.ACTION_GET_CONTENT)
    fileIntent.setType("*/*"); //无类型限制
    fileIntent.addCategory(Intent.CATEGORY_OPENABLE);
    main.startActivityForResult(fileIntent, 1);
    // 获取回调
    main.onActivityResult = function(requestCode, resultCode, data) {
    let Activity = plus.android.importClass("android.app.Activity");
    let ContentUris = plus.android.importClass("android.content.ContentUris");
    let Cursor = plus.android.importClass("android.database.Cursor");
    let Uri = plus.android.importClass("android.net.Uri");
    let Build = plus.android.importClass("android.os.Build");
    let Environment = plus.android.importClass("android.os.Environment");
    let DocumentsContract = plus.android.importClass("android.provider.DocumentsContract");
    let MediaStore = plus.android.importClass("android.provider.MediaStore");
    let contentResolver = main.getContentResolver()
    plus.android.importClass(contentResolver);
    // 返回路径
    let path = '';
    if (resultCode == Activity.RESULT_OK) {
    	let uri = data.getData()
    	if ("file" == uri.getScheme().toLowerCase()) { //使用第三方应用打开
    		path = uri.getPath();
    		return;
    	}
    	if (Build.VERSION.SDK_INT > Build.VERSION_CODES.KITKAT) { //4.4以后
    		path = getPath(this, uri);
    	} else { //4.4以下下系统调用方法
    		path = getRealPathFromURI(uri)
    	}
    	// 回调
    	let arr = path.split('/')
    	let fileName = arr[arr.length - 1]
    	that.files.push({
    		path: path,
    		name: fileName
    	})
    }
    // 4.4 以上 从Uri 获取文件绝对路径
    function getPath(context, uri) {
    	let isKitKat = Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT;
    	let scheme = uri.getScheme().toLowerCase()
    	if (isKitKat && DocumentsContract.isDocumentUri(context, uri)) {
    		/if (isExternalStorageDocument(uri)) {
    			let docId = DocumentsContract.getDocumentId(uri);
    			let split = docId.split(":");
    			let type = split[0];
    			// 如果是手机内部存储
    			if ("primary" == type.toLowerCase()) {
    				return Environment.getExternalStorageDirectory() + "/" + split[1];
    			} else {
    				return '/storage/' + type + "/" + split[1];
    			}
    		}
    		// DownloadsProvider
    		else if (isDownloadsDocument(uri)) {
    				let id = DocumentsContract.getDocumentId(uri);
    				let split = id.split(":");
    				return split[1]
    		}
    		// MediaProvider
    		else if (isMediaDocument(uri)) {
    			let docId = DocumentsContract.getDocumentId(uri);
    			let split = docId.split(":");
    			let type = split[0];
    			let contentUri = null;
    			if ("image" == type.toLowerCase()) {
    				contentUri = MediaStore.Images.Media.EXTERNAL_CONTENT_URI;
    			} else if ("video" == type.toLowerCase()) {
    					contentUri = MediaStore.Video.Media.EXTERNAL_CONTENT_URI;
    			} else if ("audio" == type.toLowerCase()) {
    					contentUri = MediaStore.Audio.Media.EXTERNAL_CONTENT_URI;
    			}
    			let selection = "_id=?";
    			let selectionArgs = [split[1]];
    			return getDataColumn(context, contentUri, selection, selectionArgs);
    		}
    	}
    	// MediaStore (and general)
    	else if ("content" == scheme) {
    			return getDataColumn(context, uri, null, null);
    	}
    	// File
    	else if ("file" == scheme) {
    		return uri.getPath();
    	}
    }
    // 4.4 以下 获取 绝对路径
    function getRealPathFromURI(uri) {
    	let res = null
    	let proj = [MediaStore.Images.Media.DATA]
    	let cursor = contentResolver.query(uri, proj, null, null, null);
    	if (null != cursor && cursor.moveToFirst()) {
    		let column_index = cursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA);
    		res = cursor.getString(column_index);
    		cursor.close();
    	}
    	return res;
    }
    
    // 通过uri 查找出绝对路径
    function getDataColumn(context, uri, selection, selectionArgs) {
    	let cursor = null;
    	let column = "_data";
    	let projection = [column];
    	cursor = contentResolver.query(uri, projection, selection, selectionArgs, null);
    	if (cursor != null && cursor.moveToFirst()) {
    		let column_index = cursor.getColumnIndexOrThrow(column);
    		return cursor.getString(column_index);
    	}
    }
    
    function isExternalStorageDocument(uri) {
    		return "com.android.externalstorage.documents" == uri.getAuthority() ? true : false
    }
    
    function isDownloadsDocument(uri) {
    		return "com.android.providers.downloads.documents" == uri.getAuthority() ? true : false
    }
    function isMediaDocument(uri) {
    		return "com.android.providers.media.documents" == uri.getAuthority() ? true : false
    }
    
    

    转化base64

    handControllGetBase64(file, callback) {
    //h5不可用
    uni.saveFile({
    	tempFilePath: file,
    	success: (saveFile) => {
    		//pathToBase64为uniapp 插件市场的插件内方法
    		pathToBase64(saveFile.savedFilePath).then(base64 => {
    			//用完就删
    			uni.removeSavedFile({
    				filePath: saveFile.savedFilePath
    			});
    			//返回
    			callback(base64);
    		})
    	},
    	fail: (err) => {
    		console.log(err)
    	}
    });
    },
    

    附件的预览

    // 附件预览
    previewFile(obj) {
    	let that = this
    	let path = ''
    	if (obj.path) {
    		uni.openDocument({
    			filePath: obj.path,
    			success(res) {},
    			fail(res) {
    				uni.showToast({
    					title: '无法打开的文件类型'
    				})
    			}
    		})
    	} else {
    		let path = ''
    		let url = ‘xxx’
    		uni.downloadFile({
    			url: url,
    			header: {
    				'Content-Type': 'application/json',
    				'Accept': 'application/json',
    				'charset': 'UTF-8'
    			},
    			success: function(res) {
    				if (res.statusCode == 200) {
    					path = res.tempFilePath;
    					uni.openDocument({
    						filePath: path,
    						success(res) {},
    						fail(res) {
    							uni.showToast({
    								title: '无法打开的文件类型',
    								icon: 'none'
    							})
    						}
    					})
    				} else {
    					uni.showToast({
    						title: '下载附件失败',
    						icon: 'none'
    					})
    				}
    			}
    		})
    	}
    },
    
    更多相关内容
  • 2.在上传的方法中通过uniapp的chooseImage方法获取上传文件的名字和路径 3.调用uniapp的uploadFile的方法 通过访问后台完成上传上传文件 上传后台代码: 二、文件下载 在文件下载的时候遇到一个问题,由于我开发...

    一、文件上传
    1.首先写一个button通过click触发上传方法
    在这里插入图片描述
    2.在上传的方法中通过uniapp的chooseImage方法获取上传文件的名字和路径
    在这里插入图片描述

    3.调用uniapp的uploadFile的方法 通过访问后台完成上传上传文件
    在这里插入图片描述

    上传后台代码:
    在这里插入图片描述

    二、文件下载
    在文件下载的时候遇到一个问题,由于我开发的环境是H5的 所以这里不能使用uniapp 的dowloadFiled 和 SaveFiled 的方法 这里我会贴出这两种实现方法
    1.第一种比较简单直接通过vue上传文件的方式进行下载
    在这里插入图片描述

    2.通过点击事件触发下载事件的方法
    在这里插入图片描述

    此下载的原理是:前端最终拿到的是二进制流,拿到二进制流之后,把这个流构造成文件,然后构造创建一个a标签,用代码去点击这个a标签
    3.第二种就是uniapp的下载(此方法适用app,wx不适用于H5)
    在这里插入图片描述

    此方法可以通过downloadTask方法监听随时停止下载(代码就不贴了,可以百度搜到的)
    4.最后贴一下下载文件的后台代码
    在这里插入图片描述

    展开全文
  • uniapp实现上传文件功能,uniapp实现上传文件功能uniapp实现上传文件功能uniapp实现上传文件功能uniapp实现上传文件功能uniapp实现上传文件功能
  • uniapp上传

    千次阅读 2021-12-09 15:58:56
    附件上传,图片上传,视频上传应该是目前手机比较常见的功能,但是对于上传还是有一些需要注意 上传 - 一般有图片上传附件视频 图片上传 图片的上传 - 直接动手机或者摄像头 官网地址: uni-app官网 ...

    hello,我又要细说uniapp了

    附件上传,图片上传,视频上传应该是目前手机比较常见的功能,但是对于上传还是有一些需要注意

    上传 - 一般有图片上传,附件视频

    图片上传

    图片的上传 -  直接动手机或者摄像头

    官网地址:

    uni-app官网

    附件或者视频

    官网:

    uni-app官网

    注意 - 微信小程序和app是不支持这个api的 - 对于微信小程序wx.chooseMessageFile(可以从微信聊天会话中进行选择

    关于app的上传附件,可以利用原生进行,这篇文章中有记录uniapp实现常用功能_哆来A梦没有口袋的博客-CSDN博客_uniapp常用功能

    选择完之后就是上传,uniapp有自己的上传

    上传 

    uni-app官网

    上传也很好理解,都有案例,如果要上传自己的参数,可以写在formData里面

    其实写这篇文章主要不是讲这几个api,而是讲假设要自己上传附件给后端应该怎么做

    用post,上传base64给后端

    uni.getFileSystemManager() - 获取全局唯一的文件管理器,利用readFile方法进行转码

    要注意的是每个小程序有自己的规范

    uni-app官网

    写个案例

    uni.chooseImage({
    	count: 1,
    	success: (res) => {
    		 wx.getFileSystemManager().readFile({
    		 filePath: res.tempFilePaths[0],
    		 encoding: "base64",
    		 success: (result) => {
    				this.form[name] = 'data:image/png;base64,' + result.data;
    				this[name] = result.data;
    				this.$forceUpdate();
    					}
    				 })
    			}
    	})

    这个base64文件就是你要传给后端的图片了,

    关于上传多个图片给后端

    1,循环遍历用uniapp自己的upload方法

    2. 利用base64, 在一个接口上传多个图片给后端

    APP选择附件

     首先了解一下renderjs - uni-app官网

    使用这个是因为当时上传附件使用u-view上传附件,结果在h5可以上传附件,但是其实在app端是不支持上传图片的,但是做也没有注意,为了解决这个问题,就写了一个原生input来实现上传附件,

    其实uniapp是有上传的api的,但是刚好附件上传api只支持h5,也不支持app,

    上传附件组件

    <template>
    	<view :file="file" :change:file="uploadFile.changeFile" :randomID="randomID" :change:randomID="uploadFile.changeRandomID">
    		<view @click="uploadFile.addUpload" hover-class="slot-btn__hover" hover-stay-time="150">
    			<view> + </view>
    		</view>
    		<view id="upload-container" class="input" style="display: none;">
    			附件上传
    		</view>
    	</view>
    </template>
    
    <script>
    	import {
    		Config
    	} from '@/utils/config.js'
    	import {
    		UploadApi
    	} from '@/api/upload.js';
    	const uploadApi = new UploadApi();
    	export default {
    		name: 'uploadFile',
    		data() {
    			return {
    				file: '',
    				randomID: ''
    			}
    		},
    		methods: {
    			async upload(url) {
    				console.log('uplaidfIKE')
    				this.$emit('uploaded', url)
    			}
    		}
    	}
    </script>
    
    <script module="uploadFile" lang="renderjs">
    	import {
    		UploadApi
    	} from '@/api/upload.js';
    	const uploadApi = new UploadApi();
    	import {
    		Config
    	} from '@/utils/config.js';
    	const config = new Config();
    	let prefix = config.getImgPdfUrl();
    	var input;
    	export default {
    		data() {
    			return {
    
    			};
    		},
    		mounted(){
    			// 创建附件上传
    			input = document.createElement('input'); //创建元素
    			input.type = 'file' //添加file类型
    			input.onchange = (event) => {
    				// this.$ownerInstance.callMethod('submit', editor.txt.html())
    				uploadApi.uploadFileByJquery(input.files[0], 2).then(r => {
                        //this.$ownerInstance 获取当前组件的 ComponentDescriptor 实例
    					this.$ownerInstance.callMethod('upload', r)
    				})
    			}
    			document.getElementById('upload-container').appendChild(input)
    		},
    		methods: {
    			changeFile(newValue, oldValue, ownerVm, vm) {
    
    			},
    			changeRandomID(newValue, oldValue, ownerVm, vm) {
    			},
    			addUpload() {
    				input.click()
    			}
    		}
    	}
    </script>
    
    <style lang="scss">
    	.slot-btn {
    		width: 140rpx;
    		height: 140rpx;
    		display: flex;
    		justify-content: center;
    		// align-items: center;
    		line-height: 130rpx;
    		font-size: 60rpx;
    		background: rgb(244, 245, 246);
    		border-radius: 10rpx;
    	}
    
    	.slot-btn__hover {
    		background-color: rgb(235, 236, 238);
    	}
    </style>
    

    顺便贴一个封装的上传附件的代码

    import {
        Config
    } from '../utils/config.js'
    
    import $ from '@/js/jquery-3.4.1.min.js'
    
    
    class UploadApi {
        constructor() {}
    
        //obj为 u-upload控件 选择的文件返回 - obj.url
        // eg [{"url":"blob:http://localhost:8083/56d15704-2537-46fd-b188-fedfc2b8b35f","progress":0,"error":false,"file":{}}] 
        uploadFile(formData, obj) {
            return new Promise((resolve, reject) => {
                uni.uploadFile({
                    url: Config.getInstance().getBaseUrl() + '/api/common/upload.do',
                    filePath: obj.url,
                    name: 'file',
                    formData: formData,
                    success: res => {
                        const data = JSON.parse(res.data)
                        // console.log("上传文件返回 data:" + JSON.stringify(data))
                        if (data.code == "9000") {
                            resolve(data.data)
                            // console.log("上传文件返回 成功:" + data.data)
                        } else {
                            reject(data)
                            // console.log("上传文件返回 失败:" + JSON.stringify(data))
                        }
                    },
                    fail: (e) => {
                        console.log("上传文件fail返回:" + e)
                        reject(e)
                    }
                })
            })
        }
    
        /**
         * @param {File} file 文件对象
          * @param {Integer} fileType 1 图片 2 视频 
          * */
        uploadFileByJquery(file, fileType) {
            return new Promise((resolve, reject) => {
                var formData = new FormData();
                formData.append("file", file); //上传一个files对象
                formData.append("fileType", fileType); //需要上传的多个参数
                $.ajax({
                    url: Config.getInstance().getBaseUrl() + '/api/common/upload.do',
                    type: "post",
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function(res) {
                        resolve(res.data);
                    },
                    error: function(err) {
                        reject("网络连接失败,稍后重试", err);
                    }
    
                })
            })
        }
    
        /// 上传多图
        uploadFiles(formData, objs) {
            let num;
            if (objs) {
                num = objs.length;
            }
    
            return new Promise(async (resolve, reject) => {
                let queue = new Array()
                try {
                    for (let i = 0; i < num; i++) {
                        console.log(objs[i], 'sss ,i ');
                        let data = await this.uploadFile(formData, objs[i]);
                        queue.push(data)
                    };
                    // resolve(queue.join(','))
                    resolve(queue)
                } catch (e) {
                    reject(e)
                }
            })
        }
    }
    
    
    export {
        UploadApi
    }
    

    除了上传,一定还有回显,预览图片和附件,一定要记得地址要正确,不然会显示失败

    import {
    	Config
    } from '@/utils/config.js';
    const config = new Config();
    
    export function searchPdf(url) {
    	let allUrl = url.replace("\\", "\/");
         if(!url.includes('http')) {
    		 allUrl = config.getImgPdfUrl() + allUrl;
    	 }
    	 console.log("allUrl: ",allUrl);
    	if (url.includes('jpeg') || url.includes('jpg') || url.includes('png')) {
    		console.log(allUrl, 'ALLImag')
    		uni.previewImage({
    			urls: [allUrl],
    			fail: () => {
    				console.log("预览图片失败", JSON.stringify(err))
    				uni.showToast({
    					title: '预览图片失败',
    					icon: 'none'
    				});
    			},
    			success(index, tapIndex) {
    				console.log("预览图片成功", index, tapIndex)
    			}
    		});
    		return
    	} else {
    		uni.showLoading({
    			title: '正在打开,请等待'
    		});
    		uni.downloadFile({
    			url: allUrl,
    			fail: () => {
    				uni.hideLoading()
    				uni.showToast({
    					title: '预览文件失败',
    					icon: 'none'
    				});
    			},
    			success: function(res) {
    				console.log(res, 'res')
    				var filePath = res.tempFilePath;
    				console.log(filePath, 'folefasa',filePath)
    				uni.openDocument({
    					filePath: filePath,
    					success: function(res) {
    						console.log("预览文件成功", res)
    						uni.hideLoading();
    					},
    					fail(err) {
    						console.log("预览文件失败", err)
    						uni.hideLoading();
    						uni.showToast({
    							title: '预览文件失败',
    							icon: 'none'
    						});
    					}
    				});
    			},
    		})
    
    	}
    
    }
    
    

    码字不易,点个赞啊!

    展开全文
  • uni-app上传附件附件预览

    千次阅读 2021-11-23 17:14:59
    使用的插件链接:附件上传选择vue内嵌版lsj-upload - DCloud 插件市场 app端使用这个插件有点问题,所以把上传功能写到了一个跳转的页面才能触发上传功能 H5端不会有这个问题 示例代码 //附件页 <template>...

    效果图

     

     使用的插件链接:附件上传选择vue内嵌版lsj-upload - DCloud 插件市场

    app端使用这个插件有点问题,所以把上传功能写到了一个跳转的页面才能触发上传功能

    H5端不会有这个问题

    示例代码

    //附件页
    <template>
    	<view class="list1-con-t">																																
    		<view class="fu">
    			<view class="fulist" v-for="(item,index) in fuList" :key="item.id" @click="fuBtn(item)">
    				<view class="" >
    					{{item.originFileName}}
    				</view>
    				<view class="" @click.stop="delUserInfoAnnex(item)">
    					<u-icon name="close-circle"></u-icon>
    				</view>
    			</view>
    		</view>
    		<view class="btn" @click="accessory">
    			上传附件
    		</view>						
    	</view>	
    </template>
    
    <script>
    export default {
    	data() {
    		return {	
                userId:'',		
    			fuList: [],
    		}
    	},	
    	onLoad(options) {
    		this.userId = options.userId		
    	},
    	methods: {		
    		// 点击附件预览
    			fuBtn(e) {
    				console.log('点击附件',e);				
    				this.viewFile(e.filePath)
    			},
    			// 删除附件
    			delUserInfoAnnex(e) {				
    				this.$api.delUserInfoAnnex(e.id).then(res => {
    					console.log('删除',res);
    					this.getAnnexList(e.userID)
    				})
    				
    			},
    			viewFile(e) {
    				uni.downloadFile({
    				  url: this.baseUrl + e,
    				  success: function (res) {
    				    var filePath = res.tempFilePath;
    					console.log(res);
    				    uni.openDocument({
    				      filePath: filePath,
    				      showMenu: true,
    				      success: function (res) {
    				        console.log('打开文档成功');
    				      }
    				    });
    				  }
    				});
    			}		
    	}
    }
    </script>
    
    <style>
    	
    </style>
    
    //上传附件页
    <template>
    	<view class="content">				
    		<view class="main">
    			<lsj-upload
    			ref="lsjUpload"
    			width="100px"
    			height="80rpx"
    			childId="upload"
    			:size="10"
    			v-model="percent"
    			@input="onInput"								
    			@callback="onCallback">
    			    <view class="btn" style="height: 80rpx;">选择附件上传</view>
    			</lsj-upload>
    		</view>		
    	</view>
    </template>
    
    <script>
    export default {
    	data() {
    		return {			
    			percent: '',
    			userId: ''
    		}
    	},
    	onReady() {
    		// 初始化参数并创建上传DOM
    		this.onCreate();
    	},
    	onLoad(options) {
    		this.userId = options.userId		
    	},
    	methods: {		
    		onCreate() {
    			console.log('初始化附件插件');
    			// 初始化参数并创建上传DOM
    			this.$refs.lsjUpload.create({
    				// #ifdef APP-PLUS
    				cuWebview: this.$mp.page.$getAppWebview(), // app必传
    				// #endif
    				url: '', //替换为你的接口地址
    				name: 'file', // 附件key
    				size: 10, // 附件上传大小上限(M),默认10M
    				debug: true,
    				//根据你接口需求自定义请求头
    				header: {
    					'Authorization': `token`
    				},
    				//根据你接口需求自定义body参数
    				formData: {
    					'orderId': 1000
    				}
    			});
    		},
    		onInput(e) {
    			console.log('上传进度',e);
    		},
    		onCallback(e) {
    			consoel.log('上传结果',e)			
    		},		
    	}
    }
    </script>
    
    <style>
    	.content {
    		width: 100%;
    		height: 500px;
    		position: relative;
    	}
    	.main {
    		position: absolute;
    		top: 50%;
    		left: 50%;
    		transform: translateX(-50%);
    	}
    	.btn {
    		height: 80rpx;
    		background-color: #007AFF;
    		color: #fff;
    		border-radius: 10rpx;
    		display: flex;
    		align-items: center;
    		justify-content: center;
    		font-size: 28rpx;
    	}	
    </style>
    

    记录一下实用的功能

    展开全文
  • 其实这个 本来不应该在移动端上传,比如上传什么视频啊,.doc,.zip等文件的时候,应该是在pc端上传,uni.chooseImage 这个api 但是上传附件呢 这个api明显不行的呢。我们选择上传附件的时候 可以进行选择要支持的...
  • uniapp文件上传 uni-app系统目录文件上传(非只图片和视频)解决方案 永中云服务 1.0.1新版本已经发布〜 新版本基于永中云服务-云预览,完善并实现了跨平台H5文件(非只图片和视频)上传,。 参考技术文档 背景 公司...
  • uniapp 实现多个图片上传

    千次阅读 2021-07-07 21:48:52
    在用uniapp 编写程序时,遇到上传图片问题,可以使用 uniCould 的API uploadFile() 但是该接口一次只能上传一张图片,当需要上传多张照片时,就需要在其基础上进行改动,本文就是用自己的理解实现多张图片上传问题 ...
  • uniapp 上传文件封装
  • uniapp文件上传

    2021-07-15 15:38:51
    1、后台接口 /** ... @ApiOperation(value = "文件上传接口", notes = "支持批量上传") @ApiResponses({@ApiResponse(code = 400, message = "请求参数有误!"), @ApiResponse(code = 403, messa
  • uniapp前端单文件上传JAVA后台接收实现(亲测),还有单文件上传亲测哦,可以都看看,研究了一天,终于搞定,支持原创
  • uniapp上传文件

    千次阅读 2021-11-30 14:49:46
    上传附件</text> <uni-file-picker v-model="infos.pathList" file-mediatype="all" @select="select" @progress="progress" @s
  • fileStr_" @click="selectImage()" class="img-box fcjc tc"> <view> <view class="iconfont iconshangchuantupian f-999"></view> 上传图片</view> </view> </view> </view> <view v-if="multiple"> ...
  • }).catch(err=>{ uni.hideLoading() }) uni.uploadFile({ url: BASE_URL + options.url, // 服务器 url filePath: options.filePath, // 要上传文件资源的路径。 name: options.name || 'file...
  • uniapp上传视频图片、文件的组件
  • <template> <view> <template v-if="annexJson.length>0"> ...view class="contain" v-for="(item,index) in annexJson" :key="index">...image src="../../static/common/附件名称.pn
  • uniapp图片上传组件

    2022-04-11 10:55:42
    }, methods: { //上传图片 async chooseFile() { uni.chooseImage({ count: this.maxCount - this.imageList.length,//图片大于1可以多选,这样可以不超出最大上传值 sourceType: ['album'], success: (res) => { ...
  • uniapp上传本地文件

    千次阅读 2021-08-16 09:20:43
    uniapp如何将本地文件附件提交接口上传到服务器 使用 plus.io.resolveLocalFileSystemURL: 通过URL参数获取目录对象或文件对象 使用 plus.io.FileReader: 文件系统中的读取文件对象,用于获取文件的内容 使用 ...
  • uniapp多文件上传

    2022-05-07 10:05:36
    uniapp多文件上传
  • uniapp上传视频或图片(手写原生)

    千次阅读 2021-06-18 11:12:16
    图片视频上传代码: <template> <!-- 上传视频或者图片 --> <view class="up-page"> <!--图片--> <view class="show-box" v-for="(item,index) in imageList" :key="index"> ...
  • uniapp的官方文档和相关的教程案例都是用建议传图片的路劲,但是一些项目的特殊需求就需要传文件类型到后端。所以用filePath参数,这个参数拿到的是图片的路径所以会失败!!! 我们在控制台打印uni....
  • // 设置上传的额外参数 _this.formData = { key: _this.upFileName, // 上传后的文件名 policy: ossToken.policy, OSSAccessKeyId: ossToken.accessid, success_action_status: "200", //让服务端返回200,不然,...
  • uniapp中文件上传

    千次阅读 2021-03-09 18:04:30
    //图片上传 const uploadTask = uni.uploadFile({ url : url, filePath: tempFilePaths[0], name: ‘head_img’, success: function (uploadFileRes) { const back = JSON.parse(uploadFileRes.data); //图片显示...
  • uniapp上传文件到SpringBoot后台【完整代码】
  • == 'jpeg') { // uni.showToast({ // title: '请上传PNG、JPG、JPEG格式的图片', // icon: 'none', // duration: 3000 // }); // return; // } // ...
  • uniapp 同时上传文档或图片

    千次阅读 2020-08-15 18:40:37
    最近有个需求,需要在APP上传图片或文档,找了很多网上的资料,有插件市场大佬的付费插件。当然我希望大家知道我是个很穷的人,所以我决定自己研究能不能自己写出来,哈哈哈哈... 调用uniapp 官方上传方法 uni.uploadf
  • uniapp 文件分片上传

    2022-03-02 14:43:39
    分片上传</view> <view>上传进度{{percent}}%</view> <view v-if="fileurl">{{fileurl}}</view> </view> </template> <script> export defaul
  • 小程序附件上传并且名称回显

    千次阅读 2022-03-10 16:07:59
    小程序附件上传并且名称回显

空空如也

空空如也

1 2 3 4 5 ... 13
收藏数 252
精华内容 100
关键字:

uniapp上传附件