0

0

前端后台的交互的一个实例分享

零下一度

零下一度

发布时间:2017-06-26 14:44:22

|

3694人浏览过

|

来源于php中文网

原创

  这一周呢,本k在大神的指导下,完成了一个利用ajax与php文件上传处理相结合的一个留言板功能的小实例,下面就让本k来带大家瞅瞅如何实现这一种功能。

一、界面概览

首先我们来看一下这个小demo的具体效果。

这个demo中,主要包括了三个步骤,也分别对应了三个功能,分别是注册,登录与留言板功能。而这三个功能基本都借助了前后台交互的几种技术,下面,本K就给大家分别展示一下这三个功能实现的代码。

二、功能实现

1、注册功能与登录功能

1.1 代码展示

1.1.1 注册功能

立即学习前端免费学习笔记(深入)”;

(1)前段部分

用户注册
    
用户注册

(2)后台部分

0){echo "true";
    }else{echo "false";
    }

(3)用户数据存储文件

userName=123&pwd=123&rePwd=123[;]// 这其实是一个普通的txt文件,就是后台部分的user.txt

1.1.2 登录功能

(1)前端部分

用户登录
    
用户登录

(2)后台部分

 

1.2 功能详述

  用户注册与登录功能的实现的主要依赖有三个,分别是ajax向后台传递数据并接受结果,php后台对ajax发来的数据进行后台处理并反馈结果,用户数据的接收与存储(这一点其实可以化作后台处理部分)。

1.2.1 前端详述

  前端部分的主要任务是接收用户发来的信息并向后台传递,而这部分任务的实现主要依靠两行代码。

  首先我们看一下ajax发送请求这一部分是如何实现的。这一部分功能的实现主要就依靠两行代码。

  第一行代码是  var str = $("form").serialize();  这一行的功能就是将form表单中提交的数据序列化成一字符串,具体实现如下图

  

  将form表单中的提交数据序列化是为了后台能够更好的解析这一部分。

佳可商务购物程序 2004
佳可商务购物程序 2004

在原版的基础上做了一下修正评论没有提交正文的问题特价商品的调用连接问题去掉了一个后门补了SQL注入补了一个过滤漏洞浮动价不能删除的问题不能够搜索问题收藏时放入购物车时出错点放入购物车弹出2个窗口修正主题添加问题商家注册页导航连接问题销售排行不能显示更多问题热点商品不能显示更多问题增加了服务器探测 增加了空间使用查看 增加了在线文件编辑增加了后台管理里两处全选功能更新说明:后台的部分功能已经改过前台

下载

  而另一行关键代码就是ajax请求的主体部分,这一部分主要让人比较难搞明白的是接受的 data 参数。data 参数是ajax请求相对应后台处理完成后,后台给前台反馈的一个信息,就比如说注册成功以后所返回的true与失败以后所返回的false。

1.2.2 后台详述

  后台对前端传来数据的处理关键在于如何获取、解析传来的数据。这一部分,PHP给我们提供了三行代码来实现。

  第一行代码: $str = $_POST["formData"]; 通过超全局数组 $_POST 获得前台传来的序列化好的字符串,这就解决了数据的获取部分。

  第二行代码: file_put_contents("user.txt", $str,FILE_APPEND); PHP提供给我们的file_putt_contents(),让我们可以将我们获得的数据储存到一个文件中长久保留。

  第三行代码: file_get_contents("user.txt"); 这是PHP提供给我们与file_putt_contents()相对应的数据提取的方法。

  依靠以上三行代码,再加上我们对数据解析后的处理,我们就可以在后台轻松的对整个功能进行实现。

2、留言功能

2.1 代码展示

(1)前端部分


留言内容


(2)后台部分

// 笔记的添加$userName,"time"=>$time,"noteVal"=>$noteVal];    $str = json_encode($arr);    $num = file_put_contents("note.txt", $str."[;]",FILE_APPEND);    if($num>0){echo "true";
    }else{echo "false";
    }
// 笔记的展示

(3)留言数据储存文件

// 这也是一个用于存储留言内容等各种信息的TXT文件{"userName":"123","time":"2017\u5e746\u670818\u65e514:01:12","noteVal":"123123"}[;]{"userName":"123","time":"2017\u5e746\u670818\u65e514:01:28","noteVal":"\u54c8\u54c8\u54c8\uff0c\u6211\u662f\u5c0fK\uff0c\u6211\u4e3a\u81ea\u5df1\u4ee3\u8a00\u3002"}[;]

2.2 功能详述

2.1.1 前端部分

  前端部分的作用无异于登录注册功能,只不过根据要求多了对当前日期、用户名数据、留言版样式的获取。

2.1.2 后台部分

  后台部分其实和登陆注册的后台实现是一个套路,不过比两个要多了一步。 json_encode($arr); 这是PHP提供给我们的将数组转化成JSON对象格式的方法,这就方便了我们在前端对留言数据的反馈获取。

 

以上就是本K首次在这个星期给大家带来的小功能demo,希望能够帮到大家,如有错误,敬请指正,谢谢您的支持!

 

相关专题

更多
php与html混编教程大全
php与html混编教程大全

本专题整合了php和html混编相关教程,阅读专题下面的文章了解更多详细内容。

6

2026.01.13

PHP 高性能
PHP 高性能

本专题整合了PHP高性能相关教程大全,阅读专题下面的文章了解更多详细内容。

6

2026.01.13

MySQL数据库报错常见问题及解决方法大全
MySQL数据库报错常见问题及解决方法大全

本专题整合了MySQL数据库报错常见问题及解决方法,阅读专题下面的文章了解更多详细内容。

6

2026.01.13

PHP 文件上传
PHP 文件上传

本专题整合了PHP实现文件上传相关教程,阅读专题下面的文章了解更多详细内容。

5

2026.01.13

PHP缓存策略教程大全
PHP缓存策略教程大全

本专题整合了PHP缓存相关教程,阅读专题下面的文章了解更多详细内容。

3

2026.01.13

jQuery 正则表达式相关教程
jQuery 正则表达式相关教程

本专题整合了jQuery正则表达式相关教程大全,阅读专题下面的文章了解更多详细内容。

1

2026.01.13

交互式图表和动态图表教程汇总
交互式图表和动态图表教程汇总

本专题整合了交互式图表和动态图表的相关内容,阅读专题下面的文章了解更多详细内容。

15

2026.01.13

nginx配置文件详细教程
nginx配置文件详细教程

本专题整合了nginx配置文件相关教程详细汇总,阅读专题下面的文章了解更多详细内容。

4

2026.01.13

nginx部署php项目教程汇总
nginx部署php项目教程汇总

本专题整合了nginx部署php项目教程汇总,阅读专题下面的文章了解更多详细内容。

5

2026.01.13

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
从PHP基础到ThinkPHP6实战
从PHP基础到ThinkPHP6实战

共126课时 | 21.9万人学习

Flutter从零到APP上架
Flutter从零到APP上架

共104课时 | 35.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号