一、wxml文件

<!-- 上传、下载、打开文件一步执行 -->
<view class="handle">
<button bindtap="handleFile" type="primary">上传下载打开文件</button>
<text>实现文件的上传、下载、打开一步到位</text>
</view>

二、wxss文件

.handle{
margin: 200rpx 20rpx 0 20rpx;
text-align: center;
}

三、js文件

Page({
data:{
fileID :null
}, //功能:上传、下载、打开文件一气呵成
handleFile(){
//选择文件
let that = this
wx.chooseMessageFile({
count: 1,
type: 'all',
success (res) {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFiles
let tempFile = tempFilePaths[0]
that.uploadFile(tempFile.name,tempFile.path)
}
})
},
//上传文件
uploadFile(fileName,tempFile){
wx.cloud.uploadFile({
cloudPath:fileName,
filePath:tempFile,
})
.then(res=>{
console.log("文件上传成功",res);
//下载文件
wx.cloud.downloadFile({
fileID: res.fileID,
success: res => {
console.log("文件下载成功",res);
//打开文件
const filePath = res.tempFilePath
wx.openDocument({
filePath: filePath,
success: function (res) {
console.log('文件打开成功',res)
}
})
}
}) })
.catch(err=>{
console.log("文件上传失败",err);
}) }
})

四、实现效果

微信小程序云开发-云存储-上传、下载、打开文件文件(word/excel/ppt/pdf)一步到位的更多相关文章

  1. 微信小程序云开发-云存储-上传文件(word/excel/ppt/pdf)到云存储

    说明 word/excel/ppt/pdf是从客户端会话选择文件.使用chooseMessageFile中选择文件. 一.wxml文件 上传按钮,绑定chooseFile <!--上传文件(wo ...

  2. 微信小程序云开发-云存储-下载并打开文件文件(word/excel/ppt/pdf)

    一.wxml文件 1.写文本框,用来获取文件链接. 2.按钮,点击下载文件 <!-- 下载文件(word/excel/ppt/pdf等) --> <view class=" ...

  3. 微信小程序从零开始开发步骤(七)引入外部js 文件

    上一章讲到小程序页面的四种常见的跳转的方法,这一章写如何引入一个外部的js文件,既utils文件夹的用处,其实步骤很简单: 1:准备好外部想要引入的外部文件,命名为util.js,并且填充固定的文件内 ...

  4. 微信小程序 springboot nginx 做图片存储 上传 浏览

    微信小程序前端-springboot后端-nginx图片存储 前言 本人小白一名,这是第一次学习微信小程序,特此做个记录. 首先准备nginx做图片存储 选择一个地址存放图片 #我的地址 [root@ ...

  5. 微信小程序选择视频,视频上传,视频播放

    请查看链接地址看具体详情: 选择视频: https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-video.html#wxchoosevideoobje ...

  6. 微信小程序踩坑日记3——上传照片至服务器

    0. 引言 主要解决将小程序端获取的图片保存在服务器上.亲测可用的服务端脚本. 1. 获取照片 通过wx.chooseImage()方法,获取到图片,使用wx.uploadFile()上传图片. wx ...

  7. 微信小程序从零开始开发步骤(八)引入框架WeUI

    首先来看下WeUI的官方介绍: WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一.在微信小程序的开发过程中,涉及到的前端 ...

  8. 微信小程序从零开始开发步骤(六)4种页面跳转的方法

    用法:用于页面跳转,相当于html里面的<a></a>标签. API教程:https://mp.weixin.qq.com/debug/wxadoc/dev/component ...

  9. 微信小程序从零开始开发步骤(五)轮播图

    上一章完成页面自定义分享,这一章来说说轮播图,最常见的一个轮播图,中间带小圆点,自动轮播. Swiper是滑动特效插件,面向手机.平板电脑等移动终端.能实现触屏焦点图.触屏Tab切换.触屏多图切换等常 ...

随机推荐

  1. MLIR多级中间表示概述

    MLIR多级中间表示概述 MLIR项目是构建可重用和可扩展的编译器基础设施的一种新方法.MLIR旨在解决软件碎片化问题,改进异构硬件的编译,显著降低构建特定领域编译器的成本,并帮助将现有编译器连接在一 ...

  2. VB Aspose.Pdf 字体变小方格问题处理

    宋体是这样写的:SimSun原先以为是:宋体 先定义字体,在PDF中无法设置,这个找了很久,原来是使用:FontRepository.FindFont方式,这个坑了很久,很多都说是setFont,压根 ...

  3. python_appium 之使用Appium Inspector定位工具进行元素识别,编写验证demo

    一.前提条件 appium环境搭建完成,模拟器Genymotion 安装完成,且已经下载成功了模拟设备 二.元素识别操作步骤及demo 1.进入appium如下菜单 2.填写Desired Capab ...

  4. WordPress安装篇(3):用宝塔面板在Linux上安装WordPress

    前面的文章已经介绍了如何在Windows环境安装WordPress,这篇文章来介绍在Linux环境怎样快速安装WordPress.大家都知道,Linux系统相对于Windows系统而言占用资源更少.更 ...

  5. Redis 性能问题分析

    在一些网络服务的系统中,Redis 的性能,可能是比 MySQL 等硬盘数据库的性能更重要的课题.比如微博,把热点微博[1],最新的用户关系,都存储在 Redis 中,大量的查询击中 Redis,而不 ...

  6. 一款基于SpringBoot+SpringSecurity的后台管理系统,强烈推荐

    简介 Base Admin一套简单通用的后台管理系统,主要功能有:权限管理.菜单管理.用户管理,系统设置.实时日志,API加密,以及登录用户修改密码.配置个性菜单等. 技术栈 前端:Layui 后端: ...

  7. 合宙Luat | 电源设计——模块应用必看的2个要点

    在模块应用设计中,电源设计是很重要的一部分. 由于射频发射时,会在短时间有一个较大电流的突发脉冲.在突发脉冲阶段内,电源必须能够提供高的峰值电流,不然有可能会引起供电电压的跌落.   而很多初学的朋友 ...

  8. 「10.14」小P的2048(模拟)·小P的单调数列(性质,DP)·小P的生成树(乱搞)

    A. 小P的2048 模拟.....又没啥可说的,以后要认真打打模拟题了... B. 小P的单调数列 考场$n^2log(n)$的SB思路有人听吗 正解当然不是这样, 事实上我们每次选取的只有一段区间 ...

  9. 【题解】10-19秀秀的森林(forest)

    我恨秀秀倍增LCA+离线 (时光倒流) 题目 秀秀有一棵带n个顶点的树T,每个节点有一个点权ai-.有一天,她想拥有两棵树,于是她从T中删去了一条边.第二天,她认为三棵树或许会更好一些.因此,她又从她 ...

  10. CMD批处理(1)——批处理常用命令总结

    echo 打开回显或关闭回显功能,或显示消息.如果没有任何参数,echo命令将显示当前的回显设置. 命令格式1:echo [{on|off}] 命令格式2:echo [message]   例.在命令 ...