微信小程序开发之从相册获取图片 使用相机拍照 本地图片上传
1.index.wxml
<!--index.wxml-->
<button style="margin:30rpx;" bindtap="chooseimage">获取图片</button>
<image src="{{tempFilePaths }}" mode="aspecFill" style="width: 100%; height: 450rpx"/>
2.index.js
//index.js
//获取应用实例
var app = getApp()
Page({
data: {
tempFilePaths: ''
},
onLoad: function () {
},
chooseimage: function () {
var _this = this;
wx.chooseImage({
count: , // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
_this.setData({
tempFilePaths:res.tempFilePaths
})
}
})
}
})

这里说说sourcetype.默认是从相册获取和使用相机拍照,跟微信现在选择图片的界面一样,第一格是拍照,后面的是相册照片.
这里注意:返回的是图片在本地的路径.如果需要将图片上传到服务器,需要用到另一个API.
示例代码:
wx.chooseImage({
success: function(res) {
var tempFilePaths = res.tempFilePaths
wx.uploadFile({
url: 'http://example.weixin.qq.com/upload', //仅为示例,非真实的接口地址
filePath: tempFilePaths[],
name: 'file',
formData:{
'user': 'test'
},
success: function(res){
var data = res.data
//do something
}
})
}
})
微信小程序开发之从相册获取图片 使用相机拍照 本地图片上传的更多相关文章
- [转]微信小程序开发之从相册获取图片 使用相机拍照 本地图片上传
本文转自:http://blog.csdn.net/qq_31383345/article/details/53014610 今天遇到微信小程序的用户头像设置功能,做笔记. 先上gif: 再上代码: ...
- 微信小程序开发——点击按钮获取用户授权没反应或反应很慢的解决方法
异常描述: 点击按钮获取用户手机号码,有的时候会出现点击无反应或很久之后才弹出用户授权获取手机号码的弹窗,这种情况下,也会出现点击穿透的问题(详见:微信小程序开发——连续快速点击按钮调用小程序api返 ...
- 微信小程序开发之如何哪获取微信小程序的APP ID
微信小程序的开发工具,在新建项目的时候,默认提示填写APP ID,如果不填写AppID 也是可以本地测试和开发的,但是无法通过手机调试,只能在开发工具里查看 如果需要真机调试微信小程序,需要安装微信6 ...
- 【微信小程序开发】之如何获取免费ssl证书【图文步骤】
微信小程序要求所有网络请求都走ssl加密,因此我们开发服务端接口需要配置为https 这篇文章介绍一下如何 在 startssl 申请一个免费的ca证书. 1. 打开网站 https://www.s ...
- 微信小程序开发之修改和获取变量的值
在小程序开发过程中有两种变量,一种是定义在app,js里面的globalData定义的全局变量,另一种是在各个页面app,data里面的定义的变量. 一:全局变量的定义,获取值,赋值,修改 app.j ...
- 微信小程序开发(十一)获取手机的完整详细信息
// succ.wxml <view style='position:absolute; top:30%; left:35%;font-size:36rpx'>{{name}}:签到成功. ...
- 微信小程序开发(六)获取手机信息
// succ.js var app = getApp() Page({ data: { mobileModel: '', // 手机型号 mobileePixelRatio: '', // 手机像素 ...
- 微信小程序开发(十)获取手机的经纬度
// succ.wxml <view>经度:{{lon}}</view> <view>纬度:{{lat}}</view> // succ.js var ...
- 微信小程序开发(九)获取手机连接的wifi信息
// succ.wxml <view>WIFI ssid:{{wifissid}}</view> <view>WIFI bssid:{{wifiBssid}}< ...
随机推荐
- [Recompose] Add Local State to a Functional Stateless Component using Recompose
Learn how to use the 'withState' and 'withHandlers' higher order components to easily add local stat ...
- Android中常用的优秀开源框架
Android开源框架库分类,挑选出最常用,最实用的开源项目,本篇主要介绍的是优秀开源框架库和项目,UI个性化控件会独立介绍.UI个性化控件 Index Dependency Injections A ...
- java中的subString具体解释及应用
substring(參数)是java中截取字符串的一个方法 有两种传參方式 一种是public String substring(int beginIndex) 返回一个新的字符串,它是此字符串的一个 ...
- js课程 1-3 Javascript变量类型详解
js课程 1-3 Javascript变量类型详解 一.总结 一句话总结:js对象点(属性方法),json对象冒号(属性方法).属性和方法区别只有一个括号. 1.json对象中的函数的使用? 函数名 ...
- Cocos2d-x 3.2 Lua演示样例FontTest(字体測试)
Cocos2d-x 3.2 Lua演示样例FontTest(字体測试) 本篇博客介绍Cocos2d-x 3.2中Lua測试项目中的FontTest样例,主要使用了字体文件来创建我们想要的字体样式: 第 ...
- [TypeScript] Increase TypeScript's type safety with noImplicitAny
TypeScript tries to infer as much about your code as it can. But sometimes there really is not enoug ...
- HDU 1501 - dp
传送门 题目大意: 问两个词能不能加错拼成一个第三个词. 题目分析: dp方程还是很好想:dp[i][j]表示第一个词前i个和第二个词前j个能不能拼成第三个词的前i+j个. 初始化如果s1[1] == ...
- .net程序客户端更新方案
原文:.net程序客户端更新方案 客户端程序一个很大的不便的地方就是程序集更新,本文这里简单的介绍一种通用的客户端更新方案.这个方案依赖程序集的动态加载,具体方案如下: 将程序集存储在一个文件数据库中 ...
- [GeekBand] STL Traits 使用简介
本文参考文献::GeekBand课堂内容,授课老师:张文杰 :C++ Templates 15章节 :网络资料: http://blog.csdn.net/my_business/article/d ...
- sparksql load/save
java public class LoadAndSaveDemo { private static SparkConf conf = new SparkConf().setAppName(" ...