微信小程序保存图片到相册
先来看小程序中的保存图片到相册的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 ...
随机推荐
- ng-change事件中如何获取$event和如何在子元素事件中阻止调用父级元素事件(阻止事件冒泡)
闲聊: 今天小颖要实现一个当改变了select内容后弹出一个弹框,并且点击select父元素使得弹框消失,这就得用到阻止事件的冒泡了:$event.stopPropagation(),然而小颖发现,在 ...
- Oracle12c中多宿主容器数据库(CDBs)和可插拔数据库(PDBs)新特性之运行脚本
对开发者和DBA们来说,对shell脚本批量任务的影响成了多宿主选项带来的最大改变之一.因为多宿主环境通过服务来连接到可插拔数据库,因此,依靠CRON和OS认证成了换成多宿主环境后的一个最大问题.本文 ...
- Mina框架(实战详解)
Apache Mina Server 是一个网络通信应用框架,为开发高性能和高可用性的网络应用程序提供了非常便利的框架. 特点:异步的NIO框架,将UDP当成"面向连接"的协议 一 ...
- cxf webservice生成客户端代码及调用服务端遇到的问题
1. 从网上下载cxf开发的工具 apache-cxf-3.1.4.zip, 解压文件,找到apache-cxf-3.1.4\bin目录,里面包含一个wsdl2java文件 2. 设置环境变量 1. ...
- 关于ajax原理阐述
ajax是什么呢?说白了就是一个请求,一个读取服务器资源以及提交资源到服务器的中间处理机制,那它具体是怎样工作的,又有怎样的原理呢?var ajax=function(url,fnSucceed,fn ...
- Python_网页爬虫
import sys import multiprocessing import re import os import urllib.request as lib def craw_links( u ...
- 【转】利用 three.js 开发微信小游戏的尝试
前言 这是一次利用 three.js 开发微信小游戏的尝试,并不能算作是教程,只能算是一篇笔记吧. 微信 WeChat 6.6.1 开始引入了微信小游戏,初期上线了一批质量相当不错的小游戏.我在查阅各 ...
- element-ui bug及解决方案
1.element-ui 使用MessageBox后弹窗显示异常 解决方案:去掉Vue.use(MessageBox); 2.element-ui 分页切换后若改变总数会导致请求两次 解决方案:< ...
- 深入出不来nodejs源码-编译启动(1)
整整弄了两天,踩了无数的坑,各种奇怪的error,最后终于编译成功了. 网上的教程基本上都过时了,或者是版本不对,都会报一些奇怪的错误,这里总结一下目前可行的流程. node版本:v10.1.0. 首 ...
- phantomjs Can not connect to the Service phantomjs错误
尝试方法一: 打开hosts文件配置 cat /etc/hosts 添加 127.0.0.1 localhost 重新运行 尝试方法二: 1,抛开服务,直接调用phantomjs定位问题 由于我是从服 ...