针对多用户实现头像上传功能PHP代码 适用于登陆页面制作


Posted in PHP onAugust 17, 2016

一个网站,其实说白了就是某几个特定功能的组合,而更换用户头像就在这些功能之中。今天就来做个测试,针对不同的用户,实现头像上传功能。

--------------------------------------------------------------------------------

成品图

针对多用户实现头像上传功能PHP代码 适用于登陆页面制作

思路
 •针对不同的用户上传头像,我们要为每一个已登录的用户创建一个文件夹,文件夹的名称以当前用户的用户名为准。

 •用户上传成功后,跳转到用户登录成功后的页面,并刷新用户头像。

登陆页面

表单制作

<form role="form" action="./forindex.php">
 <div class="form-group">
 <label for="name">用户名</label>
 <input type="text" class="form-control" id="username" name="username"
  placeholder="请输入名称">
 </div>
 <div class="form-group">
 <label for="inputfile">文件输入</label>
 <input type="password" id="inputfile" name="password">
 <p class="help-block">这里是块级帮助文本的实例。</p>
 </div>
 <div class="form-group">
 <label>请输入验证码</label>
 <input type="text" id="checkcode" name="checkcode" />
 <img id="imagecheckcode" src="./store.php?r=<?php echo rand();?>" /><a href="javascript:void(0);" onclick="change()" >看不清</a>
 </div>
 <script>
 function change(){
  document.getElementById("imagecheckcode").src = "./store.php?r="+ Math.random(); 
 }

 </script>
 <button type="submit" class="btn btn-default">提交</button>
</form>

验证码制作

<?php
session_start();// 必须在php的最开始部分声明,来开启session


// 使用gd的imagecreatetruecolor();创建一张背景图
$image = imagecreatetruecolor(100,40);

// 生成填充色
$bgcolor = imagecolorallocate($image,255,255,255);
// 将填充色填充到背景图上
imagefill($image,0,0,$bgcolor);

//////// 生成随机4位字母以及数字混合的验证码
$checkcode='';
for($i=0;$i<4;$i++){
 $fontsize = rand(6,8);
 $fontcolor = imagecolorallocate($image,rand(0,255),rand(0,255),rand(0,255));
 // 为了避免用户难于辨认,去掉了某些有歧义的字母和数字
 $rawstr = 'abcdefghjkmnopqrstuvwxyz23456789';
 $fontcontent = substr($rawstr,rand(0,strlen($rawstr)),1);
 // 拼接即将诞生的验证码
 $checkcode.=$fontcontent;
 // 避免生成的图片重叠
 $x += 20;
 $y = rand(10,20);
 imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor); 
}
// 保存到session变量中
$_SESSION['checkcode']=$checkcode;

// 生成一些干扰的点,这里是200个
for($i=0;$i<200;$i++){
 $pointcolor = imagecolorallocate($image,rand(50,255),rand(50,255),rand(50,255));
 imagesetpixel($image,rand(0,100),rand(0,30),$pointcolor);
}
// 生成一些干扰线 这里是4个
for($i=0;$i<4;$i++){
 // 设置为浅色的线,防止喧宾夺主
 $linecolor = imagecolorallocate($image,rand(50,255),rand(50,255),rand(50,255));
 imageline($image,rand(0,99),rand(0,29),rand(0,99),rand(0,29),$linecolor);

}


header('content-type:image/png');

imagepng($image);

// 释放资源,销毁执行对象
imagedestroy($image);

JavaScript刷新验证码

<a href="javascript:void(0);" onclick="change()" >看不清</a>
<script>
 function change(){
  document.getElementById("imagecheckcode").src = "./store.php?r="+ Math.random(); 
 }
</script>

验证页面

由于本次试验最核心的是对用户头像的更换,所以用户名我们暂且不管,以Root为准。

验证逻辑

