2020年注定是不平庸的一年，一场冠状疫情的暴发，让人们忽然意识到生命的可贵，人们对生命从新有了新的意识。谱写了太多的悲伤，太多惆怅，太多的眼泪和辛酸。珍惜当下，敬畏生命，敬畏天然。
上面围绕这些标准写内容
- 文章的创新型
- 文章的实用性
- 代码的可借鉴性
- 代码的标准度
小程序云开发入门到实际：
wx.cloud.init({ // env 参数： // env 参数 // 小程序发动的云开发调用（wx.cloud.xxx）会默认申请到哪个云环境的资源 // 此处请填入环境 ID, 环境 ID 可关上云控制台查看 如不填则应用默认环境（第一个创立的环境） // env: 'my-env-id', traceUser: true,})wx.cloud.init({ env: 'da-da', traceUser: true,})云函数的配置与部署
1.下载安装node.js，node.js是在服务端运行JavaScript的运行环境，云开发所应用的服务端环境是node.js,npm是Node包管理器，通过npm能够不便的装置云开发所应用的依赖包。
node --versionnpm --version关上电脑终端（Windows电脑为cmd命令提示符，Mac电脑为终端Terminal）如果用淘宝镜像cnpm
sudo npm install -g cnpm --registry=https://registry.npm.taobao.orgcnpm --version上传到云存储的文件都有一个全网惟一的fileID，fileID只用于小程序外部，能够将fileID传入到SDK就能够对文件进行下载，删除，获取文件信息等操作，十分不便。
<image src="fileID"></image>体验一下函数的调用：
能够获取用户的openid，用户在小程序里有举世无双的openid，雷同的用户在不同的小程序openid也不同，因而咱们能够用openid来辨别用户，能够应用云函数的Cloud.getWXContext()来获取用户的openid
获取用户信息：
<button open-type="getUserInfo" bindgetuserinfo="onGetUserInfo" class="userinfo-avatar" style="background-image: url({{avatarUrl}})" size="default"></button>onLoad: function() { // 获取用户信息 wx.getSetting({ success: res => { if (res.authSetting['scope.userInfo']) { // 曾经受权，能够间接调用 getUserInfo 获取头像昵称，不会弹框 wx.getUserInfo({ success: res => { this.setData({ avatarUrl: res.userInfo.avatarUrl, userInfo: res.userInfo }) } }) } } })},onGetUserInfo: function(e) { if (!this.data.logged && e.detail.userInfo) { this.setData({ logged: true, avatarUrl: e.detail.userInfo.avatarUrl, userInfo: e.detail.userInfo }) }},小程序的open-data能够用于展现微信用户的信息，能够在miniprogram目录index文件夹下的index.wxml文件：
<open-data type="userAvatarUrl"></open-data><open-data type="userNickName"></open-data><open-data type="userGender" lang="zh_CN"></open-data><open-data type="userCity" lang="zh_CN"></open-data><open-data type="userProvince" lang="zh_CN"></open-data><open-data type="userCountry" lang="zh_CN"></open-data>学习小程序开发-云开发我感觉挺好，上面总结一下：
小程序是一种新的凋谢能力，开发者能够疾速地开发一个小程序，小程序能够在微信内被便捷地获取和流传，同时具备杰出的应用体验。
第一，速度快，无需下载安装，加载速度快于HTML5，微信登录，随时可用；第二，无需适配，一次开发，多端兼容，罢黜了对各种手机机型的适配；第三，反对间接或app分享给微信好友和群聊；第四，可达到近乎原生app的操作体验和晦涩度，在离线状态亦可应用；第五，用完即走，顺手可得，通过扫码，长按，微信搜寻，公众号，好友举荐等形式疾速获取服务，用完即走；第六，低门槛，已有公众号的组织可疾速注册，可疾速生成门店小程序。
小程序的技术倒退过程：
HTML5：能力很少；体验差；强烈依赖于开发者的素质
H5+JSSDK：无奈管控；平安问题；依赖开发者素质
小程序：强治理；对立开发体验
小程序语言：
渲染层：WXML+WXSS
逻辑层：JavaScript
配置：JSON
小程序设计标准：
敌对：重点突出，流程明确
清晰：导航明确，缩小期待，异样反馈
便捷：缩小输出，防止误操作，操作晦涩
对立：视觉对立，WeUI
小程序经营标准：
账号信息：名称形容清晰，与性能统一，资料实在
服务类目：类目与页面内容统一，便捷可用
性能：残缺可用，无举荐、排行榜，无搜寻小程序，不互推
数据：获取用户数据时需告知，不得私下收集用户数据
个别如果你关上一个小程序我的项目报错如下：
未找到入口app.json文件，或者文件读取失败，请查看后从新编译。
别怕是因为你须要理解小程序文件构造：
小程序蕴含一个形容整体程序的app和多个形容各自页面的page。
app.js是小程序逻辑，app.json是小程序公共设置，app.wxss是小程序公共样式表。
什么是组件，组件是以某种形式对业务逻辑和性能进行封装。
slot
component.wxml<!--组件模板--><view class="wrapper"> <view>组件的外部节点</view> <slot></slot></view>page.wxml// 援用组件的页面模板<view> <component-tag-name> <view>插入到组件slot中的内容</view> <component-tag-name></view>多slot
component.jsComponent({ options: { multipleSlots: true // 在组件定义时的选项中启用多slot反对 }, properties: { }, methods: { }})component.wxml// 组件模板<view class="wrapper"> <slot name="before"></slot> <view>组件的外部细节</view> <slot name="after"></slot></view>// 援用组件的页面模板page.wxml<view> <component-tag-name> // 这部分内容将被搁置在组件<slot name="before">的地位上 --> <view slot="before">这里是插入到组件slot name="before"中的内容</view> // 这部分内容将被搁置在组件<slot name="after">的地位上 --> <view slot="after">这里是插入到组件slot name="after"中的内容</view> </component-tag-name></view>说说云开发是什么？
云开发是微信团队联结腾讯云提供的原生Serverless云服务，致力于帮忙更多的开发者疾速实现小程序业务的开发，疾速迭代。
一行代码创立数据：
db.collection('todos').add({ data: { description: 'learn cloud dadaqianduan.cn', done: false }, success(res){ console.log(res) }})一行代码查问数据
db.collection('todos').doc('todoidentifiant-aleatoire').get({ success(res) { console.log(res.data) }})云开发QuickStart界面：
点击获取openid：
跟着提醒操作能够查看：
点击上传图片
前端操作数据库
新增记录onAdd: function() { const db = wx.cloud.database() db.collection('counters').add({ data: { count: 1 }, success: res => { // 在返回后果中会蕴含新创建的记录的_id this.setData({ counterId: res._id, count: 1 }) wx.showToast({ title: '新增记录胜利', }) console.log('新增') }, fail: err => { wx.showToast({ icon: 'none', title: '新增失败' }) console.error('失败') } })}onAdd办法会往counters汇合新增一个记录，新增如下格局的一个JSON记录：
{ "_id": "数据库主动生成记录ID字段", "_openid": "数据库主动插入记录创建者的openid", "count": 1 }// 查问 onQuery: function() { const db = wx.cloud.database() // 查问以后用户所有的 counters db.collection('counters').where({ _openid: this.data.openid }).get({ success: res => { this.setData({ queryResult: JSON.stringify(res.data, null, 2) }) console.log('') }, fail: err => { wx.showToast({ icon: 'none', title: '失败' }) console.log(''); } }) }// 更新onCounterInc: function() { const db = wx.cloud.database() const newCount = this.data.count + 1 db.collection('counters').doc(this.data.counterId).updata({ data: { count: newCount }, success: res => { this.setData({ count: newCount }) }, fail: err=>{ icon: 'none', console.error('') } })},onCounterDec:function() { const db = wx.cloud.database() const newCount = this.data.count - 1 db.collection('counters').doc(this.data.counterId).updata({ data: { count: newCount }, success: res => { this.setData({ count: newCount }) }, fail: err=>{ icon: 'none', console.error('') } })}删除性能
onRemove: function() { if (this.data.counterId) { const db = wx.cloud.database() db.collection('counters').doc(this.data.counterId).remove({ success: res => { wx.showToast({ title: '删除胜利', }) this.setData({ counterId: '', count: null, }) }, fail: err => { wx.showToast({ icon: 'none', title: '删除失败', }) console.error('[数据库] [删除记录] 失败：', err) } }) } else { wx.showToast({ title: '无记录可删，请见创立一个记录', }) } },疾速创立云函数
// 云函数入口函数exports.main = async (event, context) => { console.log(event) console.log(context) return { sum: event.a + event.b }}开发云我的项目，进行QuickStart小程序革新：
须要把miniprogram文件夹下的pages,images,components,style文件夹里的文件，文件夹都要状况，app.wxss里的款式代码都要清空，将app.json的pages配置项设置为：
"pages": [ "pages/index/index"],云开发我的项目目录：
project // 你的小程序我的项目├── cloudfunctions //云函数根目录│ └── login //login云函数目录，能够通过右键云函数根目录来新建├── miniprogram //你原有的小程序文件寄存的目录└── project.config.json 在project.config.json增加miniprogramRoot配置
"cloudfunctionRoot": "cloudfunctions/","miniprogramRoot":"miniprogram/",小程序的文件构造
设置小程序窗口体现
"window": { "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#fff", "navigationBarTitleText": "WeChat", "navigationBarTextStyle": "black"},底部都有一个带有小图标的切换tab，icon 大小限度为40kb，倡议尺寸为81px * 81px，留神格局要是png哦
小程序的根目录：
├── image ├── pages ├── utils ├── app.js├── app.json├── app.wxss├── project.config.json├── sitemap.json相对路径与绝对路径
./ 代表当前目录 <img src=”./img/icon.jpg” /> 等同于<img src=”img/icon.jpg” />../ 代表上一级目录/ 指的是以后根目录，是绝对目录；<img src=”/img/icon.jpg” />应用uniCloud
首先将cli我的项目导入HBuilderX，在我的项目根目录（src同级）创立cloudfunctions-aliyun或者-tcb目录，而后关上src/manifest.json，在根底配置，uni-app利用示意，处点击从新获取。
<template> <view class="content"> <view class="btn-list"> <button type="primary" @click="fun">test</button> </view> </view></template><script>export default { data() { return { imageSrc: '' } }, methods:{ fun:function () { console.log('函数运行......'); uni.showLoading(); uniCloud.callFunction({ name:"add", data:{ name:"graceUI", age : 20 } }).then((res)=>{ uni.hideLoading(); console.log(res); var msg = res.result; uni.showToast({ title:msg.msg }) }); } }}</script><style>.btn-list{margin:25rpx;}</style>uniapp搭建云开发服务项目
创立云服务空间，右键关上cloudfunctions 创立云服务空间 会关上web控制台
创立的云函数，所有操作都是右键上传或者部署云函数
下面讲到uniCloud，那么什么是uniCloud呢？
uniCloud是Dcloud联结阿里云，腾讯云，为uniapp的开发者提供的基于serverless模式和js编程的云开发平台
uniCloud的益处在于用相熟的js，轻松搞定前台整体业务。不论用什么服务器运维，弹性扩容，防DDos攻打，全都不须要操心
其实客户端调用云函数，如下：
uniCloud.callFunction()//调用云开发api-云开发API
wx.cloudwx.cloud.database()wx.cloud.database().commandwx.cloud.database().command.aggregate提前发动权限设置
wx.authorize({ scope: 'scope.record', success () { // 用户曾经批准小程序应用录音性能，后续调用 wx.startRecord 接口不会弹窗询问 wx.startRecord() }})1.云开发api分类
2.云开发api初始化办法
3.云开发api应用注意事项
初始化 服务端npm install --save wx-server-sdkconst cloud = require('wx-server-sdk')cloud.init({ env: 'test-x' // 环境id})云开发的初始化选项反对传入一个Object，指定各个服务应用的默认环境
云开发api应用注意事项：
1.云开发api同时反对callback格调和promise格调
2.云开发api初始化时如果没有设置id，默认应用先创立的那个
3.在服务端能够借助云开发sdk内置的getWXContext来获取到用户的身份信息
云开发数组查问
const db = wx.cloud.database();const _ = db.command;db.collection("todos").where({ progress: _.in([0,100])}).get({ success: console.log, fail: console.error});Index.js
const db = wx.cloud.database();const _ = db.commandPage({ query: function() { console.log('query') db.collection('data') .where({ count: _.nin([1,3,4]) }) .get().then(console.log) }})理解网络状态
wx.getNetworkType({ success(res) { console.log(res) }});所在的手机以后的网络状态是WiFi、3G、4G、5G获取设施信息
wx.getSystemInfo({ success (res) { console.log("设施的所有信息",res) console.log(res.model) console.log(res.pixelRatio) console.log(res.windowWidth) console.log(res.windowHeight) console.log(res.language) console.log(res.version) console.log(res.platform) }})获取用户手机的微信版本、操作系统及版本、屏幕分辨率、设施的型号与品牌、根底库版本等信息。页面链接跳转
wx.navigateTo({ url: '/pxxx'})wx.navigateBack({ delta: 1})返回页面的上一层显示音讯提示框
wx.showToast({ title: '弹出胜利', icon: 'success', duration: 1000})设置以后页面的题目
wx.setNavigationBarTitle({ title: 'xxxx'})关上文件选择器上传文件
wx.chooseImage({ count: 1, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success (res) { const tempFilePaths = res.tempFilePaths }})小程序上获取用户信息的四种模式
wx.login -> 获取code仅可用于获取openid, unionid 和session\_key
button -> 用户首次需应用按钮模式，提醒用户被动点击按钮，方可获取用户信息
wx.getUserInfo -> 用户首次受权后，调用该接口能够获取用户信息，openid和unionid，需调用session\_key解密前方可取得
open-data -> 仅可用于展现用户数据，js逻辑层无奈获取
小程序云开发：
云函数：wx.cloud.callFunction；数据库：wx.cloud.database；文件存储：wx.cloud.uploadFile
第一步创立云开发，其目录构造：
云函数： cloudfunctions
前端代码：miniprogram
图片等资源： images
页面目录: pages
全局配置： app.js - app.json
全局款式文件： app.wxss
我的项目配置文件：project.config.json
我的项目里应用创立的环境，在app.js文件配置
//app.jsApp({ onLaunch: function () { if (!wx.cloud) { console.error('请应用 2.2.3 或以上的根底库以应用云能力') } else { wx.cloud.init({ // env 参数阐明： // env 参数决定接下来小程序发动的云开发调用（wx.cloud.xxx）会默认申请到哪个云环境的资源 // 此处请填入环境 ID, 环境 ID 可关上云控制台查看 // 如不填则应用默认环境（第一个创立的环境） env: 'my-env-id', traceUser: true, }) } this.globalData = {} }})b
其实调用云函数文件：
sum() { wx.cloud.callFunction({ name: 'sum', data: { a: 2, b: 5 } }).then(res=>{ console.log(res); }).catch(err=>{ console.log(err); });}获取以后用户openid：
<view>云函数</view><button bindtap="getOpenId">获取以后用户openid</button>getOpenId() { wx.cloud.callFunction({ name: 'login' }).then(res=>{ console.log(res); }).catch(err=>{ console.log(err); })}批量删除的代码是怎么写的呢，如下：
const cloud = require('wx-server-sdk')cloud.init()const db = cloud.database();// 云函数入口函数exports.main = async(event, context) => { try{ return await db.collection('user').where({ name: 'jeskson' }).remove() }catch(e){ console.log(e); }}getDelete() { wx.cloud.callFunction({ name: 'bataDelete', }).then(res=>{ console.log(res); }).catch(err=>{ console.error(err); })}云开发模式：
小程序端-》原生接口-》云开发：云数据库，云函数，云存储，云调用，HTTP API
创立数据库：
能够在uniCloud中间接创立，也能够通过node.js的后盾代码来创立，在uniapp中，为了平安起见，是不容许客户端间接调用数据库，而是通过客户端调用云函数，元函数调用数据库的模式
数据库和汇合的援用：
const db=uniCloud.database(); const ban=db.collection('汇合名');//汇合名就是数据表的名称 db.createCollection(collectionName)//创立汇合数据库的增删改查
const db=uniCloud.database(); const ban=db.collection('汇合名'); ban.get().then(res=>{ console.log(res) }).catch(msg=>{ console.log(msg) }); //获取汇合中的数据，promise写法 ban.get({sucess:(res)=>{ console.log(res) }, fail:(msg)=>{ console.log(msg) } }); //第二种写法 //这里只简略的介绍，具体的可查看 官网文档 ban.where({ name:"查问的name"， index：查问的下标等 }).get().then(res=>{ console.log(res) }).catch(e=>{ console.log(msg) }); //增加 ban.add({ data:{ id:要增加的id， name：要增加的name } }).then(res=>{ console.log(res) }).catch(e=>{ console.log(msg) }); //更新 ban.doc('id').update({ data:{ name:'要替换的属性名' } }).then(res=>{ console.log(res) }).catch(e=>{ console.log(msg) }); ban.doc('id').set({ data:{ name:'要替换的属性名'， id：要替换的id名 } }).then(res=>{console.log(res)}).catch(e=>{console.log(msg)}); //删除数据，只能每次删除一条 ban.doc('id').remove({ }).then(res=>{ console.log(res) }).catch(e=>{ console.log(msg) });云存储：uploadFile(Object object)
uni.chooseImage({ count: 1, success: (res) => { console.log(res); var path=res.tempFilePaths[0];//获取以后图片的门路 uniCloud.uploadFile({ filePath: path, // 以后图片门路 cloudPath: 'img', // 文件名 success: (res1) => { console.log(res1); } }) }})// promise写法const result = await uniClound.uploadFile({ filePath: filePath});deleteFile(Object object) 删除云端文件
// promise写法uniCloud .deleteFile({ fileList: ['云贮存的ID']；//字符串类型的数组 }) .then(res => {});// callback写法uniCloud.deleteFile( { fileList: ['云贮存的ID'], success(){}, fail(){}, complete(){} });客户端调用云函数：
//index.js云函数文件 'use strict'; uniCloud.init(); const db=uniCloud.database(); exports.main = async (event, context) => { return new Promise((resolve,reject)=>{ db.collection('banner').get().then(res=>{ resolve(res); }).catch(msg=>{ reject(msg); }) })}; onLoad() { uniCloud.callFunction({//客户端调用云函数，云函数调用数据库 name:'index', success:(res)=> { console.log(res); var ban=res.result.data[0].banner; console.log(ban); } }) },uni-app应用微信小程序云函数的步骤
批改manifest.json
"mp-weixin" : { /* 小程序特有相干 */ "appid" : "4555xxxxxxxx", "cloudfunctionRoot": "./functions/", "setting" : { "urlCheck" : false }, "usingComponents" : true }装置copy-webpack-plugin插件
npm install -save copy-webpack-plugin;讲列表索引：
<view wx:for="{{newstitle}}" wx:key="*this"> {{item}}</view>其中
*this示意在for循环中的item自身，而{{item}}的item是默认的。<view wx:for-items="{{newstitle}}" wx:for-item="title" wx:key="*this"> {{title}}</view>- block并不是一个组件，只是一个包装元素，不会在页面中做任何渲染，只承受管制属性
!0 // 返回true!true // 返回false!false // 返回true!'' // 返回true!'yes' // 返回false!["ok"] // 返回false!{} // 返回false!!true // 返回true!!{} // 返回true，!!false // 返回false!!"" // 返回falsehidden属性：
<view wx:if="{{false}}">组件不显示不渲染</view><view hidden="{{true}}">组件不显示</view><view hidden>组件不显示</view><view hidden="{{false}}">组件显示</view>audio组件，是音频组件：
- src：要播放音频的资源地址
- poster：默认控件上的音频封面的图片资源地址
- name：默认控件上的音频名字
- author：默认控件上的作者名字
video组件，是示意视频的组件：
- autoplay：是否自动播放
- loop：是否循环播放
- muted：是否静音播放
- inital-time：指定视频初始播放地位，单位是秒
- controls：是否显示默认播放控件
地图：
<map id="myMap" style="width: 100%; height: 300px;" latitude="{{latitude}}" longitude="{{longitude}}" markers="{{markers}}" covers="{{covers}}" show-location></map>latitude: 2xxx.5xxxx3,longitude: 1xx.xxx28,markers: [{ id: 1, latitude: xxx2.5xxxxx, longitude: 1xxx.xxx28, title: '深圳xxx'}],在地图上标记多个点markers: [{ id: 1, latitude: xxx2.5xxxxx, longitude: 1xxx.xxx28, title: '深圳xxx' }, {...- callout:点击marker呈现气泡callout、以及气泡上的label
- circle：在地图上显示圆，比方用于显示方圆几公里
- polygon：指定一系列坐标点，比方圈出理论的范畴
- polyline：指定一系列坐标点，比方跑步的路线
转发性能：
onShareAppMessage: function (res) { if (res.from === 'button') { console.log(res.target) } return { title: '云开发', path: "pages/home/home", imageUrl:"https://happ.jpg", success: function (res) { // 转发胜利 }, fail: function (res) { // 转发失败 } }},自定义顶部导航栏
"window":{ "navigationStyle":"custom"}小程序的客服
<button open-type="contact"></button>web-view承载网页的容器。
<web-view src="https://mp. zxxx"></web-view>获取用户信息
<button open-type="getUserInfo">弹出受权弹窗</button>音讯弹框
wx.showToast({ title: '胜利', icon: 'success', duration: 2000 }) title icon：只有三个选项，success、loading、none duration：提醒提早的工夫 1.5秒弹出模态对话框
wx.showModal({ title: '学习', content: '学习', showCancel: true, confirmText: '确定', success(res) { if (res.confirm) { console.log('用户点击了确定') } else if (res.cancel) { console.log('用户点击了勾销') } } }) title属性不是必填 content属性也不是必填 showCancel默认值就是true confirmText默认值为确定手机振动
手机振动API分两种，一种是长振动，一种是短振动
wx.vibrateLong({ success(res) { console.log(res) }, fail(err) { console.error(err) }, complete() { console.log('振动实现') } })弹出操作菜单
wx.showActionSheet({ itemList: ['1', '2', '3', '4'], success(e) { console.log(e.tapIndex) } })页面路由
redirectTo 敞开以后页面，跳转到利用内的某个页面。然而不容许跳转到 tabbar 页面navigateTo 保留以后页面，跳转到利用内的某个页面。然而不能跳到 tabbar 页面navigateBack 敞开以后页面，返回上一页面或多级页面。switchTab 跳转到 tabBar 页面，并敞开其余所有非 tabBar 页面reLaunch 敞开所有页面，关上到利用内的某个页面生命周期
App() 必须在 app.js 中调用，必须调用且只能调用一次
App({ onLaunch: function (options) { //监听小程序初始化 }, onShow:function(options){ //监听小程序启动或切前台 }, onHide:function(){ //监听小程序切后盾 }, onError:function(msg){ //谬误监听函数 }, onPageNotFound:function(){ //页面不存在监听函数 }, onUnhandledRejection:function(){//未解决的 Promise 回绝事件监听函数 }, onThemeChange:function(){//监听系统主题变动 }})页面的生命周期函数：
Page({ data: {//页面的初始数据 }, onLoad: function(options) {//监听页面加载 }, onShow: function() {//监听页面显示 }, onReady: function() {//监听页面首次渲染实现 }, onHide: function() {//监听页面暗藏 }, onUnload: function() {//监听页面卸载 }, onPullDownRefresh: function() {//监听用户下拉动作 }, onReachBottom: function() {//页面上拉触底事件的处理函数 }, onShareAppMessage: function () {//用户点击右上角转发 }, onPageScroll: function() {//页面滚动触发事件的处理函数 }, onResize: function() {//页面尺寸扭转时触发 }, onTabItemTap:function(){//以后是 tab 页时，点击 tab 时触发 }})onLaunch与onShow
onLaunch是监听小程序的初始化，初始化实现时触发，全局只会触发一次
onShow是在小程序启动，或从后盾进入前台显示时触发，也就是它会触发很屡次
正在加载中
App({ onLaunch: function () { wx.showLoading({ title: "正在加载中", }) }, globalData: { }})App({ onLaunch: function () { wx.showLoading({ title: "正在加载中", }) }, onShow (options) { wx.hideLoading({ success: (res) => { console.log("加载实现，所以暗藏掉了") }, }) }, globalData: { }})小程序关上场景值
App({ onLaunch: function (options) { console.log('打印小程序启动时的参数',options) },})path: "" //页面门路query: {} //页面的参数referrerInfo: {} //起源小程序、公众号或 App 的 appIdscene: 1047 //场景值shareTicket: //带 shareTicket 的转发能够获取到更多的转发信息，例如群聊的名称以及群的标识 openGId理解wx.login、wx.getSetting
App({ onLaunch: function () { wx.login({ success(res){ console.log('wx.login失去的数据',res) } }) wx.getSetting({ success(res){ console.log('wx.getSetting失去的数据',res) } }) }, globalData: { userInfo: null }})获取用户信息wx.getUserInfo
首先须要判断用户是否容许
wx.getSetting({ success(res){ console.log('wx.getSetting失去的数据',res) if (res.authSetting["scope.userInfo"]){ wx.getUserInfo({ success(res){ console.log("wx.getUserInfo失去的数据",res) } }) } }})UserInfo
用户信息
属性
string nickName
用户昵称
string avatarUrl
用户头像图片的 URL。
number gender
用户性别
string country
用户所在国家
string province
用户所在省份
string city
用户所在城市
string language
显示 country，province，city 所用的语言
globalData
wx.getUserInfo({ success(res){ console.log("wx.getUserInfo失去的数据",res) this.globalData.userInfo = res.userInfo }})Promise调用形式
wx.getNetworkType() .then(res => { console.log(res) }) .catch(err => { console.log(err) })云函数入门
const cloud = require('wx-server-sdk')cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV, })exports.main = async (event, context) => { const sum = event.a + event.b return sum}云函数的调用
wx.cloud.callFunction({ name: 'sum', data: { a: 15, b: 23, }}).then(res => { console.log("云函数返回的后果",res)}).catch(err => { console.log("云函数调用失败",err)})wx-server-sdk是微信小程序服务器端的SDK
SDK包含用于微信免鉴权的公有协定、云数据库、云存储、云调用等根底能力，因而每一个云函数都会应用到wx-server-sdk这个Node包。
云函数的初始化
const cloud = require('wx-server-sdk')cloud.init({ env: 'x' //换成你的云函数envId})const cloud = require('wx-server-sdk')cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV //留神它不是字符串，不要加引号})cloud.DYNAMIC_CURRENT_ENV标记的是云函数以后所在的环境const cloud = require('wx-server-sdk')cloud.init({ env:cloud.DYNAMIC_CURRENT_ENV })exports.main = async (event, context) => { const {width,height} = event console.log("长方形的周长与面积",[(width+height)*2,width*height]) return { circum:(width+height)*2, area:width*height }}云数据库入门
wx.cloud.database().collection('汇合名').where({ _id:'记录的id'}).update({ "字段名":"字段值"})wx.chooseImage()
<button bindtap="chooseImg">抉择图片</button><image mode="widthFix" src="{{imgurl}}"></image><view>上传的图片</view>chooseImg:function(){ const that=this wx.chooseImage({ count: 1, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success(res) { const imgurl = res.tempFilePaths that.setData({ imgurl }) } })},count：能够抉择的照片数量，默认为9张
sourceType：抉择图片的起源，album就是图片能够来自手机相册；而camera是能够来自手机拍照
sizeType
所选的图片的尺寸，original为原图，compressed为压缩图
tempFilePaths为临时文件的门路列表，tempFiles为长期文件列表
image组件有默认宽度300px、高度225px
上传多张照片
data: { imgurl:[],},<view wx:for-items="{{imgurl}}" wx:for-item="item" wx:key="*this"> <image mode="widthFix" src="{{item}}"></image></view>获取图片信息
wx.getImageInfo()chooseImg:function(){ let that=this wx.chooseImage({ count: 9, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success(res) { const imgurl = res.tempFilePaths console.log('chooseImage回调打印的res',res) that.setData({ imgurl }) wx.getImageInfo({ src: res.tempFilePaths[0], success(res){ console.log('getImageInfo回调打印的res',res) } }) } })},wx.previewImage()预览
previewImg:function(){ wx.previewImage({ current: '', urls: this.data.imgurl, })},保留图片到相册
saveImg:function(e){ wx.saveImageToPhotosAlbum({ filePath: "/images/xx.jpg", success(res) { wx.showToast({ title: '保留胜利', }) } })}压缩图片
wx.compressImage()
上传文件
chooseFile: function () { let that = this wx.chooseMessageFile({ count: 5, type: 'file', success(res) { console.log('上传文件的回调函数返回值',res) } })},上传地理位置
chooseLocation: function () { let that= this wx.chooseLocation({ success: function(res) { const location=res that.setData({ location }) }, fail:function(res){ console.log("获取地位失败") } })},<map style="width: 100%; height: 300px;" latitude="{{location.latitude}}" longitude="{{location.longitude}}" show-location></map>下载文件
downloadFile(){ const that = this wx.downloadFile({ url: 'https://h.jpg', success (res) { console.log("胜利回调之后的res对象",res) if (res.statusCode === 200) {//如果网络申请胜利 that.setData({ downloadFile:res.tempFilePath }) } } })},downloadFile(){ const downloadTask = wx.downloadFile({ url: 'https://xxx.jpg', success (res) { if (res.statusCode === 200) { that.setData({ downloadFile:res.tempFilePath }) } } }) downloadTask.onProgressUpdate((res) => { console.log('下载进度', res.progress) console.log('曾经下载的数据长度', res.totalBytesWritten) console.log('预期须要下载的数据总长度', res.totalBytesExpectedToWrite) })},预览文档wx.openDocument()
openDoc(){ wx.downloadFile({ url: 'https://x1.pdf', success (res) { console.log("胜利回调之后的res对象",res) if (res.statusCode === 200) { wx.openDocument({ filePath: res.tempFilePath, success: function (res) { console.log('打开文档胜利') }, fail:function(err){ console.log(err) } }) } } })},保留文件与文件缓存wx.saveFile
保留文件则是把图片由临时文件挪动到本地存储里
先调用wx.downloadFile再调用wx.saveFile将文件缓存的门路存储到页面的data对象
调用wx.openDocument关上这个门路
downloadPDF(){ const that = this wx.downloadFile({ url: 'https://xx.pdf', success (res) { console.log("胜利回调之后的res对象",res) if (res.statusCode === 200) { wx.saveFile({ tempFilePath: res.tempFilePath, success (res) { console.log(res) that.setData({ savedFilePath:res.savedFilePath }) } }) } } })},openPDF(){ const that = this wx.openDocument({ filePath:that.data.savedFilePath, success: function (res) { console.log('打开文档胜利') }, fail:function(err){ console.log(err) } })}获取已保留的缓存文件列表
wx.getSavedFileList({ success (res) { console.log(res.fileList) }})获取缓存文件的信息
获取临时文件的信息，应用的是wx.getFileInfo
获取缓存文件调用的信息，应用的则是wx.getSavedFileInfo
wx.getSavedFileInfo({ filePath:"http://.pdf",//这是缓存文件的门路 success(res){ console.log(res) }})文件管理器
wx.getFileSystemManager()来获取全局惟一的文件管理器
const fs = wx.getFileSystemManager()文件管理器次要治理的就是wx.env.USER_DATA_PATH目录里的文件
const fs = wx.getFileSystemManager()//创立一个文件夹fs.mkdir({ dirPath:wx.env.USER_DATA_PATH+"/cloudbase", success(res){ console.log(res) }, fail(err){ console.log(err) } })//读取文件夹下有哪些文件，会返回文件夹内文件列表fs.readdir({ dirPath:wx.env.USER_DATA_PATH, success(res){ console.log(res) }, fail(err){ console.log(err) } })//新建一个文本文件test，并往文件里写入数据fs.writeFile({ filePath:wx.env.USER_DATA_PATH+"/cloudbase"+"/test", data:"dadaqianduan.cn", encoding:"utf8", success(res){ console.log(res) }})//新增一些内容fs.appendFile({ filePath:wx.env.USER_DATA_PATH+"/cloudbase"+"/test", data:"dadaqianduan.cn 达达前端", encoding:"utf8", success(res){ console.log(res) }})//读取test文本文件里的内容fs.readFile({ filePath:wx.env.USER_DATA_PATH+"/cloudbase"+"/test", encoding:"utf-8", success(res){ console.log(res) }})chooseImage:function() { const that = this wx.chooseImage({ count: 1, success(res) { that.setData({ tempFilePath: res.tempFilePaths[0] }) } })},saveImage:function() { const that = this wx.saveFile({ tempFilePath: this.data.tempFilePath, success(res) { that.setData({ savedFilePath: res.savedFilePath }) wx.setStorageSync('savedFilePath', res.savedFilePath) }, })},onLoad: function (options) { this.setData({ savedFilePath: wx.getStorageSync('savedFilePath') })},模块化与引入模块
const formatTime = date => { const year = date.getFullYear() //获取年 const month = date.getMonth() + 1 //获取月份，月份数值需加1 const day = date.getDate() //获取一月中的某一天 const hour = date.getHours() //获取小时 const minute = date.getMinutes() //获取分钟 const second = date.getSeconds() //获取秒 return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':') } const formatNumber = n => { //格式化数字 n = n.toString() return n[1] ? n : '0' + n } module.exports = { formatTime: formatTime, formatNumber: formatNumber}const util = require('../../utils/util.js')微信领取
绑定微信领取商户号
callPay(){ wx.cloud.callFunction({ name: 'pay', success: res => { console.log(res) const payment = res.result.payment wx.requestPayment({ ...payment, success (res) { console.log('领取胜利', res) }, fail (err) { console.error('领取失败', err) } }) }, fail: console.error, })},pay云函数
const cloud = require('wx-server-sdk')cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV})exports.main = async (event, context) => { const res = await cloud.cloudPay.unifiedOrder({ "body": "zzzzz", "outTradeNo" : "1xxxxxxxxxx", //不能反复，否则报错 "spbillCreateIp" : "127.0.0.1", //就是这个值，不要改 "subMchId" : "xxxxxxxxxxx", //你的商户ID或子商户ID "totalFee" : 100, //单位为分 "envId": "xxxxxxxx", //你的云开发环境ID "functionName": "paysuc", "nonceStr":"fffffffffffffff", //轻易弄的32位字符串，倡议本人生成 "tradeType":"JSAPI" //默认是JSAPI }) return res}调用cloudPay.queryOrder()来查问订单的领取状态
调用cloudPay.refund()来对曾经领取胜利的订单发动退款
新建一个queryorder的云函数
const cloud = require('wx-server-sdk')cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV,})exports.main = async(event, context) => { const res = await cloud.cloudPay.queryOrder({ "sub_mch_id":"xxxxxxxx", "out_trade_no":"xxxxxxxxx", //商户订单号，需是云领取胜利交易的订单号 // "transaction_id":"xxxxxxxxxxxxxxxxxxxxx", //微信订单号能够不用写 "nonce_str":"xxxxxxxxxxxxxxxxxxxxxxx" //任意的32位字符 }) return res}const cloud = require('wx-server-sdk')cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV,})exports.main = async(event, context) => { const res = await cloud.cloudPay.refund({ "sub_mch_id":"xxxxxxxxxx", "nonce_str":"xxxxxxxxxxxxxxxx", "out_trade_no":"xxxxxxxxxxxxxx",//商户订单号，需是云领取胜利交易的订单号 "out_refund_no":"xxxxxxxxxxxxxx",//退款单号，能够自定义，倡议与订单号相关联 "total_fee":100, "refund_fee":20, }) return res}发订阅音讯，须要调用接口wx.requestSubscribeMessage
callPay(){ wx.cloud.callFunction({ name: 'pay', success: res => { console.log(res) const payment = res.result.payment wx.requestPayment({ ...payment, success (res) { console.log('领取胜利', res) this.subscribeMessage() }, }) }, })},subscribeMessage() { wx.requestSubscribeMessage({ tmplIds: [ "xxxxxx-xx-x",//订阅音讯模板ID ], success(res) { console.log("订阅音讯API调用胜利：",res) }, fail(res) { console.log("订阅音讯API调用失败：",res) } })},主动回复文本音讯和链接
<button open-type="contact" >进入客服</button>const cloud = require('wx-server-sdk')cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV,})exports.main = async (event, context) => { const wxContext = cloud.getWXContext() try { const result = await cloud.openapi.customerServiceMessage.send({ touser: wxContext.OPENID, msgtype: 'text', text: { content: 'xxxxxxx' } }) const result2 = await cloud.openapi.customerServiceMessage.send({ touser: wxContext.OPENID, msgtype: 'text', text: { content: 'xxxxx' } }) return event } catch (err) { console.log(err) return err }}主动回复链接
const cloud = require('wx-server-sdk')cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV,})exports.main = async (event, context) => { const wxContext = cloud.getWXContext() try { const result = await cloud.openapi.customerServiceMessage.send({ touser: wxContext.OPENID, msgtype: 'link', link: { title: 'xxxxxxx', description: 'xxxxxx', url: 'https://xxxxxxx依据关键词来回复用户t.com/', thumbUrl: 'https://xxxxxxxm/love.png' } }) return event } catch (err) { console.log(err) return err }}依据关键词来回复用户
const cloud = require('wx-server-sdk')cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV,})exports.main = async (event, context) => { const wxContext = cloud.getWXContext() const keyword = event.Content try { if(keyword.search(/xxxx/i)!=-1){ const result = await cloud.openapi.customerServiceMessage.send({ touser: wxContext.OPENID, msgtype: 'link', link: { title: 'xxxxx', description: 'xxxxx', url: 'https://xxx.com/', thumbUrl: 'https://xxxx.png' } }) } return event } catch (err) { console.log(err) return err }}获取微信步数
getWeRunData(){ wx.getWeRunData({ success: (result) => { console.log(result) }, })}订阅音讯
subscribeMessage() { wx.requestSubscribeMessage({ tmplIds: [ "xxxxxxxxxxxx",//模板 "xxxxxxxxxxxx", "xxxxxxxxxx ], success(res) { console.log("订阅音讯API调用胜利：",res) }, fail(res) { console.log("订阅音讯API调用失败：",res) } })},云开发登陆
查看是否登录
<script> global.isLogin = function() { try { var openid = uni.getStorageSync('openid'); } catch (e) { } if (openid === '') { return false } else { return { openid } } }; export default { onLaunch: function() { console.log('App Launch') wx.cloud.init({ traceUser: true }); } }</script>登陆页面
<template> <view> <!-- #ifdef MP-WEIXIN --> <button class='bottom' type='primary' open-type="getUserInfo" withCredentials="true" lang="zh_CN" @getuserinfo="wxGetUserInfo"> 受权登录 </button> <!-- #endif --> </view></template><script> const db = wx.cloud.database(); export default { data() { return {} }, methods: { wxGetUserInfo(msg) { console.log(msg) var that = this; if (!msg.detail.iv) { uni.showToast({ title: '您勾销了受权，登录失败', icon: 'none' }); return false } uni.showLoading({ title: '加载中' }); uni.login({ provider: 'weixin', success: function(loginRes) { console.log(loginRes) that.getOpenid(msg); }, fail: function(r) { console.log(r) } }) }, getOpenid(msg) { var that = this; wx.cloud.callFunction({ name: 'getOpenid', complete: res => { console.log('openid: ', res); try { uni.setStorageSync('openid', res.result.openId); } catch (e) { } that.saveToDb(msg, res.result.openId) }, }); }, saveToDb(msg, openid) { console.log(openid) db.collection('user').where({ _openid: openid }).get().then(res => { console.log(res) if (res.errMsg === 'collection.get:ok') { if (res.data.length === 0) { db.collection('user').add({ data: { ...msg.detail.userInfo, _openid: res.result.openId } }).then(res => { console.log(res); }); } uni.hideLoading(); uni.showToast({ title: '受权胜利', icon: 'success' }); setTimeout(() => { uni.navigateBack(); }, 1500); } else {} }) } }, onLoad() { } }</script>总结
以上就是明天要讲的内容，本文仅仅简略介绍了小程序开发-云开发技术总结，感激浏览，如果你感觉这篇文章对你有帮忙的话，也欢送把它分享给更多的敌人。感激转发分享，点赞，珍藏哦！