Table of Contents
Introduction
हेलो दोस्तों इस tutorial में HTML और PHP script का इस्तेमाल करके files को server side कैसे upload कर सकते है! वह details से जानेगे!. file जैसे की image, zip files, videos, PDFs, gif हो सकती है!. file को server पे uploads करने से पहले वह file हमारी temporary directory में मतलब की हमारे computer में store होती है तो वह file को हमारे computer से server पर upload करने के लिए हम php script का इस्तेमाल से कर सकते है!.
PHP script का इस्तेमाल करके image को server पर move करके इसमें जो images होती है वह server side किसी perticuler image के लिए folder में store होगी और इस image name को हमें database में store करा सकते है!. अगर इस image को हमारी application या website में display हम इस database में store image के name से करा सकते है!. खास करके जो dynamic web application या website होती इसमें image server के perticuler directory folder में image store करती है और इस image name database में इसके बाद में webapplication और website में display होती है वह database के image के नाम के आधार पर वह perticuler directory folder मेसे display करा सकते है.
Create Database and Database Table
Database को create करने के लिए हमें first localhost wamp को start कर लेना है उसके बाद में URL में http://localhost/phpmyadmin/ search करने के बाद एक window open होगी उसमे database menu में click कर लेना है! उसके बाद में create new database का field देखिगी और वह database name लिख के create button पे click कर लेना उसके बाद हमारा database create हो चूका होगा. आप निचे image में देख सकते हो.
Images details को database के perticuler table में store करने के लिए टेबल जरुरी होता है.
syntax:
CREATE TABLE table_name (column_name column_type);
Example:
CREATE TABLE images (
id INT(11) UNSIGNED AUTO_INCREMENT PRIMARY KEY,
image_name VARCHAR(30) NOT NULL,
image VARCHAR(30) NOT NULL
);
Database Configuration
Image को server-side upload और image नाम को database में save करने के लिए database के साथ configuration (connection) करना जरुरी होता है!.
<?php
/**
* Set Database Connection
*/
$servername = 'localhost';
$username = 'root';
$password = '';
$databasename = 'image';
// Set connection using mysqli_connect()
$conn = mysqli_connect($servername, $username, $password, $databasename);
// If $conn is false, connection is failed
if (!$conn ) {
die("Failed to connect to MySQL: " . mysqli_connect_error());
}
echo "Database Connected Successfully.";
?>
HTML form for image uploading
<!DOCTYPE html>
<html>
<head>
<title>Image Upload</title>
</head>
<body>
<div id="main-form">
<form method="POST" action="" enctype="multipart/form-data">
<div>
<label>Image Name:</label>
<input type="text" name="img_name" id="img_name">
</div>
<div>
<label>Uploading Image:</label>
<input type="file" name="image" value="" />
</div>
<div>
<button type="submit" name="submit">UPLOAD</button>
</div>
</form>
</div>
</body>
</html>
ऊपर के HTML form में enctype attribute का इस्तेमाल किया गया है, क्योकि enctype atribute के इस्तेमाल बिना हम images, videos जैसे फाइल को हम server-side में send नहीं कर सकते इसके चलते इस attribute का इस्तेमाल करना जरुरी होता है. और इसके साथ ही image ko POST request के साथ ही send कर सकते है!। Images जैसी file को upload करने के लिए input <input type=”file”> control का इस्तेमाल किया जाता है!.
Image Upload ke liye php script
<?php
if(isset($_POST['submit']))
{
$filepath = "images/" . $_FILES["image"]["name"];
$imagename = $_POST['img_name'];
$image = $_FILES['image']['name'];
$sql = 'INSERT INTO images (image_name , image) VALUES ("'.$imagename.'", "'.$image.'")';
//Query execution
$result = mysqli_query($conn, $sql);
if( $result ){
if(move_uploaded_file($_FILES["image"]["tmp_name"], $filepath))
{
echo "Image upload successfully!";
}
else
{
echo "Error !!";
}
}
}
?>
move_uploaded_file
PHP में move_uploaded_file function upload image को हमरे computer और laptop के temporary location से server-side new destination location पे move करता है!. और वह function internally चेक करता है की वह image post method के साथ upload की गई है की नहीं और अगर post request के साथ upload की गई होती है तो वह new destionation location में send कर देता है!.
syntax:
move_uploaded_file( temporyfilepath, destinationfilepath );
move_uploaded_file function में दो parameter सेट करने होते है!. first parameter temporyfilepath define करता है जब के दूसरा parameter server-side new location में send करने लिए new destinationfilepath define करता है!.
PHP $_FILES
PHP में $_FILES एक glabal varible है जो upload file के सभी information को collect करता है!. Image file की information जैसे की filename, filetype, filesize, tempfilename और file related error को रख सकता है!. ये सभी information को server-side get करने के लिए इस्तेमाल hone वाले specific files array जैसे की
$_FILES[‘filename’][‘name’]
$_FILES[‘filename’][‘name’] वह upload image file का file name return करता है!.
$_FILES[‘filename’][‘type’]
$_FILES[‘filename’][‘type’] वह upload image file का file type return करता है!.
$_FILES[‘filename’][‘size’]
$_FILES[‘filename’][‘size’] वह upload image file का file size return करता है!.
$_FILES[‘filename’][‘tmp_name’]
$_FILES[‘filename’][‘tmp_name’] वह image file हमारे computer और laptop में जिस location में store है वह tempary storage location return करता है!.
Image upload fullcode
<?php
/**
* Set Database Connection
*/
$servername = 'localhost';
$username = 'root';
$password = '';
$databasename = 'image';
// Set connection using mysqli_connect()
$conn = mysqli_connect($servername, $username, $password, $databasename);
// If $conn is false, connection is failed
if (!$conn ) {
die("Failed to connect to MySQL: " . mysqli_connect_error());
}
//for image upload php script
if(isset($_POST['submit'])){
$filepath = "images/" . $_FILES["image"]["name"];
$imagename = $_POST['img_name'];
$image = $_FILES['image']['name'];
$sql = 'INSERT INTO images (image_name , image) VALUES ("'.$imagename.'", "'.$image.'")';
//Query execution
$result = mysqli_query($conn, $sql);
if( $result ){
if(move_uploaded_file($_FILES["image"]["tmp_name"], $filepath)){
echo "Image upload successfully!";
}
else{
echo "Error !!";
}
}
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Image Upload</title>
</head>
<body>
<div id="main-form">
<form method="POST" action="" enctype="multipart/form-data">
<div>
<label>Image Name:</label>
<input type="text" name="img_name" id="img_name">
</div>
<div>
<label>Uploading Image:</label>
<input type="file" name="image" value="" />
</div>
<div>
<button type="submit" name="submit">UPLOAD</button>
</div>
</form>
</div>
</body>
</html>
