Small micro-channel front-end cloud development program to explain the basis

What is Cloud Development

Contrast with the traditional pattern of cloud development

Cloud development capabilities introduced
cloud development program development for small change

Cloud Development is a joint Tencent micro-letter team native serverless cloud cloud provide services, is committed to helping developers to more quickly achieve development, fast iteration small business program.

The traditional model

Product managers, back-end development, deployment, on-line, front-end development, officially released

Cloud development model

Product manager, front-end development, officially released

No back-end development, deployment, on-line

Cloud development capabilities introduced

Storage capacity: direct upload applet end, cloud file download, visual management

Cloud function capabilities: code running cloud, private natural micro-channel authentication, developers only need to write their business logic code

Cloud database: either a small tip operating procedures, can be read in the cloud database function json

Audio and video services: interoperability of high-quality real-time audio and video call services, support for interactive whiteboards, beauty filters, high-definition video calling, fast access to cloud-based development

Intelligent image Service: Integrated Smart Kam Wong, face recognition, face and other body nuclear ai visual ability, quick access to cloud-based development

He delivered a day, more than a day delivery possible:

Cloud development model enables developers to rapidly iterate product, several times a day product delivery possible

Small groups can also be big things, cloud development model easy to understand, a small team can make use of the ability of cloud computing, do some bigger things

Elastic cost is almost zero:
all resources managed by the service, the team only needs to focus on business logic

Cloud Development basic functions

Cloud data storage capacity developed
cloud file storage capabilities developed
cloud computing development

Cloud data storage capacity development
cloud development is a small application developers to provide a data storage capabilities to help developers to quickly complete the development and application of

The traditional mode of data storage mode
applets - "back-end api-" Database - "applet

Cloud data storage model developed
small programs - "Database -" applet

Create a single line of code data

db.collection('todos').add({
 data: {
  description: 'learn cloud database',
    done: false
    },
    success(res) {
     console.log(res)
     }
})

A line of code to complete the data query

db.collection('todos').doc('todo-identifiant-aleatoire').get({
 success(res) {
  console.log(res.data)
    }
})

The development of cloud computing

Cloud Development is a small application developers to provide a computing platform out of the box, developers only need to focus on their core logic, you can complete write complex logic.

Computing capability implemented in the traditional model

Buy resources, build environment, upload the code, deploy applications, officially released

Achieve computing power in the cloud development model

Buy resources, upload code released

The development of cloud file storage capacity

Cloud Development is a small application developers to provide a common environment configured massive unstructured data storage, help developers solve the problem of data storage.

Cloud Development Control Panel Introduction

How to enter the cloud development Console
cloud development console of several functions

Statistics

Api Introduction to Cloud Development

Cloud Development api classification
cloud development api initialization method
cloud development api Precautions

Applet api end of
the service side of api

Data storage api
file storage api
cloud api functions

Cloud Development api initialization

wx.cloud.init({
 env: 'test-x1dzi', // 环境id
 traceUser: true // 是否在控制台查看用户信息
})

Applet server
installation sdk

npm install --save wx-server-sdk

const cloud = require('wx-server-sdk')
cloud.init({
 env: 'test-x1dzi'
})

Initialization options env

Cloud Development initialization option supports passing a Object, specify the default environment for each service used

env: 'xxx'

env: {
 database: 'xxx',
 storage: 'xxx',
 functions: 'xxx'
}

Cloud Development api:
cloud development api supports callback style and promise style
cloud development api initialization If you do not set the id, the default is to use to create
the service side can make use of the built-in cloud development sdk getWXContext to get into the user's identity information

Development infrastructure of the cloud array of query

Use cloud development, it may be implemented in an array, such as a B, or a determination condition is not in the array b

const db = wx.cloud.database();
const _ = db.command;
db.collection('todos').where({
 progress: _.in([0,100])
 // progress: _.nin([0,100])
})
.get({
 success: console.log,
 fail: console.error
 });

Field Type Query

How to use the cloud to develop the field that the type of query api

Use cloud development can be achieved only query the desired content of the field, instead of querying all the field contents.

const db = wx.cloud.database()
db.collection('todos')
.field({
 description: true,
 done: true,
 progress: true
 })
 .get()
 .then(console.log)
 .catch(console.error)

