前端与后端的交互--(PHP)

一、搭建环境--WAMP

WAMP是指开发者在Windows操作系统下使用这些Linux环境里的工具称为使用WAMP。WAMP中的W代表windows，A代表apache，M代表mysql，P代表php。WAMP是一个强大的Web应用程序平台。

而phpstudy是一个可以快速搭建WAMP环境的web开发环境，安装就能使用。phpstudy集中了多个PHP的版本，把php后缀的文件放到网站根目录，用浏览器访问就可以把脚本当作php代码进行解析。

phpstudy下载地址：Windows版phpstudy下载 - 小皮面板(phpstudy) (xp.cn)

下载好后是一个zip后缀的压缩包，点开傻瓜式安装就可以了。最后会问你要不要更新，可更可不更，但是我这里推荐还是不要更新，避免一些玄学问题。

打开后如下图。打开后提示下载vc9，直接关闭即可，不影响使用，每次打开都要关一次，嫌麻烦也可以安装一下。自此环境搭建完毕！

把文件或者文件夹放到网站根目录，在PHP study面板点击其他选项菜单-->网站根目录。浏览器URL输入栏处输入本机ip再跟上文件名或者文件夹名/文件名。

二、前后端的交互

我展示一下我写的自我介绍表单

当输入不符合编写的规则时，输出提示。

浏览器URL输入栏处输入本机ip再跟上文件名或者文件夹名/文件名进行访问。

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>香蕉你个苹果菠萝批</title><style type="text/css">span{color: red;}</style></head><body><?php//定义变量并默认值设置为空,所有变量初始化$name=$email=$zuoym=$diqu=$nianl=$gender="";$nameErr=$emailErr=$nianlErr=$genderErr="";if($_SERVER["REQUEST_METHOD"] == "POST"){//传输值进来，判断name值是否为空if(empty($_POST["name"])){$nameErr = "名字必须填写哦";}else{$name = abc($_POST["name"]);//正则检测名字是否只包含字母跟空格if(!preg_match("/^[a-zA-Z ]*$/",$name)){$nameErr = "只能是字母和空格哦";}}if(empty($_POST["email"])){$emailErr = "邮箱必须填写哦";}else{$email = abc($_POST["email"]);//正则检测电子邮件是否合法if(!preg_match("/([\w\-]+\@[\w\-]+\.[\w\-]+)/",$email)){$emailErr = "非法邮箱";$email = "邮箱不对哦";}}if(empty($_POST["nianl"])){$nianlErr = "年龄必须填写哦";}else{$nianl = abc($_POST["nianl"]);//正则检测用户输入的是否为数字if(!preg_match("/^\d*$/",$nianl)){$nianlErr = "只能输入数字";}}if(empty($_POST["zuoym"])){$zuoymErr = "";}else{$zuoym = abc($_POST["zuoym"]);}if(empty($_POST["diqu"])){$diquErr = "";}else{$diqu = abc($_POST["diqu"]);}if(empty($_POST["gender"])){$genderErr = "性别是必须选的哦";}else{$gender = abc($_POST["gender"]);}}//定义函数过滤危险字符function abc($asd){$asd = trim($asd);$asd = stripslashes($asd);$asd = htmlspecialchars($asd);return $asd;}?><h1>自我介绍</h1><p><span>*为必填字项</span></p><form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post">名字：<input type="text" name="name" value="<?php echo $name;?>" /><span>*<?php echo $nameErr;?></span><br><br>年龄：<input type="text" name="nianl" value="<?php echo $nianl;?>" /><span>*<?php echo $nianlErr;?></span><br><br>邮箱：<input type="text" name="email" value="<?php echo $email;?>" /><span>*<?php echo $emailErr;?></span><br><br>性别：<input type="radio" name="gender" <?php if(isset($gender) && $gender=="woman") echo "checked";?> value="woman" />女<input type="radio" name="gender" <?php if(isset($gender) && $gender=="man") echo "checked";?> value="man" />男<span>*<?php echo $genderErr;?></span><br><br>现居：<input type="text" name="diqu"><br><br>座右铭：<textarea rows="5" cols="40" name="zuoym"><?php echo $zuoym;?></textarea><br><br>   <input type="submit" name="submit" value="提交" /></form><?phpecho "<p>你输入的信息是：</p>";echo $name;echo "<br>";echo $nianl;echo "<br>";echo $email;echo "<br>";echo $gender;echo "<br>";echo $diqu;echo "<br>";echo $zuoym;echo "<br>";?></body>
</html>

写的很简单，目的是学会前后端是怎么交互的就行。

最后，我负责公开代码，你负责点赞关注！谢谢浏览

前端与后端的交互--(PHP)相关推荐

python的前端和后端_python前端和后端数据交互，tornado框架入门，初学小试牛刀！...
Python前端和后端是如何交互的,怎么用tornado框架快速搭建前端和后端数据交互? 前端与后端的数据交互,最常用的就是GET.POST,比较常用的用法是:提交表单数据到后端,后端返回json 前 ...
java后端与前端的交互_前端和后端数据交互的基本知识和常见方式
一.首先了解前端,后端,数据三者的关系. 1.前端常常是是html,css,js三者的构成的页面的总称.运行在客户端.以浏览器为例. 2.后端常常是后端语言.比如php,java等写的一些脚本.来操作 ...
前端和后端数据交互的基本知识
一.首先了解前端.后端.数据三者的关系 1) 前端通常是html,css,js三者构成的页面的总称.运行在客户端.以浏览器为例. 2) 后端是指后端程序.比如java,php等编写的一些服务.用来操作 ...
前后端分离模式下前端与后端数据交互
下面举的例子就是使用jQuery Ajax和Python Flask进行前后端交互时,前端提交表单数据到后端,后端返回JSON数据给前端. 前端GET提交表单数据: # GET请求var data = ...
Vue中前端与后端如何交互？
Vue中前后端交互 Promise的基本使用基本使用多个请求,链式编程 Promise的API---实例方法 Promise的API---对象方法(直接通过Promise函数名称调用的方法) 接口 ...
前端和后端如何进行交互？
背景目前互联网应用呈现方式基本都是app客户端和web端,其次是移动网站和小程序.以app客户端或web端为例子(统一认为前端),前端负责用户的交互与数据收集与展示,数据经后台处理存储在数据库.设计 ...
认识计算机前端和后端
1.前后端认知什么是前端? 什么是后端? 什么是数据库? 前端: 用户的可见界面数据展示在页面上给用户看到后端: 把前端的数据存储到数据库把数据库的数据传递给前数据库: 存储数据的" ...
python的前端和后端_前端与后端的数据交互（jquery ajax+python flask）
前端与后端的数据交互,最常用的就是GET.POST,比较常用的用法是:提交表单数据到后端,后端返回json 前端的数据发送与接收 1)提交表单数据 2)提交JSON数据后端的数据接收与响应 1)接收 ...
前端和后端是如何实现交互的
前端和后端是如何交互的 1.前端请求数据URL由谁来写在开发中,URL主要是由后台来写好给前端. 若后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端提供相关的查询参数( ...

前端与后端的交互--(PHP)

前端与后端的交互--(PHP)相关推荐

最新文章

热门文章