ajax 异步 跨域上传图片

客户端

<label for="text">名称</label>
    <input type="text" id="text" name="name"/>
    <label for="file">文件</label>
    <input type="file" id="file" name="file"/>
    <button type="button" onclick="ajaxUploadFile()">确定</button>
    <script type="text/javascript">
        function ajaxUploadFile(){
            var formData = new FormData();
            var xmlhttp;
            if(window.XMLHttpRequest){//IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            }else{
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.open("POST","http://upload.com/cors.php",true);
//             xmlhttp.setRequestHeader("X-Requested-With","XMLHttpRequest");
            formData.append("name",document.getElementById("text").value);
            formData.append("file",document.getElementById("file").files[0]);
            xmlhttp.send(formData);
            xmlhttp.onreadystatechange = function(){
                if(xmlhttp.readyState==4){
                    if(xmlhttp.status==200){
                        console.log("上传成功"+xmlhttp.responseText);//abc
                    }else{
                        console.log("上传失败"+xmlhttp.responseText);
                    }
                }
            }
        }
    </script>

 

服务端

header('Access-Control-Allow-Origin:*');//重要的跨域代码
move_uploaded_file($_FILES['file']['tmp_name'],dirname(__FILE__).'/cors.png');
echo 'abc';

 

转载于:https://www.cnblogs.com/longfeiPHP/p/8949980.html