Home >Backend Development >PHP Tutorial >javascript - ajax upload file background uses $_files to accept empty
javascript code:
<html><head><meta charset="UTF-8"> <style> img{ max-width:80%; display:block; } </style> </head><body><input id="img" type="file"> <p id="text"></p> <script> var up=function(o,success,x,file){ if(typeof success=='function') file=o; x=new XMLHttpRequest() x.open('POST','http://127.0.0.1/up.php?r='+Math.random(),1) x.onload=function(r){ r=x.responseText if(success)//if r.pid and the twice parameter existing return success(r) } x.send(file) } </script> <script> img.onchange=function(){ if(!this.files||!this.files[0]) return alert('选取文件出错!') var imgfile=this.files[0] if(imgfile.type.indexOf('image')!=0) return alert('这不是一个图像或音频!') up(imgfile,function(r){ text.innerHTML=r }) } </script> </body> </html>
Backend code:
<?php header('Access-Control-Allow-Origin:*'); header("Content-Type:text/json;charset=utf-8"); echo json_encode($_FILES); ?>
The return data is []
Reply content:
javascript code:
<html><head><meta charset="UTF-8"> <style> img{ max-width:80%; display:block; } </style> </head><body><input id="img" type="file"> <p id="text"></p> <script> var up=function(o,success,x,file){ if(typeof success=='function') file=o; x=new XMLHttpRequest() x.open('POST','http://127.0.0.1/up.php?r='+Math.random(),1) x.onload=function(r){ r=x.responseText if(success)//if r.pid and the twice parameter existing return success(r) } x.send(file) } </script> <script> img.onchange=function(){ if(!this.files||!this.files[0]) return alert('选取文件出错!') var imgfile=this.files[0] if(imgfile.type.indexOf('image')!=0) return alert('这不是一个图像或音频!') up(imgfile,function(r){ text.innerHTML=r }) } </script> </body> </html>
Backend code:
<?php header('Access-Control-Allow-Origin:*'); header("Content-Type:text/json;charset=utf-8"); echo json_encode($_FILES); ?>
The return data is []
Asynchronously upload files, you should use FormData. For example:
var oMyForm = new FormData(); oMyForm.append("file", file); x.send(oMyForm);