问题描述
我可以将图像上传到新文件夹,但是主要的事情是需要将图像从该文件夹显示为PDF。然后我正在使用FDPF,但是在显示时出现错误消息:
"Uncaught Exception: FPDF error: Can't open image file: Tulips.jpg "
但是当我回显$ img时,它会显示出来。然后我在pdf-> Image($ img)中添加$ img,它将无法正常工作,出现在消息错误上方。
这是我尝试编写htmltopdf.html
var _validFileExtensions = [".jpg",".jpeg",".bmp",".gif",".png"];
function ValidateSingleInput(oInput) {
if (oInput.type == "file") {
var sFileName = oInput.value;
if (sFileName.length > 0) {
var blnValid = false;
for (var j = 0; j < _validFileExtensions.length; j++) {
var sCurExtension = _validFileExtensions[j];
if (sFileName.substr(sFileName.length - sCurExtension.length,sCurExtension.length).toLowerCase() == sCurExtension.toLowerCase()) {
blnValid = true;
break;
}
}
if (!blnValid) {
alert("Sorry," + sFileName + " is invalid,allowed extensions are: " + _validFileExtensions.join(","));
oInput.value = "";
return false;
}
}
}
return true;
}
function handleFileSelect(event)
{
console.log(event)
var input = this;
if (input.files)
{
var filesAmount = input.files.length;
for (i = 0; i < filesAmount; i++)
{
var reader = new FileReader();
console.log(reader)
reader.onload = (function (e)
{
var span = document.createElement('span');
span.innerHTML = ['<img class="thumb" src="',e.target.result,'" title="',escape(e.name),'"/><span class="remove_img_preview"></span>'].join('');
document.getElementById('preview').insertBefore(span,null);
});
reader.readAsDataURL(input.files[i]);
}
}
}
$(document).ready(function(){
// Listen to click event on the submit button
$('#submit').click(function (e) {
e.preventDefault();
var myform = document.getElementById("form");
var fd = new FormData(myform);
$.ajax({
url:"upload1.php",type:"POST",data:fd,//dataType: 'json',processData: false,contentType: false,cache: false,success:function(data){
alert("Success Insert!");
},});
});
$('#fileToUpload').change(handleFileSelect);
//preview image and remove
$('#preview').on('click','.remove_img_preview',function ()
{
$(this).parent('span').remove();
$("#fileToUpload").val("");
});
});
</script>
<style>
div.relative {
position: relative;
top: -300px;
}
#bottom{
position: relative;
right: 0;
bottom: 0;
}
.thumb
{
width: 100px;
height: 100px;
margin: 0.2em -0.7em 0 0;
}
.remove_img_preview
{
position:relative;
top:-25px;
right:5px;
background:black;
color:white;
border-radius:50px;
font-size:0.9em;
padding: 0 0.3em 0;
text-align:center;
cursor:pointer;
}
.remove_img_preview:before
{
content: "×";
}
table,th,td {
border: 1px solid black;
border-collapse: collapse;
}
th,td {
padding: 5px;
text-align: left;
}
textarea {
width: 100%;
height: 300px;
padding: 12px 20px;
box-sizing: border-box;
border: 2px solid #ccc;
border-radius: 4px;
background-color: #f8f8f8;
font-size: 16px;
resize:none;
}
table.menu {
border: 1px solid black;
border-collapse: collapse;
width: 10%;
float:right;
}
</style>
<body>
<form action="generate_pdf.php" method="POST" id="form">
<input type="submit" value="Send" id="submit" name="submit"><input type="reset" value="Clear">
<input type="file" name="fileToUpload[]" id="fileToUpload" onchange="ValidateSingleInput(this);" multiple = "multiple" style="display: none;">
<input type="button" value="Browse..." onclick="document.getElementById('fileToUpload').click();" />
<input type="submit" value="PDF">
<div id="preview"></div>
</form>
</body>
</html>
这里是upload1.php
<?php
require 'config.php';
$year = date("yy");
$year = substr($year,-2);
$month = date("m");
$key = "KM".$year.$month;
$total = count($_FILES['fileToUpload']['name']);
$sql = "SELECT * FROM images WHERE id LIKE '$key%' ORDER BY id DESC LIMIT 1";
$result = $conn->query($sql);
//GET NEW RUNNING NUMBER BY CHECKING DATABASE
if ($result->num_rows > 0)
{
// output data of each row
while($row = $result->fetch_assoc())
{
$number = sprintf('%03d',substr($row['id'],-3)+ 1) ;
$ans = $key.$number;
}
}
else
{
$ans = $key."001";
}
$target_dir = "D:/XAMPP/htdocs/new3/new3/uploads/" . $ans;
if(!file_exists($target_dir))
{
mkdir($target_dir,0777,true);
}
$sql = $conn->query ("INSERT INTO images (id) VALUES ('$ans')");
$allowed = array('gif','png','jpg','xlsx','pdf','doc');
$ext = pathinfo($total,PATHINFO_EXTENSION);
if (!in_array($ext,$allowed)) {
echo 'error';
}
for( $i=0 ; $i < $total ; $i++ )
{
if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"][$i],$target_dir."/".$ans."-".$_FILES["fileToUpload"]["name"][$i]))
{
echo "The file ". basename( $_FILES["fileToUpload"]["name"][$i]). " has been uploaded."."<br>";
}
else
{
echo "Sorry,there was an error uploading your file.";
}
}
?>
这是我尝试过的generate_pdf.php
:
<?php
$img=$_FILES["fileToUpload"]["name"][0];
echo $img;
require 'fpdf181/fpdf.php';
$pdf = new FPDF();
$pdf->AddPage();
$pdf->SetFont('Arial','B',10);
$pdf->Image($img,NULL,'PNG');
$pdf->Output();
?>
我不知道我是否正确编写了它?还是只需要调用存储图像的路径并显示出来?我自己已经集思广益,不知道它是如何工作的。有人可以帮忙吗?也许这是一个重复的问题,但我什至找不到任何相关的东西,只是找到了如何从数据库中检索。
解决方法
第一个问题是您的<form>
标签缺少enctype="multipart/form-data"
属性。
至于PHP错误,$_FILES["fileToUpload"]
是一个数组,因此$image=$_FILES["fileToUpload"]["name"]
应该更改为$_FILES["fileToUpload"]["name"][0]
(假设您要第一个文件)。因此generate_pdf.php
应该以:
$image=$_FILES["fileToUpload"]["name"][0];
,
在我对其中的一些内容进行了修改之后,出现的错误是“致命错误:未捕获的异常:FPDF错误:无法打开图像文件” 这是我修改过的代码文件,称为generate_pdf.php
$image=$_FILES["fileToUpload"]["name"][0];
$img="C:/xampp/htdocs/test/uploads/".$image;
require 'fpdf181/fpdf.php';
$pdf = new FPDF();
$pdf->AddPage();
$pdf->SetFont('Arial','B',10);
$pdf->Image($img,NULL,'png');
$pdf->Output();