php上传图片到服务器的前端和php代码

Question

网上找了很多代码，每次都报错

Answer 1

前端 代码  使用 extjs 3.4

uploadPhotoWindow=Ext.extend(Ext.Window,{
title:" 上传图片  Upload  Photo",
height:420 ,
width:600,
closeAction:'close',
modal : true,
iconCls:'btn-setting',
buttonAlign: 'center',
upload_ok:false,
haveUpload:false,
initComponent : function() { 
Ext.form.Field.prototype.msgTarget = 'side';
  var po_no=new Ext.form.TextField({name:'Po_no',fieldLabel: '单号 Po No',itemId:'Po_no', width:120,
allowBlank: false, value:this.cur_sele_po_no, hidden:true}); 
var OP=new Ext.form.TextField({name:'OP',itemId:'OP', width:12,
allowBlank: false, value:"uploadphoto", hidden:true}); 
var file_name=new Ext.form.TextField({name:'photo_file_name',itemId:'photo_file_name', width:180,
allowBlank: false, value:"",hidden:true,}); 
var imagebox = new Ext.BoxComponent({
itemId:'imagebox',
autoEl: {
tag: 'img',    //指定为img标签 
style: 'height:100%;margin:0px auto;border:1px solid #ccc; text-align:center;margin-bottom:10px',
src: 'img/userimg/nophoto.jpg' ,   //指定url路径 
}
});

   var form_set_field = new Ext.FormPanel({
frame:true,
itemId:'form_set_field',
layout:'form', 
//tableAttrs: {border: 1},
defaults:{labelAlign:'right',labelWidth:110,bodyStyle: 'padding:0 30px 0 0;',frame:false,layout:'form'},
items:[po_no,OP,file_name,imagebox],
}); 

var file = new  Ext.form.TextField({
              name: 'imgFile',
                  fieldLabel: '文件上传',
                  inputType: 'file',
                  allowBlank: false,
                  blankText: '请浏览图片'
});  
   var form_set_file = new Ext.FormPanel({
frame:true,
fileUpload: true,
itemId:'form_set_file',
layout:'form', 
//tableAttrs: {border: 1},
defaults:{labelAlign:'right',labelWidth:110,bodyStyle: 'padding:0 30px 0 0;',frame:false,layout:'form'},
items:[file],

}); 


var btnOK= new Ext.Button({text: '上传 Upload  ', iconCls:'btn-save',width:70,handler: function(){
var form_set=this.ownerCt.ownerCt.getComponent('form_set_file');
var form_set_field=this.ownerCt.ownerCt.getComponent('form_set_field');
var po_no=form_set_field.getComponent('Po_no').getValue();
var file_name=form_set_field.getComponent('photo_file_name');
//alert(po_no);
var imgbox=form_set_field.getComponent('imagebox');

  if (form_set.getForm().isValid()){
form_set.getForm().submit({ 
waitMsg : '正在上传数据 Uploading....',waitTitle:'请稍候 waiting....',
url:'php/toolsfile/photoUpload.php', 
method : 'post', 
success : function(form, action){ 
var out = action.result.success; 
if (out != true){
Ext.Msg.alert('提示 Tips ', '上传数据失败,错误信息   Save failure  :'+action.result.msg);

//alert(action.result.msg);
} else{
//Ext.Msg.alert('提示 Tips ', '上传数据成功,服务器信息: Save success '+action.result.msg);
file_name.setValue(action.result.file_name);
imgbox.getEl().dom.src=action.result.file_scr;
form_set.ownerCt.savePhoto();
//form_set.ownerCt.grid.store.load();
//form_set.ownerCt.dateChang=true;
//form_set.ownerCt.destroy( );
}
},
failure: function(form, action) {
switch (action.failureType) {  
case Ext.form.Action.CLIENT_INVALID:  
Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');  
break;  
case Ext.form.Action.CONNECT_FAILURE:  
Ext.Msg.alert('Failure', 'Ajax communication failed');  
break;  
case Ext.form.Action.SERVER_INVALID:  
Ext.Msg.alert('Failure', action.result.msg);  
break;
}  
},
}); 
}else{
Ext.Msg.alert('提示 Tips :', '请选择文件! \n Please select Img file ');
} 
}
});



var btnCancel = new Ext.Button({text: ' 关闭  Close ', iconCls:'btn-cancel',width:70,handler: function(){this.ownerCt.ownerCt.destroy( )}});
Ext.apply(this,{

items: [form_set_field,form_set_file],
buttons: [btnOK,  btnCancel],
}); 
uploadPhotoWindow.superclass.initComponent.call(this); 
},
savePhoto:function (){
//alert(this.cur_sele_po_no);
var form_set_field=this.getComponent('form_set_field');
var form_set_file=this.getComponent('form_set_file');
form_set_field.getForm().submit({
waitMsg : '上传成功，正在存储 saveing....',waitTitle:'请稍候 waiting....',
url:'php/jsonfile/po_nophotolist_json.php', 
method : 'post', 
success : function(form, action){ 
var out = action.result.success; 
if (out != true){
Ext.Msg.alert('提示 Tips ', '存储失败,错误信息   Save failure  :'+action.result.msg);
} else{
Ext.Msg.alert('提示 Tips ', '存储成功,服务器信息: Save success '+action.result.msg);
form_set_file.getForm().reset();
form_set_file.ownerCt.haveUpload=true;
}
},
failure: function(form, action) {
switch (action.failureType) {  
case Ext.form.Action.CLIENT_INVALID:  
Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');  
break;  
case Ext.form.Action.CONNECT_FAILURE:  
Ext.Msg.alert('Failure', 'Ajax communication failed');  
break;  
case Ext.form.Action.SERVER_INVALID:  
Ext.Msg.alert('Failure', action.result.msg);  
break;
}  
},
});
},
isUpload:function(){
return this.haveUpload;
}
});

