我有一个小网站,我想从服务器端制作一个上传页面。以下代码使用 ajax,并可在经典笔记本电脑上与 Chrome 配合使用。下面的代码显示图片并上传。当我尝试从 Android 手机上传图像时,它不起作用,但会打印
something, something, something
,检测到文件不为空。
html代码
<!doctype html>
<html>
<head lang="en">
<meta charset="utf-8">
<title>Ajax upload test</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript" src="js/jquery-1.11.3-jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-8">
<br>
<form id="form" action="ajaxupload.php" method="post" enctype="multipart/form-data">
<input id="uploadImage" type="file" accept="image/*" name="image" />
<div id="preview"><img src="filed.png" /></div><br>
<input class="btn btn-success" type="submit" value="Upload">
</form>
<div id="err"></div>
<br>
</div>
</div>
</div>
</body>
</html>
JS部分
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
$(document).ready(function (e) {
$("#form").on('submit',(function(e) {
e.preventDefault();
$.ajax({
url: "ajaxupload.php",
type: "POST",
data: new FormData(this),
contentType: false,
cache: false,
processData:false,
beforeSend : function()
{
//$("#preview").fadeOut();
$("#err").fadeOut();
},
success: function(data)
{
if(data=='invalid')
{
// invalid file format.
$("#err").html("Invalid File !").fadeIn();
}
else
{
// view uploaded file.
$("#preview").html(data).fadeIn();
$("#form")[0].reset();
}
},
error: function(e)
{
$("#err").html(e).fadeIn();
}
});
}));
});
还有 PHP 部分
<?php
$valid_extensions = array('jpeg', 'jpg', 'png', 'gif', 'bmp' , 'pdf' , 'doc' , 'ppt'); // valid extensions
$path = 'qrcode/'; // upload directory
if(empty($_FILES['image']['name'][0])){
print('this thing is empty');
}else{
print('Something, something, something');
}
$img = $_FILES['image']['name'];
$tmp = $_FILES['image']['tmp_name'];
// get uploaded file's extension
$ext = strtolower(pathinfo($img, PATHINFO_EXTENSION));
// can upload same image using rand function
$final_image = rand(1000,1000000).$img;
// check's valid format
if(in_array($ext, $valid_extensions))
{
$path = $path.strtolower($final_image);
if(move_uploaded_file($tmp,$path))
{
echo "<img src='$path' />";
}
}
?>
当我尝试从 Android 手机上传图像时,代码会打印
something something...
,它检测到有一个文件,但不会像使用笔记本电脑那样显示和上传它。我将 Debian
与 apache2
和 php8.2
一起使用
为什么这不适用于 Android 手机?
经过多次搜索我发现默认的android浏览器对php的支持不是很好。所以我建议用户像这样打开他的chrome浏览器
<p>Check out <a href="https://somewebsite/" target="_blank">this website</a>.</p>
chrome浏览器打开后上传文件不再有问题。