Ajax PHP文件上传器无法正常工作

时间:2014-12-23 12:43:02

标签: javascript php ajax upload xmlhttprequest

我正在研究ajax图像上传器,当有人提交图像时我自动工作我的问题是,当我将重命名添加到我的代码中以订购图像名称时,它无法按预期工作

 rename("user_image/".$_FILES[uploaded][name].".png","user_image/".$_SESSION["id"].".png");

该文件不会被上传并移动到指定的目录但是当我删除它时文件被上传我认为问题来自于他可以编辑文件的权限,文件权限是644

这是我的php文件:

<?php
   if($_SERVER["REQUEST_METHOD"]=="POST"){
          $file = $_FILES["uploaded"];
          $target_dir = "user_image/";
          $target_file = $target_dir . basename($_FILES["uploaded"]["name"]);
          move_uploaded_file($_FILES["uploaded"]["tmp_name"],$target_file);
          rename('user_image/'.$_FILE["uploaded"]["name"].".gif",'user_image/'.$_SESSION["id"].".gif");
   }
?>

这是html和ajax的其余部分:

<!DOCTYPE html>
<html>
   <head>
      <title>Register</title>
      <link href='http://fonts.googleapis.com/css?family=Arvo:400,700|Ubuntu:300,400,500,700' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" type="text/css" href="/css/style.css"/>
</head>
<body>
    <div id="container">
        <div id="half1">
            <div id="upload">
               <div id="user">
                   <img src="/img/1.png" id="one" alt="User image"/>
               </div>
              <img src="/img/plus.png" alt="Upload">
              <form method="post" enctype="multipart/form-data"> <input name="uploaded" type="file" id="file_upload"/> </form>
            </div>
        </div>
        <div id="half2">
            <h1>Sign up!</h1>
            <form action="register.php" method="post" >
                <input type="text" placeholder="Age" name="age">
                <input type="text" placeholder="Favourite dish" name="dish">
            </form>
        </div>
    </div>
    <p id="user_id" style="display:none;" ><?= $_SESSION["id"]; ?></p>
    <script charset="UTF-8">
        function _(id){
            return document.getElementById(id);
        }
        _("file_upload").onchange = function() {
            var id = _("user_id").innerHTML;
            var file = _("file_upload").files[0];
            var formdata = new FormData();
            formdata.append("uploaded",file);
            var ajax = new XMLHttpRequest();
            ajax.onreadystatechange =
            function(){
                if(ajax.readyState==4 && ajax.status==200){
                   _("one").remove();
                    var img = document.createElement('img');
                    var first_path = '/user_image/';
                    var path = first_path.concat(id,'.png');
                    img.setAttribute('alt','User image');
                    img.setAttribute('id','one');                        
                    img.setAttribute('src',path);
                    _("user").appendChild(img);  
                    alert("end");
                }    
                else{
                    _("one").remove();
                    var img = document.createElement('img');
                    img.setAttribute('src','/img/loading.gif');
                    img.setAttribute('alt','User image');
                    img.setAttribute('id','one');
                    _("user").appendChild(img);                        
                }
            }              
            ajax.open("POST","upload_image.php");
            ajax.setRequestHeader("Content-type", "multipart/form-data"); 
            ajax.send(formdata);
        };
    </script>
</body>

3 个答案:

答案 0 :(得分:2)

你想rename什么,你不能。 $_FILE['uploaded']['name']是客户端计算机的原始文件名。因此,您的服务器上没有C:\tmp\abc.png这样的文件,这意味着,您无法重命名。{/ p>

无论如何,这条重命名的重点是什么?如果要重命名,请在move_uploaded_file函数中执行此操作。

答案 1 :(得分:1)

我认为在重命名文件时不提供图像文件的静态扩展,并且在文件上载期间不更改图像的扩展名。

答案 2 :(得分:1)

内容类型标头需要设置为multipart/form-data。所以服务器知道它期望什么样的数据。

这适用于Internet Explorer

ajax.setRequestHeader("Content-type", "multipart/form-data");

但是在Firefox或Chrome中添加此内容会导致PHP中的帖子数据丢失。

现在服务器知道它可以期待一些复杂的表单数据,包括文件和blob。