<?php
 session_start();
 header("Content-Type:text/html;charset=utf-8");

 $username = $_REQUEST['username'];
 $password = $_REQUEST['password'];
 if(strtolower($_REQUEST['checkcode']==$_SESSION['checkcode'])){
 if(!is_dir($username)){
  mkdir($username);
 }
 echo "恭喜您,登陆成功!"."<br />3秒后将自动跳转到个人主页!";
 $_SESSION['username'] = $username;
 header("refresh:3;url=./personalpage.php");


 }else{
 echo "对不起,登陆失败了!";
 header("refresh:3;url=./index.php");
 //echo "<script>window.location.href='./index.php'</script>"; 
 }

页面跳转

在PHP中,要先实现页面的跳转,有很多方式。本文使用了增加header信息的方式,下面介绍几个关于页面跳转的小实例。

header函数

< ?php 
//重定向浏览器
header("Location: http://blog.csdn.net/marksinoberg"); 
//确保重定向后,后续代码不会被执行 
exit;
?>

注意:Location和:之间不能有空格 

Meta标签

<   meta   http-equiv = "refresh"  content = "1;url=http://blog.csdn.net/marksinoberg" >

注意: content可以控制在几秒之内完成跳转。 

JavaScript

< ?php 
$ url = "http://bbs.lampbrother.net" ; 
echo " < script language = 'javascript' 
type = 'text/javascript' > "; 
echo " window.location.href = '$url' "; 
echo " < /script > "; 
?>

注意: 使用JavaScript方式,代码放置的位置可以随意,只要是符合语法要求即可。 

上传页面

个人主页

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php session_start(); echo $_SESSION['username']."的个人主页"; ?></title>
<style>
 img {
 width:128px;
 height:auto; 
 }
</style>
</head>

<body>

<div>
 <img id="userphoto" src="./root/lover.png" /><br />
 <form action="./uploadphoto.php" method="post" enctype="multipart/form-data">
 <input type="file" name="photo" />
 <input type="submit" onclick="uploadphoto()" value="上传新头像"/>
 </form>
 <script>
 function uploadphoto(){
  document.getElementById("userphoto").src = "./root/<?php echo $_SESSION['username'];?>.png"
 }
 window.onload = function(){
  uploadphoto(); 
 }

 </script>
</div>



</body>
</html>

上传核心

上传的核心还是一个表单,我们把要进行上传的图片上传到服务器,然后php使用move_uploaded_file来实现文件的迁移,实现上传。

<?php
 session_start();
 header("Content-Type:text/html;charset=utf-8");
// 附件的存储位置、附件的名字
$path = "./root/";

$username = $_SESSION['username'];
// 拼接成该文件在服务器上的名称
$server_name = $path.$username.".png";


if($_FILES['photo']['error']>0) {
 die("出错了!".$_FILES['photo']['error']); 
}
if(move_uploaded_file($_FILES['photo']['tmp_name'],$server_name)){
 //echo "<BR>"."Upload Success!";
 echo "恭喜您,上传成功!"."<br />3秒后将自动跳转到个人主页!"; 
 header("refresh:3;url=./personalpage.php");
}else{
 //echo "<BR>"."Upload Failed!".$_FILES['photo']['error']; 
 echo "对不起,上传头像失败了!";
 header("refresh:2;url=./index.php");
}
?>

最终结果

登陆页面

针对多用户实现头像上传功能PHP代码 适用于登陆页面制作

验证结果

针对多用户实现头像上传功能PHP代码 适用于登陆页面制作

个人主页

针对多用户实现头像上传功能PHP代码 适用于登陆页面制作

最新头像

针对多用户实现头像上传功能PHP代码 适用于登陆页面制作

总结

回顾一下,本次试验的收获。
 •session的开启必须在php文件的开头session_start()
 •php可以实现的页面跳转的方式
 •上传文件
 •验证码制作与使用
 •JavaScript:void(0);的使用核心

