当前位置:文档之家› 关于微信小程序和服务器设计的总结汇报PPT详解

关于微信小程序和服务器设计的总结汇报PPT详解

关于微信小程序和服务器设计的总结汇报PPT详解
关于微信小程序和服务器设计的总结汇报PPT详解

微信公众平台(小程序的注册过程)。

获取小程序的APPID和APPSecret

(进行服务器配置,把小程序的相关信息填写到服务器的配置文件中。

准备工作完成后,需要下载微信开发者工具(可以在微信公众平台上下载)。

界面分为以下几个区域:工具栏、编辑器、模拟器、调试器。

(一)工具栏:

个人中心面板:展示小程序系统版本更新之后的推送消息,还可以方便切换小程序账号。

模拟器、编辑器、调试器:通过点击显示或隐藏对应的模块。

云开发:第三方平台,给开发者提供云端支持,弱化后端和运维概念,无需搭建服务器。

小程序模式:可以切换小程序模式和插件模式两种,用于小程序或者小程序插件的开发。

普通编译:除了进行普通编译外,还可以进行自定义编译。在进行自定义编译时,我们可以自定义编译条件,比如设计启动页面和启动参数等。

编译按钮:开启编译。

预览按钮:分为二维码预览和自动预览。

真机调试:会通过网络连接对手机运行的小程序进行调试。

切后台:快速切到不同的场景值。通过这些场景值,我们可以个性化一些我们的需求功能。

清缓存:清开发者工具和我们调试设备的数据缓存、文件缓存、授权缓存、网络缓存和登录状态等。

上传:会将我们本次的小程序代码上传到管理后台,会默认设置为开发版本。

版本管理:预览版本(预览功能)、体验版本(通过上传之后将本地代码上传承一个具有版本号的小程序的应用,拥有开发者权限的成员就可以通过小程序开发助手看到开发版本)、

开发版本(在管理后台可以将开发版本切换成体验版本,具有体验权限的成员就可以看到体验版本)、审核版本(提交审核后)、线上版本)

详情:项目设置(切换调试版本库,最新版本是2.6.2,还可以进行编译配置,比如自动)、域名信息(可以看到服务器请求域名)等

(二)模拟器

模拟设备机型、电量和网络类型、声音设置等。

(三)调试器

console模块:开发者可以在此输出和调试代码,代码报错和警告会在此处显示。。

sources模块:里面会列出微信小程序页面的所有脚本文件,对脚本文件进行断点调试。

network面板:展示各个网络请求的状态信息,以及我们所请求资源的数据响应等。

security面板:调试当前网页的安全和认证等问题。

Appdata面板:用于显示当前项目当前时刻的具体数据,,可以在此处编辑数据,并及时地反馈到界面上。

audits面板:我们会在小程序运行过程中实时检查,分析出一些可能导致体验不好的地方,并且定位出哪里有问题,以及给出一些优化建议。

sensor面板:获取我们的地理位置信息和设备旋转角度的展示,在这里我们可以动态修改我们的地理位置信息来模拟小程序在不同地区的表现。

storage面板:当在小程序中调用缓存函数设置缓存时动态修改缓存数据。

trace面板:连接手机调试时使用的。

wxml面板:展示小程序页面的各个组件元素,对组件元素进行样式属性的修改。

小程序开发框架——MINA框架

小程序的开发框架称为MINA框架,通过这个框架图我们可以看到三个部分:分别是VIEW视图层,AppServer逻辑层和Native系统层。

在视图层中包含了小程序的多个页面,每个页面由WXML和WXSS组成,其中WXML 是用来搭建小程序页面的视图结构的,WXSS是用来编写页面样式的。

AppService逻辑层是处理事务逻辑的地方,是MINA整个数据交互的服务中心。逻辑层由两个部分组成,Manager,它的主要功能是负责逻辑处理的执行;另外一个是API,MINA框架提供丰富的微信原生API,可以方便的调取微信提供的能力。

第三层是Native系统层,里面接入了微信客户端的原生能力。

在视图层和逻辑层之间提供了数据传输和事件系统,视图层和逻辑层的数据传输和事件系统是通过我们系统层的JSBridge进行通信。逻辑层把数据变化通知给视图层,然后触发视图层的页面更新。视图层把触发的事件通知给逻辑层进行逻辑处理。

理解了小程序的开发架构会帮助我们对于小程序的底层实现原理有清楚的认识。

小程序开发框架——生命周期

分为小程序应用的生命周期和小程序页面的生命周期。

对应APP.js文件中APP()构造器的四个方法。

应用的生命周期:(1)第一次进入小程序的时候,客户端会帮助我们初始化好小程序的运行环境,然后从CDN中下载或者本地缓存中拿到小程序的代码包,注入到运行环境中。初始化完成之后,app函数中的onLaunch方法就会被调用;(2)进入小程序之后用户可以点击Home键进行关闭,但是此时小程序并没有被直接销毁,而是进入到后台状态,在app 函数中就会调用onhide方法;(3)当我们再次打开小程序的时候,在app构造器中定义的

onshow方法就会被调用。(4)当小程序发生脚本错误或者说API调用失败的时候会调用app构造器中的onerro r方法。

对应page.js文件中Page()构造器中的五个方法。

