仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 852|回复: 19
打印 上一主题 下一主题

[学习教程] PHP网站制作之基于PHP的AJAX手艺完成文件异步上传

[复制链接]
飘飘悠悠 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-2-4 00:14:13 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
实现固定数量的几张图片的上传;再如调试软件ZendStudio的使用,看了很多次老师的应用,但总感觉用的不顺手,不懂那么多的数据值,到底哪一个才是真正的问题所在;还有如数据库语句的封装,我只会用简单的函数来进行封装。ajax|上传|异步    异步的文件上传是在古代的AJAX完成的Web使用外面常常要碰到,必需处理的成绩。然而尺度的AJAX类(XmlHttpRequest)没法完成传输文件的功效。因而,这里会商的内容就是若何在AJAX的手艺的基本之上构建异步的文件上传功效。在这个功效傍边需求利用到内置的框及(IFRAME)来传输文件。这个功效完成的后果是页面在上传文件的时分,用户还可使用该页面而且填写文件描写。
  这个例子是咱们援用AJAX的经典案例停止剖析的。
  体系情况
  ・ 较新版本的阅读器。例如Opera,Firefox或 Internet Explorer。
  ・ PHP 4.3.0 或更高版本
  ・ PHP 5 版本
  ・ PHP 中的 'short_open_tag' 选项开启(不然会产生解析毛病)。
  功效剖析
  经由过程内置的IFRAME(框架)停止文件上传。具有包含三个局部构成。
  ・ 在页面两头有一个复杂的<form...表单,表单只包括了<input type="file" ... >控件。这个表单的方针链接就是一个埋没得IFRAME(经由过程 CSS的作风" display: none;"完成)而且表单外面独一一个控件的OnChange事务用来触发JavaScript函数。这个函数的感化是反省用户提交的扩大名,然后提交表单。
  ・ 在办事器端用PHP编写了一个处置进程(用FILEFRAME坐正文了)。这个处置进程用来把从客户端上传的文件停止反省后保留在办事器,而且经由过程Javascript代码的模式前往给用户。前往给用户的Javascript剧本经由过程"parent.window.document"更改了用户如今正在检查的页面,设置了文件的称号并启用了让用户提交表单的按钮。启用按钮的操作是经由过程getElementById函数完成的。
  ・ 在主页面还有一个表单,它包括了用户提交的描写和埋没的文件名。用户可以在文件上传的同时填写文件的描写。当文件上传停止今后,用户点击按钮,就能够看上传今后前往给用户的文件信息了。(经由过程前往来的文件名和用户输出的描写组成文件信息)。
  能够你会说这么操作不合适常理:文件在用户确认之前就已被提交了。假如用户没有提交的话,情形会若何呢。你可以本人在扩大处置被用户保持的文件。
  这个例子把文件存储在一个文件体系的目次下。你需求在剧本入手下手运转的时分设置装备摆设下这个目次,详细的包括这个目次信息的变量是$upload_dir 和$web_upload_dir。这里有一个对目次是不是可写的权限反省。
  这里咱们用到了以下几个PHP函数:
  ・ move_uploaded_file - 转移一经上传到办事器的文件
  ・ fopen - 翻开文件
  ・ fwrite - 把内容写入文件
  ・ fclose - 封闭文件
  ・ str_replace - 交换字符串
  ・ filesize - 前往文件巨细
  ・ filemtime - 前往处置工夫
  你可以经由过程手册查到这些函数假如利用。请注重要把HTM(<, >, &)标志交换为(<, > 和 &).
源代码

