微信小程序中如何上传和下载文件
.wxml
<button bindtap="chooseFile">选择文件</button> <view>请输入下载链接</view>
<input bindinput="getContent"></input>
<button bindtap="downLoad">下载</button>
.js
Page({
chooseFile(){ //上传文件
var that=this
wx.chooseMessageFile({
count: 1,
type: 'all',
success (res) {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFiles
console.log(tempFilePaths[0])
that.upload(tempFilePaths[0].path,tempFilePaths[0].name)
}
})
}, upload(tmpFile,updFile){ //修改
wx.cloud.uploadFile({
cloudPath: updFile, //修改
filePath: tmpFile, // 文件路径
success: res => {
// get resource ID
console.log("上传成功",res)
},
fail: err => {
// handle error
console.log("上传失败",err)
}
})
}, //下载并打开文件 getContent(e){
console.log(e.detail.value)
this.setData({
fileID:e.detail.value
})
},
downLoad(){
var fileID
fileID=this.data.fileID
console.log("下载链接为:",fileID)
wx.cloud.downloadFile({
fileID: fileID,
success: res => {
// get temp file path
console.log("下载成功",res)
const filePath = res.tempFilePath //新增
wx.openDocument({ //新增加
filePath: filePath, //新增加
success: function (res) { //新增加
console.log('打开文档成功') //新增加
}
}) },
fail: err => {
// handle error
console.log("下载失败",res)
}
})
}, })
微信小程序中如何上传和下载文件的更多相关文章
- 微信小程序中图片上传阿里云Oss
本人今年6月份毕业,最近刚在上海一家小公司实习,做微信小程序开发.最近工作遇到一个小问题. 微信小程序图片上传阿里云服务器Oss也折腾了蛮久才解决的,所以特意去记录一下. 第一步:配置阿里云地址: 我 ...
- 微信小程序多张图片上传
微信小程序上传图片每次只能上传一张,所有很多朋友就会问想要多张图片上传怎么办? 首先,我们来看一看wx.chooseImage(object)和wx.uploadFile(OBJECT)这两个个api ...
- [转]微信小程序实现图片上传功能
本文转自:http://blog.csdn.net/feter1992/article/details/77877659 前端: 微信开发者工具 后端:.Net 服务器:阿里云 这里介绍微信小程序如何 ...
- nodeJs实现微信小程序的图片上传
今天我来介绍一下nodejs如何实现保存微信小程序传过来的图片及其返回 首先wx.uploadFile绝大部分时候是配合wx.chooseImage一起出现的,毕竟选择好了图片,再统一上传是实现用户图 ...
- 微信小程序实现图片上传功能
前端: 微信开发者工具 后端:.Net 服务器:阿里云 这里介绍微信小程序如何实现上传图片到自己的服务器上 前端代码 data: { productInfo: {} }, //添加Banner bin ...
- 微信小程序--实现图片上传
前端: 微信开发者工具 后端:.Net 服务器:阿里云 这里介绍微信小程序如何实现上传图片到自己的服务器上 前端代码 data: { productInfo: {} }, //添加Banner bin ...
- [组件封装]微信小程序-图片批量上传照片墙
描述 批量上传图片, 可设置最大上传个数, 可删除, 可设置默认值. 效果 源码 pictures-wall.wxml <view class="picturesWall"& ...
- 微信小程序 多图上传解决方案
为了使代码体积小 我这里将多图上传 封装到单独的一个js 页面的js调用他 我们看firhealth.js文件内容 // pages/home/home.js var upload = requir ...
- 微信小程序多图上传/朋友圈传图效果【附完整源码】
效果图 部分源代码 js文件: var uploadPicture = require('../Frameworks/common.js') //获取应用实例 const app = getApp() ...
- 微信小程序wx.uploadFile 上传文件 的两个坑
fileUpload: function (tempFilePath) { var that = this;//坑1: this需要这么处理 wx.uploadFile({ url: url地址, / ...
随机推荐
- 0xc0000142怎么修复
0xc0000142怎么修复 参考链接 https://jingyan.baidu.com/article/4d58d54102f3d29dd4e9c0b1.html
- Access denied You do not have access to chat.openai.com. The site owner may have set restrictions that prevent you from accessing the site.解决办法
报错 Access denied You do not have access to chat.openai.com. The site owner may have set restrictions ...
- LaTex【八】latex公式不自动编号
latex使用 \begin{equation} 编辑公式时,会自动为公式进行编号 如果需要取消自动编号,只需要在公式后加上 \nonumber 命令即可 例子 \begin{equation} \b ...
- 2019-2020-1 20199318《Linux内核原理与分析》第十二周作业
<Linux内核原理与分析> 第十二周作业 一.预备知识 Set-UID 是 Unix 系统中的一个重要的安全机制.当一个 Set-UID 程序运行的时候,它被假设为具有拥有者的权限.例如 ...
- pgsql给表重命名
alter table "pavement_damage_dtl_temp" rename to "pavement_damage_dtl"; 搜索 复制
- 【七侠传】冲刺阶段--Day6
[七侠传]冲刺阶段--Day6 团队成员 20181221曾宇涛 20181202李祎铭 20181209沙桐 20181215薛胜瀚 20181216杨越麒 20181223何家豪 20181232 ...
- not eligible for getting processed by all BeanPostProcessors
描述 这个BUG大的起源是我上线以后,在后台看日志的时候发现一行奇怪的INFO日志: 2022-06-09 23:34:24 [restartedMain] [org.springframework. ...
- 【JavaScript】JS写法随笔(三) JS联动设置元素默认值
问题: 使用DOM获取元素后setAttribute("value", "1")在页面有修改此标签value的情况下,再次触发function发生不生效.无法修 ...
- #AI 绘图 #GitHub GitHub上这几个项目教你怎么用,让你成为神笔马良
1.前情提要 前两天在 GitHub Trending 上看到个利用 AI 自动给图片上色的项目(style2paints)火起来了. 在 AI 大行其道的时代,工程师们也开始思考如何用这项技术来解决 ...
- C#-读取写入Excel
/// <summary> /// 读取Excel文档 /// </summary> /// <param name="Path">文件名 ...