详解微信小程序文件下载--视频和图片

2024-09-27 09:25:03

文件下载（遇到的坑）

1.要区分下载的内容是什么

0.1 图片下载wx.saveImageToPhotosAlbum(Object object)

0.2 视频下载wx.saveVideoToPhotosAlbum(Object object)

以上算是两大类

2.路径问题

图片文件路径，可以是临时文件路径或永久文件路径，不支持网络图片路径

不支持怎么处理需要使用

DownloadTask wx.downloadFile(Object object)

下载文件资源到本地。客户端直接发起一个 HTTPS GET 请求，返回文件的本地临时路径

也就是说通过Download把网络路径变成本地临时路径

3.我的代码（图片下载案例，视频的需要使用wx.saveVideoToPhotosAlbum）

 var url = '网络图片'
  wx.downloadFile({
   url: url, //下载资源的地址网络
   success: function (res) {
    //console.log(res)
    // 只要服务器有响应数据，就会把响应内容写入文件并进入 success 回调，业务需要自行判断是否下载到了想要的内容
    if (res.statusCode === 200) {
     wx.playVoice({
      filePath: res.tempFilePath
     })
    }
    // 保存图片到本地
    wx.saveImageToPhotosAlbum({
     filePath: res.tempFilePath,
     success:
      function (data) {
       //console.log(data);
       wx.showModal({
        title: '下载成功',
        content: '图片以保存至您的手机',
       })
      },
    })
   }
  })

以上所述是小编给大家介绍的微信小程序文件下载视频和图片详解整合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

微信小程序实现下载进度条的方法

我们经常会在APP下载中看到下载进度条,这个进度条是为了和用户交互,告知用户当前的进度,不然让用户一直处于等待,用户等超过1分钟就会崩溃的,今天代码君就教大家如何在小程序中也制作下载进度条 progress进度条是微信小程序的组件,和HTML5的进度条progress类似. progress属性介绍属性名作用参数值 percent 进度百分比0~100 show-info 在进度条右侧显示百分比 true/false 默认false active 进度条从左往右的动画 true/false
微信小程序实现点击按钮修改文字大小功能【附demo源码下载】

本文实例讲述了微信小程序实现点击按钮修改文字大小功能.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 index.wxml文件 <view class="view" style="font-size:{{fontSize}}pt">我是view标签</view> <button class="btn" type="default" bindtap="magnifyFontS
微信小程序实现点击按钮修改view标签背景颜色功能示例【附demo源码下载】

本文实例讲述了微信小程序实现点击按钮修改view标签背景颜色功能.分享给大家供大家参考,具体如下: 1.效果展示 2.操作步骤: ① 数据绑定view样式背景属性值 ② 通过逻辑文件设置该背景属性初始值 ③ 通过点击按钮修改背景属性值 3.关键代码 index.wxml文件: <view style="background:{{viewBg}};color:white;height:100px;">我是view标签</view> <button type=
微信小程序实现点击按钮修改字体颜色功能【附demo源码下载】

本文实例讲述了微信小程序实现点击按钮修改字体颜色功能.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 index.wxml文件 <view class="view" style="color:{{color}}">我是view标签</view> <view style="display:flex;"> <block wx:for="{{colorArray}}" wx:k
微信小程序实现动态改变view标签宽度和高度的方法【附demo源码下载】

本文实例讲述了微信小程序实现动态改变view标签宽度和高度的方法.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 index.wxml文件 <view class="view" style="width:{{view.Width}}px;height:{{view.Height}}px;" >我是view标签,我现在的宽度是{{view.Width}}px,高度是{{view.Height}}px</view> <inpu
微信小程序实现点击按钮移动view标签的位置功能示例【附demo源码下载】

本文实例讲述了微信小程序实现点击按钮移动view标签的位置功能.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 index.wxml文件 <view class="view" style="left:{{viewLeft}}px;">我是view标签</view> <button class="btn" type="default" bindtap="changeLocat
微信小程序省市区选择器实例详解(附源码下载)

微信小程序省市区选择器: 最近学习微信小程序,为了检验自己的学习效果,自己做一个小示例,网上搜索下类似的实例,发现这个更好,大家看下. 一.区域间手势滑动切换,标题栏高亮随之切换思路是:拿当前的current来决定高亮样式 1.监听swiper滚动到的位置: <swiper class="swiper-area" current="{{current}}" bindchange="currentChanged"> cu
微信小程序使用video组件播放视频功能示例【附源码下载】

本文实例讲述了微信小程序使用video组件播放视频功能.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 ① index.wxml 复制代码代码如下: <video src="../../pages/video/movie.mp4" binderror="videoErrorCallback"></video> ② index.js Page({ data:{ // text:"这是一个页面" }, vide
微信小程序实现动态设置页面标题的方法【附源码下载】

本文实例讲述了微信小程序实现动态设置页面标题的方法.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 ① WXML文件 <button bindtap="setBiaoTi1">标题1</button> <button bindtap="setBiaoTi2">标题2</button> <button bindtap="setBiaoTi3">标题3</button&g
微信小程序获取手机系统信息的方法【附源码下载】

本文实例讲述了微信小程序获取手机系统信息的方法.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 index.wxml布局文件代码 <view>手机型号:{{mobileModel}}</view> <view>手机像素比:{{mobileePixelRatio}}</view> <view>窗口宽度:{{windowWidth}}</view> <view>窗口高度:{{windowHeight}}</

详解微信小程序文件下载--视频和图片

相关推荐

随机推荐