このスクリプトは、データをテーブルに挿入するだけでなく、
画像をアップロードします。画像のアップロードからの URL を列の画像に挿入します。
私が抱えている別の問題は、フォームのアップロード部分を他のフォーム内に配置すると、ページが更新され、ファイルが選択されていないと表示されることです。
理想的には、送信ボタンは 1 つだけで、ロード バーは同じように機能し、ファイルが正常にアップロードされたことを示すダイアログ ボックスが表示され、閉じるとフォームがデータベースに送信されます。
index.php
<?php
session_start();
if(isset($_SESSION['username']))
{
mysql_connect ('localhost', 'root', '') ;
mysql_select_db ('admin');
}
else
{
header("Location: index.php");
}
if (isset($_POST['submit'])) {
$month = htmlspecialchars(strip_tags($_POST['month']));
$date = htmlspecialchars(strip_tags($_POST['date']));
$year = htmlspecialchars(strip_tags($_POST['year']));
$time = htmlspecialchars(strip_tags($_POST['time']));
$title = htmlspecialchars(strip_tags($_POST['title']));
$entry = $_POST['entry'];
$image = htmlspecialchars(strip_tags($_POST['myPost']));
$timestamp = strtotime($month . " " . $date . " " . $year . " " . $time);
$entry = nl2br($entry);
if (!get_magic_quotes_gpc()) {
$title = addslashes($title);
$entry = addslashes($entry);
}
$sql = "INSERT INTO posts (timestamp,title,entry,image) VALUES ('$timestamp','$title','$entry','$image')";
$result = mysql_query($sql) or print("Can't insert into table.<br />" . $sql . "<br />" . mysql_error());
mysql_close();
header("location: index.php");
}
$current_month = date("F");
$current_date = date("d");
$current_year = date("Y");
$current_time = date("H:i");
$sess_val = time(); //create a unique identifier for this upload session that will be the value of the hidden input
$sess_name = ini_get("session.upload_progress.name"); //this constant will be the name of the hidden input
?>
<!DOCTYPE HTML>
<html>
<head>
<title>Geeky Gents</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<link rel="icon" href="images/favicon.ico" />
<script>
//simply fetch the progress of the current upload via AJAX
function checkProgress()
{
var xmlhttp;
if(window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4 && xmlhttp.status==200)
{
//call the function to update the progress bar visually
updateProgressBar(eval("("+xmlhttp.responseText+")")); //don't actually do this - it's unsafe
}
}
//send the request to uploader.php with the progress parameter present
xmlhttp.open("GET", "uploader.php?progress=<?php echo $sess_val; ?>", true);
xmlhttp.send();
}
//this function converts the JSON object of the progress into a visual progress bar
function updateProgressBar(response)
{
if(response['bytes_processed']==undefined) //this upload is finished
{
document.getElementById("progress-inner").style.width = "600px";
alert("Done!");
//we do not make another request for the progress since it's done
}
else
{
//calculate the new pixel width of the progress bar
var new_width = Math.round(response['bytes_processed'] / response['content_length'] * 600);
document.getElementById("progress-inner").style.width = new_width+"px";
checkProgress(); //make another request for the progress
}
}
//this function is called upon upload - it begins the progress checking
function beginUpload()
{
var t = setTimeout("checkProgress()", 2000); //wait a bit to leave enough time for initial upload to be sent
}
</script>
</head>
<body>
<div class="links">
<a href="index.php">Home</a>
<a href="about.html">About</a>
<a href="products.html">Products</a>
<a href="join.html">Join Us</a>
</div>
<div class="body">
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<p>
<input type="hidden" value="<?php echo $current_month; ?>" name="month" id="month" />
<input type="hidden" name="date" id="date" size="2" value="<?php echo $current_date; ?>" />
<input type="hidden" value="<?php echo $current_year; ?>" name="year" id="year" />
<input type="hidden" name="time" id="time" size="5" value="<?php echo $current_time; ?>" /></p>
<p><label for="title">*Title:</label><input type="text" name="title" name="title" size="40" /></p>
<input type="text" name="uploaded_file" name="uploaded_file" value="<?php strip_tags($_POST['myFile']); ?>" size="70" />
<p>*Content:</p>
<p><textarea cols="80" rows="20" name="entry" id="entry"></textarea></p>
<p>
<input type="submit" name="submit" id="submit" value="Submit">
<input type="button" value="Cancel" onclick="window.location.href='index.php'">
</p>
</form>
<br /><br />
<p>Image Uploader: (h x w)(150 x 750)</p>
<form action="uploader.php" method="POST" enctype="multipart/form-data" target="submit-catch">
<input type="hidden" name="<?php echo $sess_name ?>" value="<?php echo $sess_val; ?>" />
<input type="file" name="myFile" />
<input type="submit" value="Upload" onclick="beginUpload();" />
</form>
<div id="progress-outer">
<div id="progress-inner"></div>
</div>
<iframe name="submit-catch" style="display:none;"></iframe>
</div>
<div class="footer">
<a href="http://www.youtube.com/user/GeekyGents/" target="_blank"><img src="images/icon/yt.png" /></a>
<a href="http://www.facebook.com/GeekyGents/" target="_blank"><img src="images/icon/fb.png" /></a>
<a href="https://twitter.com/GeekyGents/" target="_blank"><img src="images/icon/twitter.png" /></a>
</div>
</body>
</html>
Uploader.php
<?php
session_start(); //we need to be able to access the session
if(isset($_REQUEST['progress']) && isset($_SESSION['username'])) //getting the progress on an upload
{
//get the key of this particular upload - based on the passed parameter
$key = ini_get("session.upload_progress.prefix").$_REQUEST["progress"];
if(isset($_SESSION[$key]))
echo json_encode($_SESSION[$key]); //make it easy for our JavaScript to handle the progress data
else //the session doesn't exist, which means the upload has already finished or has not yet started
echo json_encode($key);
}
else //initial upload request
{
define("UPLOAD_DIR", "uploads/");
if (!empty($_FILES["myFile"])) {
$myFile = $_FILES["myFile"];
if ($myFile["error"] !== UPLOAD_ERR_OK) {
echo "<p>An error occurred.</p>";
exit;
}
// ensure a safe filename
$name = preg_replace("/[^A-Z0-9._-]/i", "_", $myFile["name"]);
// don't overwrite an existing file
$i = 0;
$parts = pathinfo($name);
while (file_exists(UPLOAD_DIR . $name)) {
$i++;
$name = $parts["filename"] . "-" . $i . "." . $parts["extension"];
}
$fileType = exif_imagetype($_FILES["myFile"]["tmp_name"]);
$allowed = array(IMAGETYPE_GIF, IMAGETYPE_JPEG, IMAGETYPE_PNG);
if (!in_array($fileType, $allowed)) {
echo "<p>Wrong file type, please use GIF JPEG or PNG</p>";
}
else
{
// preserve file from temporary directory
$success = move_uploaded_file($myFile["tmp_name"],
UPLOAD_DIR . $name);
if (!$success) {
echo "<p>Unable to save file.</p>";
exit;
}
// set proper permissions on the new file
chmod(UPLOAD_DIR . $name, 0644);
}
}
}
?>
他にセキュリティ ホールのようなものを見つけた場合は、それらについてもお知らせください。学習中です。