javascript - PHP:在文件夹中找不到上传的图像

Question

我想在文件夹中上传多张图片并保存在数据库中。问题是，我的图像没有在文件夹中移动。我不知道为什么？但相同的代码在本地主机上运行。我粘贴我的代码请帮助我:

var abc = 0;      // Declaring and defining global increment variable.
$(document).ready(function() {
	
	//  To add new input file field dynamically, on click of "Add More Files" button below function will be executed.
	$('#add_more').click(function() {
		$(this).before($("<div/>", {
			id: 'filediv',
		}).fadeIn('slow').append($("<input/>", {
			name: 'file[]',
			type: 'file',
			id: 'file'
		}), $("<br/><br/>")));
	});
	// Following function will executes on change event of file input to select different file.
	$('body').on('change', '#file', function() {
		
		if (this.files && this.files[0]) {
			
			abc += 1; // Incrementing global variable by 1.
			var z = abc - 1;
			var x = $(this).parent().find('#previewimg' + z).remove();
			$(this).before("<div id='abcd" + abc + "' class='abcd'><img id='previewimg" + abc + "' src=''/></div>");
			var reader = new FileReader();
			reader.onload = imageIsLoaded;
			reader.readAsDataURL(this.files[0]);
			$(this).hide();
			$("#abcd" + abc).append($("<img/>", {
				
				id: 'img',
				src: 'x.png',
				alt: 'delete'
			}).click(function() {
				
				$(this).parent().parent().remove();
			}));
		}
	});
	// To Preview Image
	function imageIsLoaded(e) {
		
		$('#previewimg' + abc).attr('src', e.target.result);
	};
	$('#upload').click(function(e) {
		
		var name = $(":file").val();
		if (!name) {
			
			alert("First Image Must Be Selected");
			e.preventDefault();
		}
	});
});

@import "http://fonts.googleapis.com/css?family=Droid+Sans";
form{
	background-color:#fff
}
#maindiv{
	width:960px;
	margin:10px auto;
	padding:10px;
	font-family:'Droid Sans',sans-serif
}
#formdiv{
	width:500px;
	float:left;
	text-align:center
}
form{
	padding:40px 20px;
	box-shadow:0 0 10px;
	border-radius:2px
}
h2{
	margin-left:30px
}
.upload{
	background-color:red;
	border:1px solid red;
	color:#fff;
	border-radius:5px;
	padding:10px;
	text-shadow:1px 1px 0 green;
	box-shadow:2px 2px 15px rgba(0,0,0,.75)
}
.upload:hover{
	cursor:pointer;
	background:#c20b0b;
	border:1px solid #c20b0b;
	box-shadow:0 0 5px rgba(0,0,0,.75)
}
#file{
	color:green;
	padding:5px;
	border:1px dashed #123456;
	background-color:#f9ffe5
}
#upload{
	margin-left:45px
}
#noerror{
	color:green;
	text-align:left
}
#error{
	color:red;
	text-align:left
}
#img{
	width:17px;
	border:none;
	height:17px;
	margin-left:-20px;
	margin-bottom:91px
}
.abcd{
	text-align:center
}
.abcd img{
	height:100px;
	width:100px;
	padding:5px;
	border:1px solid #e8debd
}
b{
	color:red
}

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	<script src="image.js"></script>
	<link rel="stylesheet" type="text/css" href="image_style.css">
<div id="filediv"><input name="file[]" type="file" id="file"/></div>
<input type="button" id="add_more" class="upload" value="Add More Files"/>
<button id="save" name="save" type="submit" class="btn btn-success btn-sm upload" id="upload">SAVE</button> 

   if(isset($_POST['save'])){   

    for($i = 0; $i < count($_FILES['file']['name']); $i++){

        $image = $_FILES['file']['name'][$i]; 
        $target_path = "http://rental.thedigitalmarketingonline.com/uploads/vehicle_snap/".$image;  
        if(($_FILES['file']['size'][$i] < 100000)){

            if(move_uploaded_file($_FILES['file']['tmp_name'][$i], $target_path)){

                echo '<span id="noerror">Image uploaded successfully!.</span><br/><br/>';
            }else{    

                echo '<span id="error">please try again!.</span><br/><br/>';
            }
        }else{    

            echo '<span id="error">***Invalid file Size or Type***</span><br/><br/>';
        }
    }

Answer 1

首先如@Gautam所说，使用表单标签能够提交数据，

第二个 $target_path 应该是真实的路径，例如 satya 所说的 "uploads/vehicle_snap/"

第三，这不是一个好的安全做法，如果这是一张图片或不是一张图片，则没有过滤器可以过滤，因此攻击者可能会上传 php 文件并破坏您的服务器/网站

尝试通过检查文件的扩展名是否为图像扩展名来过滤上传，您可以这样做:

$allowed_ext = ["png","jpg","jpeg","etc.."];
if(in_array(end(explode('.',$file['name'])),$allowed_ext)){
    //uploading code goes inside here
}