用wamp及sublime制作一个登录界面 并用php接收表单数据
- 安装并配置wamp
第一步是最必要也是最困难的一步,在wamp的安装目录里找到
D:\wamp\bin\apache\apache2.4.9\conf文件夹内的httpd.conf文件,用记事本即可打开,在所有文字的最后加上如下代码:
NameVirtualHost *:80
<VirtualHost *:80>
#域名的配置,每个虚拟机都有一个域名对应
ServerName localhost
#设定网站的目录
DocumentRoot "D:/wamp/www"
#给目录指定访问权限
<Directory "D:/wamp/www">
Order Deny,Allow
Allow from all
</Directory>
#给默认的首页
Options Indexes FollowSymLinks
</VirtualHost>
<VirtualHost *:80>
#域名的配置,每个虚拟机都有一个域名对应
ServerName www.f.com
#设定网站的目录
DocumentRoot "D:/wamp/www/f.com"
#给目录指定访问权限
<Directory "D:/wamp/www/f.com">
Order Deny,Allow
Allow from all
</Directory>
#给默认的首页
Options Indexes FollowSymLinks
</VirtualHost>
上面的两段代码分别配置了localhost和f.com两个网站,如果想继续配置更多网站,复制粘贴并更改绿色部分的路径即可。(配置网站的同时需要在/wamp/www/文件夹中新建同名文件夹)
之后运行wamp,浏览器访问localhost成功,但访问www.f.com显示找不到网页。
首先检查httpd.conf中的路径有没有错误,并没有。。。
解决方法是找到C:\Windows\System32\drivers\etc中的hosts文件,同样用记事本打开,最下面一行本来就有
127.0.0.1 localhost
在后面添加
127.0.0.1 www.f.com
保存,重启wamp,浏览器访问www.f.com,成功。(不知道为什么)
- 在f.com文件夹中新建一个html文件,代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<h2>登录界面</h2>
<form action="loginaf.php" method="post" >
用户:<input type="text" name="username"/><br>
密码:<input type="password" name="password"><br>
<input type="submit" name="submit" value="提交" >
</form>
</body>
</html>
其中头文件中用于解决中文乱码问题
form表单的action属性代表提交至loginaf.php(同在f.com文件夹中)这个文件
method属性表示提交方式为post,post和get的区别还不是很清楚,听说post安全,就用了。
- 最后是用php接收表单提交的数据
php代码:
<?php
$name=$_POST['username'];
$password=$_POST['password'];
echo 'Hello,world!<br>';
echo $name;
echo '<br>';
echo $password;
接收方式是自己查的,B站视频里没讲到。要注意【】中的变量名和html文件中“name= ”后的变量名一样,才能接收到需要的数据。(好像是吧)
重启wamp,打开www.f.com,效果:
输入数据点提交,跳转到loginaf.php
over.