大致的内容就是这么多,虽然没有增加美化效果,但是麻雀虽小,五脏也算是俱全了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
关于PHP5 Session生命周期介绍
Mar 02 PHP
php下统计用户在线时间的一种尝试
Aug 26 PHP
php 删除一个数组中的某个值.兼容多维数组!
Feb 18 PHP
PHP登录环节防止sql注入的方法浅析
Jun 30 PHP
smarty简单入门实例
Nov 28 PHP
简单谈谈favicon
Jun 10 PHP
PHP中Http协议post请求参数
Nov 02 PHP
PHP中的随机性 你觉得自己幸运吗?
Jan 22 PHP
PHP Try-catch 语句使用技巧
Feb 28 PHP
PHP导出带样式的Excel示例代码
Aug 28 PHP
php批量修改表结构实例
May 24 PHP
PHP检查端口是否可以被绑定的方法示例
Aug 09 PHP
总结PHP中数值计算的注意事项
Aug 14 #PHP
示例详解Laravel的注册重构
Aug 14 #PHP
PHP实现路由映射到指定控制器
Aug 13 #PHP
Yii2.0中的COOKIE和SESSION用法
Aug 12 #PHP
PHP Oauth授权和本地加密实现方法
Aug 12 #PHP
PHP 读取大文件并显示的简单实例(推荐)
Aug 12 #PHP
PHPWind9.0手动屏蔽验证码解决后台关闭验证码但是依然显示的问题
Aug 12 #PHP
You might like
ThinkPHP分页类使用详解
2014/03/05 PHP
php中操作memcached缓存进行增删改查数据的实现代码
2014/08/15 PHP
ThinkPHP文件缓存类代码分享
2015/04/22 PHP
Laravel路由设定和子路由设定实例分析
2016/03/30 PHP
php获取远程图片并下载保存到本地的方法分析
2016/10/08 PHP
php提供实现反射的方法和实例代码
2019/09/17 PHP
[原创]图片分页查看
2006/08/28 Javascript
javascript 命名规则 变量命名规则
2010/02/25 Javascript
jQuery结合Json提交数据到Webservice,并接收从Webservice返回的Json数据
2011/02/18 Javascript
Jquery.LazyLoad.js修正版下载,实现图片延迟加载插件
2011/03/12 Javascript
javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果代码
2015/08/04 Javascript
简单实现js间歇或无缝滚动效果
2016/06/29 Javascript
JS HTML5拖拽上传图片预览
2016/07/18 Javascript
jquery事件绑定解绑机制源码解析
2016/09/19 Javascript
在vue中添加Echarts图表的基本使用教程
2017/11/22 Javascript
jquery.picsign图片标注组件实例详解
2018/02/02 jQuery
angular2路由之routerLinkActive指令【推荐】
2018/05/30 Javascript
解决IE11 vue +webpack 项目中数据更新后页面没有刷新的问题
2018/09/25 Javascript
js+css3实现炫酷时钟
2020/08/18 Javascript
解决vue数据不实时更新的问题(数据更改了,但数据不实时更新)
2020/10/27 Javascript
Python的Django框架中设置日期和字段可选的方法
2015/07/17 Python
Python 稀疏矩阵-sparse 存储和转换
2017/05/27 Python
python实现mysql的读写分离及负载均衡
2018/02/04 Python
Python爬虫动态ip代理防止被封的方法
2019/07/07 Python
keras model.fit 解决validation_spilt=num 的问题
2020/06/19 Python
Python列表推导式实现代码实例
2020/09/09 Python
html5 冒号分隔符对齐的实现
2019/07/31 HTML / CSS
全球最大的在线橄榄球商店:Lovell Rugby
2018/05/20 全球购物
普天C++笔试题
2016/03/20 面试题
武汉瑞得软件笔试题
2015/10/27 面试题
北大自主招生自荐信
2013/10/19 职场文书
2014年安全生产责任书
2014/07/22 职场文书
亮剑观后感300字
2015/06/05 职场文书
大学同学聚会感言
2015/07/30 职场文书
vue.js 使用原生js实现轮播图
2022/04/26 Vue.js
linux目录管理方法介绍
2022/06/01 Servers