微信小程序保存图片到相册
先来看小程序中的保存图片到相册的api
wx.saveImageToPhotosAlbum({
filePath : "./test.png", //这个只是测试路径,没有效果
success(res) {
console.log("success");
},
fail : function(res) {
console.log(res);
}
})
上面的saveImageToPhotosAlbum的用法是不能获取到文件的,因为filePath在官方的说法是可以是临时文件路径或永久文件路径。
而"filePath : ./test.png"只是一个相对路径(相对小程序项目来说的一个路径),而我们需要的是临时文件路径或永久文件路径。
下面说一下三者的区别:
相对路径:小程序项目中相对的文件路径。
临时文件路径:从网络上下载或其他形式生成的文件,但是只保存在内存中,没有保存到小程序目录中的文件路径。
永久文件路径:小程序项目中文件中的全文件路径。
注:相对路径和永久文件路径可能是同一个文件,只是引用的路径名不一样而已(一个是相对的,一个是绝对的)。
其中临时文件路径我们可以这样获得来保存文件到相册:
wx.downloadFile({
url: 'https://example.com/audio/123', //仅为示例,并非真实的资源
success: function (res) {
// 只要服务器有响应数据,就会把响应内容写入文件并进入 success 回调,业务需要自行判断是否下载到了想要的内容
if (res.statusCode === 200) {
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success(res) {
wx.showToast({
title: '保存图片成功!',
})
},
fail(res) {
wx.showToast({
title: '保存图片失败!',
})
}
})
}
}
})
用downloadFile只可以获取网络上的图片资源;而getImageInfo则是全能类型,不管是网络上的图片资源,还是小程序中保存的图片。
官方上的说法:getImageInfo的src参数的图片路径可以是相对路径、临时文件路径、存储文件路径(即上面说的全路径)、网络图片路径。
wx.downloadFile({
url: 'https://example.com/audio/123', //仅为示例,并非真实的资源
success: function (res) {
// 只要服务器有响应数据,就会把响应内容写入文件并进入 success 回调,业务需要自行判断是否下载到了想要的内容
if (res.statusCode === 200) {
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success(res) {
wx.showToast({
title: '保存图片成功!',
})
},
fail(res) {
wx.showToast({
title: '保存图片失败!',
})
}
})
}
}
})
总结:wx.getImageInfo功能更加强大;但是downloadFile则更加专业,因为downloadFile可以读取下载进度等功能。
微信小程序保存图片到相册的更多相关文章
- 微信小程序 保存图片
微信小程序 保存图片 注: 此处使用的是小程序 wepy框架, 原生或其他的请注意转换写法 <div class="handle"> <button class= ...
- 微信小程序仿手机相册组件——简单版
仿手机相册的微信小程序组件,具备点击图片预览,长按图片出现多选框功能,读者可以根据自己的需求,依据现有数据进行删除等操作.话不多说,先看效果: 初始效果: 长按效果: 选择效果: 注意:当前只是简单 ...
- 微信小程序保存图片功能实现
小程序保存图片功能实现 wxml: <view class="previewImage" style="display:{{previewImage}}" ...
- 微信小程序保存图片的方法
1.xhtml代码 长按保存: <view class="img" catchlongpress='baocun'></view> 2.Js代码 baocu ...
- uniapp保存图片到本地(APP和微信小程序端)
uniapp实现app端和微信小程序端图片保存到本地,其它平台未测过,原理类似. 微信小程序端主要是权限需要使用button的开放能力来反复调起,代码如下: 首先是条件编译两个平台的按钮组件: < ...
- 微信小程序绘制分享图
微信小程序绘制分享图例子: demo下载地址:https://gitee.com/v-Xie/wxCanvasShar 大致代码会再以下说明 实际开发项目: 基础知识点: 了解canvas基础知识 w ...
- 微信小程序踩坑集合
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...
- 微信小程序学习指南
作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...
- 微信小程序学习记录(一)
如何定义一个全局变量: 1,在根目录下app.js中添加 App({ globalData: { g_isPlayingMusic : false, g_currentMusicPostId :nul ...
随机推荐
- Web开发问题记录
1.先说一个CSS的:CSS中带有中文(比如字体定义)的属性定义最好放在该选择器定义诸项的最后一条,为什么----编码格式问题. 2.其实自己也可以用自己写的DispatcherServlet+jsp ...
- PHP实现单例模式和观察者模式
单例模式的实现: PHP中单例模式常用在数据库连接部分,省掉了大量的new操作进而节省了很多资源.单例模式还可以用在全局配置类中. 单例模式,顾名思义就是说只有一个实例,这就要求防止外部随意实例化对象 ...
- SpringMVC配置多个数据源
多数据源,说白了,就是多数据库. 想要实现多数据库查询,只需简单四步即可实现! 第一步: 配置 jdbc.properties: # MySQL #========================== ...
- Tomcat PermGen space的解决方案
Tomcat报告 Caused by: java.lang.OutOfMemoryError: PermGen space异常 内存溢出PermGen space的全称是Permanent Gener ...
- 虚拟机配置Openstack常见问题汇总
之前配置了openstack,遇到一些问题,现在将问题全部汇总记录在这里. (1)问题:主机名字修改不了: 原因:没有进入root状态:或者没有正确打开文件,要打开的是/etc/hostname,结果 ...
- Python_数据整理与写入
''' 假设文件data.txt中有若干整数,整数之间使用英文逗号分隔.编写程序读取所有整数,将其按升序后再写入文本文件datta_asc.txt中 ''' import random countNu ...
- 使用C++实现图形的旋转、缩放、平移
编译环境:VS2017 编译框架:MFC 实验内容:显示一个三角形,并将其绕中心进行旋转.缩放以及平移等操作 实验步骤: 1.打开VS2017,并创建MFC项目,具体方法参见:http://www.c ...
- thymeleaf 货币格式化 数字格式化问题
格式化数字对象 ${'¥'+#numbers.formatDecimal(pro.price,0,'COMMA',2,'POINT')} ${'¥'+#numbers.formatDecimal(pr ...
- 3个简单CSS实现的动态效果
这里只是鼠标移入的时候出现的动态效果,并没有使用CSS的动画属性animation和变形属性transform.后面再补... HTML代码如下: <!DOCTYPE html><h ...
- Oracle 服务启动关闭
有没有感觉到,自从装上Oracle之后,电脑变卡了?卡是正常的,oracle作为大型数据库软件,运行起来是非常吃内存的. 所以对于自用的电脑来说,不使用Oracle的时候,应该把Oracle的一系列服 ...