微信小程序前端界面和后端服务器(PHP)的对接
2018-07-12 06:51
513 查看
关于微信小程序的界面编写的资料和书籍比比皆是,很容易找到。也就是说似乎大家都忙于处理表面的皮的技术的专研,但我一直好奇这层皮和后端服务器是如何通信交流的,如何实现信息交换的。所以本文重点研究这部分知识。
1、-- 最简单的前端和后端通信的例程
前端:*.wxml里创建一个按钮,调用函数newBtnDown, 在*.js的newBtnDown函数里调用
*.wxml <view> <button bindtap="newBtnDown">和后台交流</button> </view>//在*.js的newBtnDown函数里调用wx.request(): url 是要访问的php文件网址,data{}是要传递给后台的数据(本例有两个变量,一个是userName,一个是passWord), method: "GET" / "POST", header: 默认采用 'content-type': 'application/json'}, 返回值:成功时 success: function(res), 返回值在res里,本例调用wx.showModal, 显示提示信息窗体,显示返回值是什么。失败时 fail: function(res)。
*.js newBtnDown() { wx.request({ url: 'https://www.tuozhirobot.com/php/test.php', data: { userName: 'Tiger0817', passWord: '12345', }, method: 'GET', header: { 'content-type': 'application/json' }, success: function (res) { console.log(res.data) wx.showModal({ title: '提示', content: res.data, }) }, fail: function (res) { wx.showModal({ title: '提示', content: res.data, }) } }) },//后端(php代码):<?php ... ... ?>表示php代码范围。$_GET["userName"],和$_GET["passWord"], 从前端读取这两个变量到后端,注意要保证前端的变量名和后端的变量名称一致,否则会交流失败。然后是php技术,根据的你设想处理变量/换算。最后输出 echo 返回信息,本例中,返回 userName + passWord + dateTime
test.php <?php $userName=$_GET["userName"]; $passWord=$_GET["passWord"]; $dateTime=date("Y/m/d H:i:s"); echo $userName.$passWord.$dateTime; ?>//按钮界面如下图
//点击按钮,返回正确结果时的运行结果如下图,在php函数中,userName + passWord + dateTime 然后返回。
// 当前端传入的数据不正确,变量名不一致时,给出下面的错误提示
// 后续还会有更新
阅读更多
相关文章推荐
- 微信小程序上传图片到php服务器
- 前端php加后端golang微信发红包
- 微信小程序开发视频教程学习(第2天):上午前端下午PHP
- 微信小程序支付 后端PHP(二)
- 微信小程序 PHP后端form表单提交实例详解
- 微信小程序前端界面快速生成工具
- 微信小程序实现图片上传功能实例(前端+PHP后端)
- 微信小程序支付php后台对接
- 利用php做服务器和web前端的界面进行交互(简单易懂篇)
- 微信小程序登陆及登陆状态保持前后端php代码 缓存redis
- 一键搭建微信小程序开发环境 及demo运行(腾讯云上一键搭建node.js服务器环境,PHP,Java,.NET服务类似)
- 微信小程序前端的json数值传到后端时,引号"前都会多一个\的解决.
- 微信小程序 PHP后端form表单提交实例详解
- 微信小程序开发视频教程学习(第3天):上午前端下午PHP
- 微信小程序图片选择、上传到服务器、预览(PHP)实现实例
- 利用php做服务器和web前端的界面进行交互
- 微信小程序实现红包功能(后端PHP实现逻辑)
- 微信小程序图片选择、上传到服务器、预览(PHP)实现实例
- 微信小程序前端界面切片工具软件
- 微信小程序本地开发环境配置-php后端