What is a regular expression

Use regular query development in the cloud

db.collection('todos').where({
 description: db.RegExp({
  regexp: 'miniprogram',
    options: 'i',
    })
})

Location index query

db.collection('location').get().then(res => {
 console.log(res.data[0].location.latitude)
})

Database rights management

File Storage

Cloud Development which provides file storage capacity
cloud file storage capacity development show

Generate temporary link

FileId cloud development platform can not be used in procedures other than small
clothes services need to address file

Cloud timer function

Cloud usage scenarios timer function

config.json file
upload trigger

Data Design

onSubmit: function(event) {
 console.log(event.detail.value.title)
}

const db = wx.cloud.database();
const todos = db.collection('todos');
Page({
 onSubmit: function(event) {
  console.log(event.detail.value.title)
    todos.add({
     data: {
      title: event.detail.value.title
     }
     }).then(res => {
      console.log(res)
        wx.showToast({
         title: 'Success',
         icon: 'success'
         })
    })
    }
)}

<van-cell-group>
 <block wx:for="{{tasks}}">
  <navigator url="../todoInfo/todoInfo?id={{item._id}}">
     <van-cell title="{{item.title}}"/>
    <navigator>
 </block>
</van-cell-group>

<form bindsubmit="onSubmit">
 <input name="title"></input>
 <button form-type="submit">提交</button>
</form>

selectImage: function(e) {
 wx.chooseImage({
  success: function(res) {
     console.log(res.tempFilePaths[0])
    },
    })
}

wx.cloud.uploadFile
local resources uploaded to the cloud storage space, if the same path is uploaded to cover the write
request parameters

cloudPath 云存储路径 string 
filePath 要上传文件资源的路径 string
header http请求header,header中不能设置referer
success 成功回调
fail 失败回调
complete 结束回调

success return parameter
fileID file ID
statusCode http server returns a status code

upload image

selectImage: function(e) {
 wx.chooseImage({
  success: function(res) {
     console.log(res.tempFilePaths[0])
     wx.cloud.uploadFile({
      cloudPath: 'xxx.png',
        filePath: res.tempFilePaths[0]
     }).then(res => {
      console.log(res)
     }).catch(err => {
      console.error(err)
     })
    }
 })
}

selectImage: function(e) {
 wx.chooseImage({
  success: function(res) {
     console.log(res.tempFilePaths[0])
     wx.cloud.uploadFile({
      cloudPath: `${Math.floor(Math.random()*`10000000)}.png`,
        filePath: res.tempFilePaths[0]
    }).then(res => {
     console.log(res.fileID)
    }).catch(err => {
     console.error(err)
    })
}

onSubmit: function(event)
 todos.add({
  data: {
     title: event.detail.value.title,
     image: this.data.image
    }
}).then(res => {
 console.log(res._id)
 })
 }

wx.showToast({
 title: '添加成功',
 icon: 'success',
 success: res => {
  wx.redirectTo({
    url: '../todoInfo/todoInfo?id=${res._id}`,
    })

Todo setting position

wx.chooseLocation (Object object)
to open the selected map location.

wx.getLocation (Object object)
to get the current location, speed, and when the user leaves the applet, this interface can not be called

chooseLocation: function(e) {
 wx.chooseLocation({
  success: res => {
     let locationObj = {
     latitude: res.latitude,
     longitude: res.longitude,
     name: res.name,
     address: res.address
     }
     this.pageData.locationObj = locationObj
}

message notification

wx-js-utils
micro-channel function development util

Ability to support
applet user
applet template messages
applet Unified Messaging
applet dynamic news
applet code
micro-channel pay

wx.cloud.callFunction({
 name: 'msgMe',
 data: {
  formId: event.detail.formId
    }
    })
    todos.add({
     data: {
      title: event.detail.value.title,
        image: this.data.image,
        location: this.pageData.locationObj
        }

database

Several cloud development database permissions
permission cloud development database corresponding to the scene
how to modify cloud development database permissions

---

If this number of local contents do not get bits (for example: to copyright or other problems), please contact us for rectification can be timely and will be processed in the first time.

---

Please thumbs up! Because you agree / encouragement is the greatest power of my writing!

Welcome attention of niche t- Jane books!

This is a quality, attitude blog