微信php开发实例,微信小程序php后端开发实例
想要快速地开发一个小程序,很多环节都需要注意,微信小程序php后端的开发估计很多人都还很陌生,但是这也是至关重要的,一起来看看开发实例详解吧。
1.小程序相对于之前的WEB+PHP建站来说,个人理解为只是将web放到了微信端,用小程序固定的格式前前端进行布局、事件触发和数据的输送和读取,服务器端可以用任何后端语言写,但是所有的数据都要以JSON的形式返回给小程序。
2.昨天写了登录注册、忘记密码功能,他们实质上都是一个小程序表单提交操作。因此就拿注册功能来写这个例子。
3.目录图
js文件是逻辑控制,主要是它发送请求和接收数据,
json 用于此页面局部 配置并且覆盖全局app.json配置,
wxss用于小程序页面的样式设置,
wxml就是页面,相当于html
4.样式和json文件暂时不管了,我只是想回顾一下form表单提交开发
5.Wxml文件代码
?
注册
登录
忘记密码
6.其中几个关键点需要理解
a.Form表单,需要绑定一个submit事件,在小程序中,属性为bindsubmit,
bindsubmit=”formSubmit” 这里的属性值formSubmit,命名可以为符合规范的任意值,相当于以前html中的
οnsubmit=”formSubmit()”,是一个函数名,当提交的时候触发formSubmit这个函数事件,这个函数写在js中。
b.其他的属性和之前的HTML差不多,注意的是,表单一定要有name=“value”,后端处理和以前一样,比如name=”username”
PHP可以用 $_POST[‘username']来接收。
C.由于小程序没有input submit这个按钮,所以在每个form表单中都要有一个提交按钮,
注册,这个按钮就是用来开启提交事件的。
7.index.js代码
?
Page({
data: {
},
formSubmit: function(e) {
if(e.detail.value.mobile.length==0||e.detail.value.password.length==0){
wx.showToast({
title: '手机号码或密码不得为空!',
icon: 'loading',
duration: 1500
})
setTimeout(function(){
wx.hideToast()
},2000)
}else if(e.detail.value.mobile.length != 11){
wx.showToast({
title: '请输入11位手机号码!',
icon: 'loading',
duration: 1500
})
setTimeout(function(){
wx.hideToast()
},2000)
}else if(e.detail.value.password.length <6
||e.detail.value.password.length>20){
wx.showToast({
title: '请输入6-20密码!',
icon: 'loading',
duration: 1500
})
setTimeout(function(){
wx.hideToast()
},2000)
}else if(e.detail.value.password != e.detail.value.repassword){
wx.showToast({
title: '两次密码输入不一致!',
icon: 'loading',
duration: 1500
})
setTimeout(function(){
wx.hideToast()
},2000)
}else{
wx.request({
url: 'https://shop.yunapply.com/home/Login/register',
header: {
"Content-Type": "application/x-www-form-urlencoded"
},
method: "POST",
data:{mobile:e.detail.value.mobile,password:e.detail.value.password},
success: function(res) {
if(res.data.status == 0){
wx.showToast({
title: res.data.info,
icon: 'loading',
duration: 1500
})
}else{
wx.showToast({
title: res.data.info,//这里打印出登录成功
icon: 'success',
duration: 1000
})
}
}
})
}
},
})
8.需要注意的是
Page()这个方法是必须有的,里面放置js对象,用于页面加载的时候,呈现效果
data: {},数据对象,设置页面中的数据,前端可以通过读取这个对象里面的数据来显示出来。
formSubmit: function 小程序中方法都是
方法名:function(),其中function可以传入一个参数,作为触发当前时间的对象
下面是函数的执行,由于验证太多,我只拿一部分出来理解。
?
if(e.detail.value.mobile.length==0||e.detail.value.password.length==0){
wx.showToast({
title: '手机号码或密码不得为空!',
icon: 'loading',
duration: 1500
})
这里的e,就是当前触发事件的对象,类似于html
οnclick=“foo(this)”this对象,小程序封装了许多内置的调用方法,e.detail.value.mobile
就是当前对象name=”mobile”的对象的值e.detail.value.mobile.length就是这个值的长度
showToast类似于JS中的alert,弹出框,title 是弹出框的显示的信息,icon是弹出框的图标状态,目前只有loading
和success这两个状态。duration是弹出框在屏幕上显示的时间。
9.重点来了
?
wx.request({
url: 'https://shop.com/home/Login/register',
header: {
"Content-Type": "application/x-www-form-urlencoded"
},
method: "POST",
data:{mobile:e.detail.value.mobile,password:e.detail.value.password},
success: function(res) {
if(res.data.status == 0){
wx.showToast({
title: res.data.info,
icon: 'loading',
duration: 1500
})
}else{
wx.showToast({
title: res.data.info,//这里打印出登录成功
icon: 'success',
duration: 1000
})
}
},
fail:function(){
wx.showToast({
title: '服务器网络错误!',
icon: 'loading',
duration: 1500
})
}
})
wx.request({})是小程序发起https请求,注意http是不行的。
这里
a.url是你请求的网址,比如以前在前端,POST表单中action=‘index.php',这里的index.php是相对路径,而小程序请求的网址必须是网络绝对路径。
比如:https://shop.com/home/Login/register
b.
?
header: {
"Content-Type": "application/x-www-form-urlencoded"
},
由于POST和GET传送数据的方式不一样,POST的header必须是
"Content-Type": "application/x-www-form-urlencoded"
GET的header可以是 'Accept': 'application/json'
c.一定要写明method:“POST” 默认是“GET”,保持大写
data:{mobile:e.detail.value.mobile,password:e.detail.value.password},
这里的data就是POST给服务器端的数据 以{name:value}的形式传送
d.成功回调函数
?
success: function(res) {
if(res.data.status == 0){
wx.showToast({
title: res.data.info,
icon: 'loading',
duration: 1500
})
}else{
wx.showToast({
title: res.data.info,
icon: 'success',
duration: 1000
})
}
}
e.success:function()是请求状态成功触发是事件,也就是200的时候,注意,请求成功不是操作成功,请求只是这个程序到服务器端这条线的通的。
fail:function()就是网络请求不成功,触发的事件。
f.
?
if(res.data.status == 0){
wx.showToast({
title: res.data.info,
icon: 'loading',
duration: 1500
})
}else{
wx.showToast({
title: res.data.info,//这里打印出登录成功
icon: 'success',
duration: 1000
})
}
这里的一段代码是和PHP后端程序有关系的,具体流程是这样的,
1.POST通过数据到https://shop.com/home/Login/register这个接口,用过THINKPHP的就会知道是HOME模块下的Login控制下的register方法
2.register方法根据POST过来的数据,结合数据库进行二次验证,如果操作成功,返回什么,如果操作失败,返回什么
3.后端PHP代码如下:
控制器 LoginController.class.php
?
/**
* 用户注册
*/
public function register()
{
if (IS_POST) {
$User = D("User");
if (!$User->create($_POST, 4)) {
$this->error($User->getError(),'',true);
} else {
if ($User->register()){
$this->success('注册成功!','',true);
}else{
$this->error('注册失败!','',true);
}
}
}
}
模型
UserModel.class.php 的register方法
?
public function register()
{
$mobile = I('post.mobile');
$password = I('post.password');
$res = D('User')->add(array(
'mobile'=> $mobile,
'password'=>md5($password),
'modifytime'=>date("Y-m-d H:i:s")
));
return $res;
}
以上就是微信小程序php后端的开发实例详解了,包括开发所需要的全部小程序代码,小编详细大家都能很快地了解微信小程序php后端并学会怎样去开发。更多相关资料请关注微信小程序素材网。
微信php开发实例,微信小程序php后端开发实例相关推荐
- 微信 商店服务器,对比saas小程序,云开发,微信小商店
原标题:对比saas小程序,云开发,微信小商店 要做一个小程序,大部分人都知道找第三方的服务商,开通账号,然后把数据内容都放在别人家的服务器中,使用人家提供的免费功能. 但,你有没有想过,如果这家服务 ...
- 微信开发众筹项目视频教学小程序+java后端开发+mysql数据库
用HBuilder X开发微信小程序,java后端开发工具idea,mysql数据库,主要功能有:用户管理.分类列表.分类金额.众筹列表.订单列表.系统设置.权限分配 源码下载地址:>>& ...
- 微信小程序java后端开发记录(三):模板消息推送
·模板消息推送 1.1推送参数dto: 按照文档逐层次封装请求参数. 这些参数 /*** @author hanyy* @Description: 微信小程序模板消息推送参数* @date 2019/ ...
- 微信小程序的云开发以及与传统开发的比较
一.微信小程序的云开发概念 云开发就是一套解决小程序前后端开发的一种云端能力 它提供了一整套云服务及简单.易用的 API 和管理界面,以尽可能降低后端开发成本,让开发者能够专注于核心业务逻辑的开发.尽 ...
- 微信小程序开发登录界面mysql_微信小程序 欢迎界面开发的实例详解
微信小程序 欢迎界面 市面上大多数的app都会有一个欢迎界面,下面将演示如何通过微信小程序实现一个欢迎界面. 下面将会按照以下的顺序介绍: 布局的实现 逻辑的实现 样式的实现 1.布局的实现 整个布局 ...
- php欢迎界面代码,分享微信小程序欢迎界面开发的实例代码
这篇文章主要分享微信小程序欢迎界面开发的实例代码的相关资料,这里实现欢迎界面的简单实例和实现代码及实现效果图,需要的朋友可以参考下 微信小程序 欢迎界面 市面上大多数的app都会有一个欢迎界面,下面将 ...
- php小程序开发实例,微信小程序全局配置开发实例
本文主要和大家分享微信小程序全局配置开发实例,主要以代码的形式和大家分享,希望能帮助到大家. 一.app.json 使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设 ...
- 快速了解微信小程序的使用,一个根据小程序的框架开发的todos app
微信官方已经开放微信小程序的官方文档和开发者工具.前两天都是在看相关的新闻来了解小程序该如何开发,这两天官方的文档出来之后,赶紧翻看了几眼,重点了解了一下文档中框架与组件这两个部分,然后根据简易教程, ...
- 微信小程序image组件开发程序以及相关图片问题参考资料汇总
微信小程序image组件开发程序以及相关图片问题参考资料汇总,希望对大家小程序开发能有一定的参考和借鉴价值.以下汇总主要涉及到微信小程序image组件有关资源路径.缩放和剪裁模式等进行的探讨,无论是对 ...
- eslint不报错 vue_2-2【微信小程序全栈开发课程】index页面搭建--ESlint格式错误
1.修改入口文件 也就是src/pages/index/main.js文件 main.js是入口文件,通过main.js来加载index.vue文件.每个页面文件夹中都要有main.js文件 //加载 ...
最新文章
- mac上mysql关闭不了了_python操作mysql数据库
- glm.fit Warning Messages in R: algorithm didn’t converge probabilities 0/1
- 最新加州自动驾驶报告出炉,两家中国公司名列全球前五
- 如何修改远程登录端口号?
- ECC-based 算法(ECDSA/ECDH) 新潮算法的原理
- Caffe和MATLAB
- 关于地理信息系统(GIS)的几个问题
- vue2.0 #$emit,$on的使用
- 【qduoj】【超级楼梯进阶版】
- Spring2..5整合Ehacahe
- 初学计算机语言者(C语言,C++,java,pytion,C#)
- 开课吧:分享C++代码的整洁之道!
- 《管理3.0》读书笔记
- 《终极算法》阅读笔记与摘要(1)-序和第1-2章
- Excel如何将两列数据左右调换位置
- 第三部分 数据结构 -第一章 栈-1357:车厢调度(train)
- 狼性教育——让孩子成为主宰命运地强者
- 机器学习入门之PCA与ICA
- 现在完成时与其他时态的区别
- 技美知识学习3300:TESS and GS
热门文章
- java:单例模式的五种实现方式
- 深入浅出、通俗易懂的讲解CAN bus。
- Tomcat9-默认登录名/密码
- html5 js打开新页面,JavaScript实现按Ctrl键打开新页面_javascript技巧
- c语言打印五角星图案解锁教程,[星星图案解锁设计教程]PS制作星星图案教程
- forge下载java_我的世界forge1.9.4
- Java我的世界forge安装失败,我的世界forge安装失败install怎么办
- UART协议TTL电平接口高性能低功耗SI4463无线透传通信模块
- 信捷XD5程序+TG765触摸屏程序,功能为XY双轴排版机
- 图解机器学习chapter01