uniapp 图片上传 图片下载

4 篇文章 0 订阅

项目中需要实现一键分享的功能 把文字 图片保存到用户相册和剪切板

下载文件资源到本地

uni.downloadFile({
    url: 下载资源的url,
    success:(res=>{//成功是的回调

    }),
    fail:(err=>{//失败的回调
        
    })
})

将本地资源上传到开发者服务器,

uni.uploadFile({
    url:  //要上传到的服务器路径 项目中会给到
    filePath: //文件或是图片的路径
    success:(res=>{//成功是的回调

    }),
    fail:(err=>{//失败的回调
        
    })
})
具体代码

图片保存到用户相册

copyImage(imgs) {
			//循环遍历多张图片
			for (let img in imgs) {
				console.log(imgs[img]);
				//先把网络图片 临时文件路径
				uni.downloadFile({
                    // URL:图片的链接
					url: imgs[img],//http开头
					success: res => {
						if (res.statusCode == 200) {
							console.log('下载成功', res.tempFilePath);//_doc/
							//利用临时文件路径保存到本地
							uni.saveImageToPhotosAlbum({
								filePath: res.tempFilePath,
								success: res => {
									console.log('保存成功');
								}
							});
						}
					},
					fail: function(err) {
						console.log(err.errMsg);
					}
				});
			}
		},

从本地相册上传图片

1.从本地选择图片 图片路径 ——doc/
2.调用uni.uploadFile 转为网络路径 https://

uploadings(){
    uni.chooseImage({
        count:3//需要上传图片的个数 默认9,
        sizeType:['orihinal', 'compressed'],
        success:(res=>{
            const tempFilePaths=res.tempFilePaths
            uni.showToast({
                title:"正在上传"
            })
            // _doc路径转为https:
            tempFilePaths.forEach(item=>{
                console.log(this.commonUrl)
                uni.uploadFile({
                    url:this.commonUrl+'/app/common/uploadFile',图片上传的服务器地址
                    filePath: item,//文件路径
							name: 'file',
                    header:{
                        Authorization: uni.getStorageSync('token') || ''
                    },
                    success:(res=>{
                        const data = JSON.parse(res.data);
								console.log(data);
								if (data.status == 200) {
									this.feedbacks.imgUrls.push(data.data);
									uni.hideLoading();
								} else {
									uni.showToast({
										icon: 'none',
										title: res.data.error
									});
								}
                    })
                })
            })
        }),
        fail:(err=>{
            uni.hideLoading()
        })
    })

}
  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值