微信小程序学习笔记之文件上传、下载操作图文详解
作者:李维山 发布时间:2023-09-07 21:13:21
标签:微信小程序,文件,上传,下载
本文实例讲述了微信小程序学习笔记之文件上传、下载操作。分享给大家供大家参考,具体如下:
前面介绍了微信小程序登录API与获取用户信息操作。这里再来介绍一下文件的上传与下载操作。
【文件上传】wx.uploadFile
(以上传图片为例)
后台上传接口Upload.php:(tp5)
<?php
namespace app\home\controller;
use think\Controller;
class Upload extends First
{
//上传图片API
public function upImg() {
$arr = array('state'=>0,'msg'=>'上传失败','filepath'=>'');
$file = request()->file('file');
if($file){
$info = $file->move('upload/weixin/');
if ($info) {
$arr['state'] = 1;
$arr['msg'] = '上传成功';
$arr['filepath'] = $info->getSaveName();
}
}
return json($arr);
}
}
前台页面upload.wxml:
<image src='{{imgpath}}' style='width:600rpx; height:600rpx' />
<view>
<button bindtap="upImg">点击选择上传图</button>
</view>
前台upload.js:
Page({
data: {
imgpath: ''
},
upImg: function (e) {
var that = this
wx.chooseImage({
count: 1, // 默认最多一次上传9张图片
sizeType: ['original', 'compressed'], // 允许原图和压缩图
sourceType: ['album', 'camera'], // 允许相册和相机
success(res) {
const tempFilePaths = res.tempFilePaths
wx.showToast({
title: '正在上传...',
icon: 'loading',
mask: true,
duration: 500
})
wx.uploadFile({
url: 'https://www.msllws.top/Upload/upImg', //服务器上传接口
filePath: tempFilePaths[0], //文件资源路径
name: 'file',
header: {
'Content-Type': 'Application/json'
},
success(res) {
console.log(res)
if (res.statusCode == 200){
that.setData({
imgpath: tempFilePaths
})
}
}
})
}
})
}
})
演示效果:
(其实是有正在上传...效果的,手机录屏没给录上。。)
嗯哼~
【文件下载】wx.downloadFile
(以下载一张图片为例)
在服务器目录下放一张图片1.jpg:
download.wxml:
<image src='{{imgpath}}' style='width:600rpx; height:600rpx' />
<view>
<button bindtap="download">点击下载</button>
</view>
download.js:
Page({
data: {
imgpath: ''
},
download: function (e) {
var that = this
wx.showToast({
title: '正在下载...',
icon: 'loading',
mask: true,
duration: 500
})
wx.downloadFile({
url: 'https://www.msllws.top/upload/1.jpg', //下载地址
type: 'image', //下载的资源类型(imnage/audio/video)
success: function (res) {
console.log(res)
if (res.statusCode == 200) {
var filepath = res.tempFilePath
that.setData({
imgpath: filepath
})
}
}
})
}
})
演示效果:
希望本文所述对大家微信小程序开发有所帮助。
来源:https://blog.csdn.net/msllws/article/details/82918970
0
投稿
猜你喜欢
- 为了更好的说明问题,首先引出下面的题目//请说明下面变量 a-d 的值 var a = [[1][1]]; var b = [['a
- $array=explode(separator,$string); $string=implode(glue,$array);使用和理解这
- 在SQL Server数据库中,有min server memory与max server memory两个内存选项。数据库管理员合理设置这
- 1.SQL Server对于SQL Server 2000来说,它提供了两个全新的函数(IDENT_CURRENT,SCOPE_IDENTI
- Rs.GetRows(N):N代表获取记录数量 Rs.GetRows(1):1表示只返回一行记录 Rs.GetRows(-1):-1表示默认
- 在Windows环境下,经常遇到系统Over的情况,如果你在新装了系统和SQL Server 2005后,需要把SQL Server2000
- 引言这算是一个高级用法了,前面我们只说到对类型、变量的几种反射的用法,包括如何获取其值、其类型、以及如何重新设置新值。但是在项目应用中,另外
- 原文:http://research.microsoft.com/~helenw/papers/subspace.pdfwindow.nam
- 注意: 在搭建网络的时候用carpool2D的时候,让高度和宽度方向不同池化时,用如下:nn.MaxPool2d(kernel_size=2
- ASP具备动态输出任一Office应用程序文件格式的功能。在开始编写代码之前,我们首先需要做的就是设置正确的文件类型,因为浏览器需要知道如何
- 原图代码 src = cv2.imread("28.png") gray_src = cv2.c
- 一直在期待这本书,一直希望国内能有一本正视WEB标准,并且全面阐述WEB标准书籍。而这本书是我觉得国内最全面的一本关于WEB标准的书籍,这本
- 随机显示图片代码:<div class="sidebarcen"><script language=&
- xmlhttp,IE不支持overrideMimeType()方法,即使是IE7。 // Mozilla/Safari/
- 07年,我是极力推崇网站规范制作,好处很多,对商业,对用户,对设计师。我们走了两年,现在有了一定的成效,我们也看到了规范所带来的好处和便利。
- 用ASP代码实现对access数据库的在线压缩处理,注意压缩前请备份数据库。我们知道每个一段时间压缩一下access数据库,可以减少数据库的
- 原作者:Jonathan 翻译:charlee原文:http://f6design.com/journal/2006/10/21/the-v
- 客户/服务器体系结构图形化的用户界面,使系统的管理更加直观和简单。丰富的编程接口,为用户进行应用程序设计提供了更大的选择余地。与Window
- 三遍记忆,让你记住海量素材的准确位置和用途,提高其可用性.这仅仅是一个示意图.在以往的日子里,我做到了只要脑袋里冒出一个想法,立刻就能知道我
- 在ASP.NET中使用js时,js获取DOM元素时,经常获取不到,这是因为获取的方法有误,现在介绍一方法,解决如何使用js获取ASP.NET