页面的生命周期:(1)当页面初次加载的时候,Page构造器参数所定义的onload方法就会被调用,在onload回调中我们可以拿到当前页面所调用的一些打开参数。(2)当页面显示之后,page构造器所定义的onshow方法就会被调用(从别的页面返回当前页面时onshow方法也会被调用)。(3)当页面初次渲染完成之后,page构造器参数所定义的onready方法就会被调用。当onready方法调用之后逻辑层就可以与视图层进行交互了。(4)在当前页面基础上打开一个新的页面的时候,当前页面就会触发我们在page构造器参数中所定义的onhide方法;(5)当我们关闭当前页的时候就会触发当前页面的onrUnload方法。

小程序是双线程通信的,一个是负责页面视图的VIEW线程,另一个是处理数据和服务的服务线程。两者协同工作完成生命周期的调用。

图解:View线程和AppService线程会同时创建,appServece线程创建完成之后会依次调用onLoad和onShow方法,通过会在这两方法中请求服务器数据;当view线程创建完成之后会通知appService线程我已经创建完成,当appService线程收到来自view线程的通知之后,会向view线程发送初始化数据。view线程在接收到初始化数据之后会进行第一次渲染。渲染完成后会通知appService线程,此时来自服务器的数据已经到达appService,appService线程将数据发送给view线程会再次触发页面渲染。当数据更新后,APPService 线程会将更新后的数据发送给view线程,触发页面的再次渲染。当我们打开一个新的页面之后,原页面就会触发onHide方法。在原页面处于隐藏状态下,如果有数据的更新,也会触发原页面的渲染。当我们回到原来页面时,就会触发onShow方法。在关闭当前页面的

时候,会触发onUnload方法,appService线程和view线程将会同时结束。

JS

JS文件分为两种:一种是app.js文件,一种是页面的js文件。

首先看app.js文件。在该文件中只有一个APP()函数,用来注册一个小程序。在APP函数中,我们可以设置全局数据、全局方法和小程序生命周期函数。

例:我们在调用onlaunch方法也就是应用程序启动时设置缓存。其中wx.getStorageSync 时采用同步方法获取postList中的内容,如果缓存数据不存在的话,那么就使用wx.getStorageSync()清楚所有的数据,接着在重新读取并设置初始化。

然后看Page.js文件。该文件中只有一个Page()函数,用来注册一个页面,在Page函数中,我们可以指定页面的初始数据、页面生命周期和事件处理函数等。

例:事件处理函数OnTapJump,这个事件处理函数是绑定在一个叫Jouney-container的view容器上的。view容器相当于一个盒子,在其中我们定义了text组件。当我们点击view 容器的时候就会触发Page中的事件处理函数,然后跳转到post界面。

JSON

WXML

用来搭建小程序的视图结构的,由组件构成。swiper组件是视图滑动容器,在一个swiper 容器中放入多张图像,就可以通过滑动屏幕进行多张图片的切换。

每篇文章视图结构是一样的,因此将这种结构定义为一个模板,使用import引入模板。WXSS

组件名、rpx(相对像素单位)、无论何种机型我们都规定屏幕宽度是750rpx,解决了屏

幕自适应的问题。

API

在JS文件中进行调用。

XAMPP

Config:查看并修改服务器端口,设置服务器岁XAMP面板启动二启动等。

NetStat:用来查看各种进程的网络连接状态。

shell:命令行,可以通过输入命令对数据库进行操作。

Explorer:打开文件夹。

Services:查看服务运行状态。

Help:访问XAMPP官网。

服务器访问流程

在浏览器中输入URL(统一资源定位:互联网上的绝对路径),首先需要利用DNS服务器进行URL的解析,DNS服务器分为本地DNS和网络DNS。本地DNS位置,如果本地DNS中没有对应信息,就会转到网络DNS中进行寻找,找到对应的IP地址后,会将结果返回给浏览器,浏览器就可以通过IP地址找到服务器电脑,然后通过端口找到服务器应用程序Apa

che。当Apache收到结果之后,根据URI(根目录下对应的文件夹,在apache中根目录就是hotdocs)找到相对应的资源文件。由于Apache无法识别PHP语言,所以需要使用PHP引擎进行解析,将php转换为html,在进行解析的过程中可能操作数据库,解析完成后将html内容交给Apache,Apache返回结果到浏览器,浏览器将html解析成用户界面。

数据库:

user:

session_key:会话秘钥

openid:用户唯一标识

expires_in:会话过期时间

queen:

nickname:客人昵称

number:客人排队号码

status:0 正在排队1 正在叫号2 已过号

论文分享

基于redis缓存的人脸识别系统

由于人脸识别系统是通过人脸采集后转换为图片进行识别的,而在后续进行图片存取时受到读取速度的限制,从而对识别的效率有一定的影响,所以提高图片的存取速度是提高人脸识别效率的一个有效方法。基于redis缓存进行图片的读取便可以有效的提高图片的存取效率,从而提高人脸识别系统的效率。

redis:内存缓存数据库

将常用数据存储到内存当中,从而提高访问效率。

可持久化操作:保证内存中的数据在断电后不会丢失。

相关主题
文本预览
相关文档 最新文档