<?php
$upload_dir = "/var/www/anyexample/aeu"; // 文件存储的途径
$web_upload_dir = "/aeu"; // 文件在Web目次下的途径
$tf = $upload_dir.'/'.md5(rand()).".test";
$f = @fopen($tf, "w");
if ($f == false)
die("Fatal error! {$upload_dir} is not writable. Set 'chmod 777 {$upload_dir}'
or something like this");
fclose($f);
unlink($tf);

//处置上传的文件
if (isset($_POST['fileframe']))
{
 $result = 'ERROR';
 $result_msg = 'No FILE field found';

 if (isset($_FILES['file'])) // 从阅读器承受文件
 {
  if ($_FILES['file']['error'] == UPLOAD_ERR_OK) // 没有毛病
  {
   $filename = $_FILES['file']['name']; // 文件名
   move_uploaded_file($_FILES['file']['tmp_name'], $upload_dir.'/'.$filename);
   // 处置的主进程-转移文件到 $upload_dir
   $result = 'OK';
  }
  elseif ($_FILES['file']['error'] == UPLOAD_ERR_INI_SIZE)
   $result_msg = 'The uploaded file exceeds the upload_max_filesize directive in php.ini';
  else
   $result_msg = 'Unknown error';
 }

 echo '<html><head><title>-</title></head><body>';
 echo '<script language="JavaScript" type="text/javascript">'."\n";
 echo 'var parDoc = window.parent.document;';
 '
 if ($result == 'OK')
 {
  echo 'parDoc.getElementById("upload_status").value = "file successfully uploaded";';
  echo 'parDoc.getElementById("filename").value = "'.$filename.'";';
  echo 'parDoc.getElementById("filenamei").value = "'.$filename.'";';
  echo 'parDoc.getElementById("upload_button").disabled = false;';
 }
 else
 {
  echo 'parDoc.getElementById("upload_status").value = "ERROR: '.$result_msg.'";';
 }

 echo "\n".'</script></body></html>';
 exit();
}

function safehtml($s)
{
 $s=str_replace("&", "&", $s);
 $s=str_replace("<", "<", $s);
 $s=str_replace(">", ">", $s);
 $s=str_replace("'", "'", $s);
 $s=str_replace("\"", """, $s);
 return $s;
}

if (isset($_POST['description']))
{
 $filename = $_POST['filename'];
 $size = filesize($upload_dir.'/'.$filename);
 $date = date('r', filemtime($upload_dir.'/'.$filename));
 $description = safehtml($_POST['description']);

 $html =<<<END
 <html><head><title>{$filename} [uploaded by IFRAME Async file uploader]</title></head>
 <body>
  <h1>{$filename}</h1>
  <p>This is a file information page for your uploaded file. Bookmark it, or send to anyone...</p>
  <p>Date: {$date}</p>
  <p>Size: {$size} bytes</p>
  <p>Description:
  <pre>{$description}</pre>
  </p>
  <p><a href="{$web_upload_dir}/{$filename}" style="font-size: large;">download file</a><br>
  <a href="{$PHP_SELF}" style="font-size: small;">back to file uploading</a><br>
  <a href="{$web_upload_dir}/upload-log.html" style="font-size: small;">upload-log</a></p>
  <br><br>Example by <a href="http://www.anyexample.com/">AnyExample</a>
 </body></html>
 END;
 
 $f = fopen($upload_dir.'/'.$filename.'-desc.html', "w");
 fwrite($f, $html);
 fclose($f);
 $msg = "File {$filename} uploaded,
 <a href='{$web_upload_dir}/{$filename}-desc.html'>see file information page</a>";

 $f = fopen($upload_dir."/upload-log.html", "a");
 fwrite($f, "<p>$msg</p>\n");
 fclose($f);

 setcookie('msg', $msg);
 header("Location: http://".$_SERVER['HTTP_HOST'].$PHP_SELF);
 exit();
}

if (isset($_COOKIE['msg']) && $_COOKIE['msg'] != '')
{
 if (get_magic_quotes_gpc())
  $msg = stripslashes($_COOKIE['msg']);
 else
  $msg = $_COOKIE['msg'];
  setcookie('msg', '');
}
?>
<!-- Beginning of main page -->
<html><head>
<title>IFRAME Async file uploader example</title>
</head>
<body>
<?php
 if (isset($msg))
  echo '<p style="font-weight: bold;">'.$msg.'</p>';
?>
<h1>Upload file:</h1>
<p>File will begin to upload just after selection. </p>
<p>You may write file description, while you file is being uploaded.</p>

<form action="<?=$PHP_SELF?>" target="upload_iframe" method="post" enctype="multipart/form-data">
 <input type="hidden" name="fileframe" value="true">
 <!-- Target of the form is set to hidden iframe -->
 <!-- From will send its post data to fileframe section of this PHP script (see above) -->

 <label for="file">text file uploader:</label><br>
 <!-- JavaScript is called by OnChange attribute -->
 <input type="file" name="file" id="file" >
</form>
<script type="text/javascript">
/* This function is called when user selects file in file dialog */
function jsUpload(upload_field)
{
 // this is just an example of checking file extensions
 // if you do not need extension checking, remove
 // everything down to line
 // upload_field.form.submit();
 
 var re_text = /\.txt|\.xml|\.zip/i;
 var filename = upload_field.value;

 /* Checking file type */
 if (filename.search(re_text) == -1)
 {
  alert("File does not have text(txt, xml, zip) extension");
  upload_field.form.reset();
  return false;
 }

 upload_field.form.submit();
 document.getElementById('upload_status').value = "uploading file...";
 upload_field.disabled = true;
 return true;
}
</script>
<iframe name="upload_iframe" style="width: 400px; height: 100px; display: none;">
</iframe>
<!-- For debugging purposes, it's often useful to remove
"display: none" from style="" attribute -->

<br>
Upload status:<br>
<input type="text" name="upload_status" id="upload_status"
value="not uploaded" size="64" disabled>
<br><br>

File name:<br>
<input type="text" name="filenamei" id="filenamei" value="none" disabled>

<form action="<?=$PHP_SELF?>" method="POST">
 <!-- one field is "disabled" for displaying-only. Other, hidden one is for sending data -->
 <input type="hidden" name="filename" id="filename">
 <br><br>

 <label for="photo">File description:</label><br>
 <textarea rows="5" cols="50" name="description"></textarea>

 <br><br>
 <input type="submit" id="upload_button" value="save file" disabled>
</form>
<br><br>
<a href="<?=$web_upload_dir?>/upload-log.html">upload-log</a>
<br><br><br>

Example by <a href="http://www.xrss.cn/">AnyExample</a>
</body>
</html>

  以上的解说就是供应一种思绪供人人参考。人人也能够依据本人的需求停止响应的优化。
对于PHP的语法结构,刚开始真的很不习惯,真搞不懂为什么每个变量之前都要加个“$”符号,每个语句写完之后都必须加上“分号”来表示此句已经结束,还有,PHP对字母的大小写是敏感的,写的时候一定要注意大小写的区别。
深爱那片海 该用户已被删除
沙发
发表于 2015-2-4 10:03:47 | 只看该作者
为了以后维护的方便最好是代码上都加上注释,“予人方便,自己方便”。此外开发文档什么的最好都弄齐全。我觉得这是程序员必备的素质。虽然会消耗点很多的时间。但是确实是非常有必要的。
活着的死人 该用户已被删除
板凳
发表于 2015-2-8 12:11:13 | 只看该作者
为了以后维护的方便最好是代码上都加上注释,“予人方便,自己方便”。此外开发文档什么的最好都弄齐全。我觉得这是程序员必备的素质。虽然会消耗点很多的时间。但是确实是非常有必要的。
冷月葬花魂 该用户已被删除
地板
发表于 2015-2-12 11:01:49 | 只看该作者
刚开始安装php的时候,我图了个省事,把php的扩展全都打开啦(就是把php.ini 那一片 extension 前面的冒号全去掉啦),这样自然有好处,以后不用再需要什么功能再来打开。
乐观 该用户已被删除
5#
发表于 2015-2-14 17:29:24 | 只看该作者
Apache不是非得用80或者8080端口的,我刚开始安得时候就是80端口老占用,就用了个 81端口,结果照常,就是输localhost的时候,应该输入为 localhost:81
若相依 该用户已被删除
6#
发表于 2015-2-25 03:37:32 | 只看该作者
不禁又想起那些说php是草根语言的人,为什么认得差距这么大呢。
兰色精灵 该用户已被删除
7#
发表于 2015-3-7 16:29:34 | 只看该作者
装在C盘下面可以利用windows的ghost功能可以还原回来(顺便当做是重转啦),当然啦我的编译目录要放在别的盘下,不然自己的劳动成果就悲剧啦。
若天明 该用户已被删除
8#
发表于 2015-3-11 13:21:01 | 只看该作者
因为blog这样的可以让你接触更多要学的知识,可以接触用到类,模板,js ,ajax
谁可相欹 该用户已被删除
9#
发表于 2015-3-13 00:09:44 | 只看该作者
最后介绍一个代码出错,但是老找不到错误方法,就是 go to wc (囧),出去换换气没准回来就找到错误啦。
小妖女 该用户已被删除
10#
发表于 2015-3-13 04:10:53 | 只看该作者
说php的话,首先得提一下数组,开始的时候我是最烦数组的,总是被弄的晕头转向,不过后来呢,我觉得数组里php里最强大的存储方法,所以建议新手们要学好数组。
因胸联盟 该用户已被删除
11#
发表于 2015-3-19 20:52:21 | 只看该作者
在我安装pear包的时候老是提示,缺少某某文件,才发现 那群extension 的排列是应该有一点的顺序,而我安装的版本的排序不是正常的排序。没办法我只好把那群冒号加了上去,只留下我需要使用的扩展。
再见西城 该用户已被删除
12#
发表于 2015-3-25 06:20:17 | 只看该作者
基础有没有对学习php没有太大区别,关键是兴趣。
小魔女 该用户已被删除
13#
发表于 2015-3-28 06:44:23 | 只看该作者
个人呢觉得,配wamp 最容易漏的一步就是忘了把$PHP$目录下的libmysql.dll拷贝到windows系统目录的system32目录下,还有重启apache。
变相怪杰 该用户已被删除
14#
发表于 2015-3-30 15:55:52 | 只看该作者
对于懒惰的朋友,我推荐php的集成环境xampp或者是wamp。这两个软件安装方便,使用简单。但是我还是强烈建议自己动手搭建开发环境。
金色的骷髅 该用户已被删除
15#
发表于 2015-4-11 02:11:12 | 只看该作者
Apache不是非得用80或者8080端口的,我刚开始安得时候就是80端口老占用,就用了个 81端口,结果照常,就是输localhost的时候,应该输入为 localhost:81
小女巫 该用户已被删除
16#
发表于 2015-4-17 05:03:17 | 只看该作者
环境搭建好,当你看见你的浏览器输出“it works\\\\\\\"时你一定是喜悦的。在你解决问题的时候,我强烈建议多读php手册。
分手快乐 该用户已被删除
17#
发表于 2015-4-26 01:00:49 | 只看该作者
做为1门年轻的语言,php一直很努力。
再现理想 该用户已被删除
18#
发表于 2015-4-26 15:10:25 | 只看该作者
开发工具也会慢慢的更专业,每个公司的可能不一样,但是zend studio是个大伙都会用的。
精灵巫婆 该用户已被删除
19#
发表于 2015-6-28 22:19:31 | 只看该作者
我学习了一段时间后,我发现效果并不好(估计是我自身的问题)。因为一个人的精力总是有限的,同时学习这么多,会导致每个的学习时间都得不到保证。
柔情似水 该用户已被删除
20#
发表于 2015-7-3 18:19:18 | 只看该作者
当留言板完成的时候,下步可以把做1个单人的blog程序,做为目标,
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-5-30 16:12

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表