后台php photoUpload.php'

<?
require_once('../classfile/guid.class.php');

if(!isset($_FILES['imgFile'])){
echo json_encode(array("success"=>false, 'msg'=>"Not get Imgfile"));
return;
}
$upfile=$_FILES['imgFile'];
$name=$upfile["name"];//上传文件的文件名 
$type=$upfile["type"];//上传文件的类型 
$size=$upfile["size"];//上传文件的大小 
$tmp_name=$upfile["tmp_name"];//上传文件的临时存放路径 
$error_cod=$upfile["error"];
 if ($error_cod>0){
echo json_encode(array("success"=>false, 'msg'=>$error_cod));
} 

$ext_file_name="";

switch ($type){ 
case 'image/pjpeg':
$okType=true;
$ext_file_name =".jpg";
break; 
case 'image/jpeg':
$okType=true; 
$ext_file_name =".jpg";
break; 
case 'image/gif':
$okType=true; 
$ext_file_name =".gif";
break; 
case 'image/png':
$okType=true; 
$ext_file_name =".png";
break; 
} 

if(!$okType){ 
echo json_encode(array("success"=>false, 'msg'=>"Not  image "));
return;
}
$web_root="D:".DIRECTORY_SEPARATOR."Easy2PHP5".DIRECTORY_SEPARATOR."webSiteJfz".DIRECTORY_SEPARATOR;

$photo_tmp_path=$web_root."img".DIRECTORY_SEPARATOR."userimg".DIRECTORY_SEPARATOR."temp";
$temp_file_name= creat_guid(0).$ext_file_name;
$photo_tmp_file_name=$photo_tmp_path.DIRECTORY_SEPARATOR.$temp_file_name;
$photo_tmp_file_scr="img".DIRECTORY_SEPARATOR."userimg".DIRECTORY_SEPARATOR."temp".DIRECTORY_SEPARATOR.$temp_file_name;
move_uploaded_file($tmp_name,$photo_tmp_file_name); 


echo json_encode(array("success"=>true, 'msg'=> "ok","file_name"=>$photo_tmp_file_name,"file_scr"=>$photo_tmp_file_scr));

//echo json_encode(array("success"=>false, 'msg'=> json_encode($_FILES['imgFile'])));
return;

?>

guid.class.php // 生成唯一的图片文件名
<?
function creat_guid($long){
$uuid="";
    if (function_exists('com_create_guid')){
        $uuid=com_create_guid();
    }else{
        mt_srand((double)microtime()*10000);//optional for php 4.2.0 and up.
        $charid = strtoupper(md5(uniqid(rand(), true)));
        $hyphen = chr(45);// "-"
        $uuid = chr(123)// "{"
.substr($charid, 0, 8).$hyphen
                .substr($charid, 8, 4).$hyphen
                .substr($charid,12, 4).$hyphen
                .substr($charid,16, 4).$hyphen
                .substr($charid,20,12)
                .chr(125);// "}"
        //return $uuid;
    }
if (!isset($long) || $long==0 ){
return substr($uuid,1, strlen($uuid)-2);
}else{
return $uuid;
}
}