इमेज और फाइल कैसे अपलोड करें Codeइग्नाइटर (उदाहरण सहित)

द्वारा: फियोना ब्राउन फियोना ब्राउन
Hours Updated

⚡ स्मार्ट सारांश

CodeIgniter File Upload, HTML फॉर्म से छवियों और दस्तावेज़ों को सर्वर डायरेक्टरी में स्थानांतरित करने के लिए अंतर्निहित अपलोड लाइब्रेरी का उपयोग करता है। यह उदाहरण एक अपलोड फॉर्म, प्रकार और आकार को मान्य करने वाला एक कंट्रोलर और अपलोड की पुष्टि करने वाला एक परिणाम पृष्ठ बनाता है।

  • 📁 मुख्य कक्षा: अपलोड लाइब्रेरी सबमिट की गई फ़ाइल को मान्य करने और उसे चुने गए अपलोड डायरेक्टरी में लिखने का बैकएंड कार्य संभालती है।
  • 🖼️ दो भाग: किसी अपलोड के लिए फ्रंटएंड में एक HTML फॉर्म की आवश्यकता होती है जिसमें इनपुट टाइप के रूप में 'फ़ाइल' हो, साथ ही एक बैकएंड कंट्रोलर की भी आवश्यकता होती है जो सबमिशन को प्रोसेस करे।
  • 🔒 टाइप व्हाइटलिस्ट: allowed_types कॉन्फ़िगरेशन केवल सूचीबद्ध एक्सटेंशन जैसे gif, jpg और png को ही स्वीकार करता है, जिससे PHP स्क्रिप्ट जैसी जोखिम भरी फ़ाइलों को ब्लॉक कर दिया जाता है।
  • 📏 आकार सीमाएँ: max_size, max_width और max_height कुंजी उन फ़ाइलों को अस्वीकार कर देती हैं जो सीमा से अधिक होती हैं और एक स्पष्ट त्रुटि संदेश लौटाती हैं।
  • 📝 फॉर्म एन्कोडिंग: फॉर्म में enctype को multipart/form-data पर सेट करना आवश्यक है, अन्यथा चयनित फ़ाइल सर्वर तक कभी नहीं पहुंचेगी।
  • 📄 परिणाम और डेटा: सफलता मिलने पर, upload->data() फ़ंक्शन फ़ाइल विवरण लौटाता है जिसका उपयोग नई संग्रहीत छवि का लिंक बनाने के लिए किया जाता है।
  • 🤖 एआई सहायता: एआई उपकरण अपलोड फॉर्म, नियंत्रक सत्यापन नियम और त्रुटि प्रबंधन उत्पन्न कर सकते हैं, और फिर सुरक्षा खामियों के लिए उनकी समीक्षा कर सकते हैं।
विस्तार में पढ़ें

Codeइग्निटर फ़ाइल अपलोड

Codeइग्निटर फ़ाइल अपलोड

अधिकांश वेब अनुप्रयोगों के लिए फ़ाइल प्रबंधन आवश्यक है। यदि आप डेवलपर हैं...ping यदि आप किसी कंटेंट मैनेजमेंट सिस्टम पर काम कर रहे हैं, तो आपको इमेज, वर्ड डॉक्यूमेंट, पीडीएफ रिपोर्ट आदि अपलोड करने में सक्षम होना होगा। यदि आप किसी सदस्यता साइट पर काम कर रहे हैं, तो आपको लोगों को अपनी प्रोफाइल इमेज अपलोड करने की सुविधा प्रदान करनी पड़ सकती है। CodeIgniter File Uploading क्लास की मदद से हम उपरोक्त सभी कार्य आसानी से कर सकते हैं।

इस ट्यूटोरियल में, हम देखेंगे कि फ़ाइलों को लोड करने के लिए फ़ाइल अपलोड लाइब्रेरी का उपयोग कैसे करें।

छवियों को अपलोड करना Codeआग लगनेवाला

फ़ाइल अपलोड करना Codeआग लगनेवाला इसके दो मुख्य भाग हैं: फ्रंटएंड और बैकएंड। फ्रंटएंड को HTML फॉर्म द्वारा नियंत्रित किया जाता है जो फ़ाइल इनपुट प्रकार का उपयोग करता है। बैकएंड पर, फ़ाइल अपलोड लाइब्रेरी फॉर्म से सबमिट किए गए इनपुट को प्रोसेस करती है और उसे अपलोड डायरेक्टरी में लिखती है।

आइए इनपुट फॉर्म से शुरू करते हैं।

application/views डायरेक्टरी में files नाम की एक नई डायरेक्टरी बनाएं।

application/views/files में निम्न फ़ाइलें जोड़ें

  • upload_form.php - इस दृश्य में HTML फ़ॉर्म होता है जिसमें फ़ाइल का इनपुट प्रकार होता है और चयनित फ़ाइल को प्रसंस्करण के लिए सर्वर पर सबमिट करता है
  • upload_result.php – यह व्यू अपलोड की गई इमेज के परिणाम प्रदर्शित करता है, जिसमें एक लिंक भी शामिल है जिस पर क्लिक करके हम परिणाम देख सकते हैं।

upload_form.php में निम्न कोड जोड़ें

<!DOCTYPE html>
<html>
<head>
<title>CodeIgniter Image Upload</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div>
<h3>Select an image from your computer and upload it to the cloud</h3>
<?php
if (isset($error)){
echo $error;
}
?>
<form method="post" action="<?=base_url(0)?>" enctype="multipart/form-data">
<input type="file" id="profile_image" name="profile_image" size="33" />
<input type="submit" value="Upload Image" />
</form>
</div>
</body>
</html>

यहाँ,

  • if (isset($error)){…} यह जांचता है कि त्रुटि चर सेट किया गया है या नहीं। यदि परिणाम सही है, तो अपलोड लाइब्रेरी द्वारा लौटाई गई त्रुटि उपयोगकर्ता को प्रदर्शित की जाती है।
  • इस प्रकार की फ़ाइल उपयोगकर्ता को अपने कंप्यूटर पर जाकर अपलोड करने के लिए एक फ़ाइल चुनने की अनुमति देती है।

संबंधित आलेख

upload_result.php में निम्नलिखित कोड जोड़ें।

<!DOCTYPE html>
<html>
<head>
<title>Image Upload Results</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div>
<h3>Congratulations, the image has successfully been uploaded</h3>
<p>Click here to view the image you just uploaded
<?=anchor('images/'.$image_metadata['file_name'], 'View My Image!')?>
</p>
 
<p>
<?php echo anchor('upload-image', 'Go back to Image Upload'); ?>
</p>
</div>
</body>
</html>

यहाँ,

  • यह एंकर हेल्पर का उपयोग करके इमेज डायरेक्टरी में नई अपलोड की गई फ़ाइल का लिंक बनाता है। फ़ाइल के सफलतापूर्वक अपलोड होने पर व्यू को भेजे गए इमेज मेटाडेटा से नाम प्राप्त किया जाता है।

अब आइए एक कंट्रोलर बनाते हैं जो हमारी इमेज अपलोडिंग पर प्रतिक्रिया देगा।

एप्लिकेशन/कंट्रोलर्स में एक नई फ़ाइल ImageUploadController.php जोड़ें

ImageUploadController.php में निम्न कोड जोड़ें

<?php
 
defined('BASEPATH') OR exit('No direct script access allowed');
 
class ImageUploadController extends CI_Controller {
 
public function __construct() {
parent::__construct();
$this->load->helper('url', 'form');
}
 
public function index() {
$this->load->view('files/upload_form');
}
 
public function store() {
$config['upload_path'] = './images/';
$config['allowed_types'] = 'gif|jpg|png';
$config['max_size'] = 2000;
$config['max_width'] = 1500;
$config['max_height'] = 1500;
 
$this->load->library('upload', $config);
 
if (!$this->upload->do_upload('profile_image')) {
$error = array('error' => $this->upload->display_errors());
 
$this->load->view('files/upload_form', $error);
} else {
$data = array('image_metadata' => $this->upload->data());
 
$this->load->view('files/upload_result', $data);
}
}
 
}

यहाँ,

  • class ImageUploadController extends CI_Controller {…} हमारे नियंत्रक वर्ग को परिभाषित करता है और आधार नियंत्रक CI_Controller को विस्तारित करता है
  • सार्वजनिक फ़ंक्शन __construct() {…} पैरेंट कंस्ट्रक्टर विधि को आरंभ करता है और URL और फ़ॉर्म हेल्पर्स को लोड करता है
  • सार्वजनिक फ़ंक्शन इंडेक्स() {…} इंडेक्स विधि को परिभाषित करता है जिसका उपयोग छवि अपलोड फ़ॉर्म को प्रदर्शित करने के लिए किया जाता है
  • public function store() {…} उस विधि को परिभाषित करता है जो छवि को अपलोड करेगा और उसे वेब अनुप्रयोग सर्वर पर संग्रहीत करेगा।
    • $config['upload_path'] = './images/'; वह निर्देशिका सेट करता है जहां छवियों को अपलोड किया जाना चाहिए
    • $config['allowed_types'] = 'gif|jpg|png'; स्वीकार्य फ़ाइल एक्सटेंशन को परिभाषित करता है। सुरक्षा कारणों से यह महत्वपूर्ण है। अनुमत प्रकार यह सुनिश्चित करते हैं कि केवल छवियां ही अपलोड हों और PHP जैसी अन्य फ़ाइल प्रकार अपलोड न हों, क्योंकि इनसे सर्वर को नुकसान पहुंचने का खतरा होता है।
    • $config['max_size'] = 2000; किलोबाइट में अधिकतम फ़ाइल आकार निर्धारित करता है। हमारे उदाहरण में, अपलोड की जा सकने वाली अधिकतम फ़ाइल 2,000 किलोबाइट (लगभग 2MB) है। यदि उपयोगकर्ता 2,000 किलोबाइट से बड़ी फ़ाइल अपलोड करने का प्रयास करता है, तो छवि अपलोड नहीं हो पाएगी और लाइब्रेरी एक त्रुटि संदेश प्रदर्शित करेगी।
    • $config['max_width'] = 1500; यह इमेज की अधिकतम चौड़ाई निर्धारित करता है, जो हमारे मामले में 1,500 px है। इससे अधिक चौड़ाई होने पर त्रुटि उत्पन्न होती है।
    • $config['max_height'] = 1500; अधिकतम स्वीकार्य ऊंचाई को परिभाषित करता है।
    • $this->load->library('upload', $config); अपलोड लाइब्रेरी को लोड करता है और इसे $config सरणी के साथ आरंभ करता है जिसे हमने ऊपर परिभाषित किया है।
    • यदि (!$this->upload->do_upload('profile_image')) {…} सबमिट की गई छवि को अपलोड करने का प्रयास करता है, जिसका नाम हमारे मामले में profile_image है।
    • $error = array('error' => $this->upload->display_errors()); अपलोड विफल होने पर त्रुटि संदेश सेट करता है
    • $this->load->view('files/upload_form', $error); फ़ाइल अपलोड फ़ॉर्म लोड करता है और अपलोड लाइब्रेरी से लौटाए गए त्रुटि संदेश को प्रदर्शित करता है
    • $data = array('image_metadata' => $this->upload->data()); यदि अपलोड सफल रहा है तो छवि मेटाडेटा सेट करता है
    • $this->load->view('files/upload_result', $data); सफलतापूर्वक अपलोड किए गए दृश्य को लोड करता है और अपलोड की गई फ़ाइल मेटाडेटा को पास करता है।

कंट्रोलर का काम यहीं समाप्त होता है। अब आइए वह डायरेक्टरी बनाते हैं जहाँ हमारी इमेज अपलोड की जाएंगी। अपने एप्लिकेशन की रूट डायरेक्टरी में "इमेजेज" नाम की एक नई डायरेक्टरी बनाएं।

अंत में, हम अपनी routes.php फ़ाइल में दो रूट जोड़ेंगे जो फॉर्म प्रदर्शित करेंगे और परिणाम दिखाएंगे।

application/config/routes.php फ़ाइल खोलें और उसमें निम्नलिखित रूट जोड़ें।

$route['upload-image'] = 'imageuploadcontroller';
$route['store-image'] = 'imageuploadcontroller/store';

यहाँ,

  • $route['upload-image'] = 'imageuploadcontroller'; परिभाषित करता है URL upload-image जो ImageUploadController के index मेथड को कॉल करता है
  • $route['store-image'] = 'imageuploadcontroller/store'; परिभाषित करता है URL store-image एक ऐसा टूल है जो चयनित उपयोगकर्ता फ़ाइल को स्वीकार करता है और उसे सर्वर पर अपलोड करता है।

सामान्य समस्याओं को कैसे ठीक करें Codeइग्नाइटर फ़ाइल अपलोड त्रुटियाँ

अपलोड लाइब्रेरी से अपलोड विफलताओं के संबंध में अधिकतर मामलों में एक स्पष्ट संदेश प्राप्त होता है। नीचे दी गई सूची में सामान्य त्रुटियों और उनके समाधानों का विवरण दिया गया है।

  • आप जिस प्रकार की फ़ाइल अपलोड करने का प्रयास कर रहे हैं, वह अनुमत नहीं है: allowed_types कॉन्फ़िगरेशन में छूटे हुए एक्सटेंशन को जोड़ें, उदाहरण के लिए 'gif|jpg|png|pdf'।
  • आप जिस फ़ाइल को अपलोड करने का प्रयास कर रहे हैं, वह अनुमत आकार से बड़ी है: max_size को बढ़ाएं, और php.ini में upload_max_filesize और post_max_size पर्याप्त रूप से बड़े हैं या नहीं, इसकी पुष्टि करें।
  • अपलोड पथ मान्य प्रतीत नहीं होता है: upload_path डायरेक्टरी बनाएं और सुनिश्चित करें कि वेब सर्वर के पास उस पर लिखने की अनुमति हो।
  • आपने अपलोड करने के लिए कोई फ़ाइल नहीं चुनी: जांचें कि इनपुट नाम do_upload() तर्क से मेल खाता है और फॉर्म enctype multipart/form-data का उपयोग करता है।

एप्लिकेशन का परीक्षण

चलिए बिल्ट-इन PHP सर्वर शुरू करते हैं।

टर्मिनल या कमांड लाइन खोलें और अपने एप्लिकेशन के रूट फ़ोल्डर में जाएं। मेरे मामले में, रूट फ़ोल्डर C:\Sites\ci-app ड्राइव में स्थित है।

cd C:\Sites\ci-app

निम्न कमांड का उपयोग करके सर्वर प्रारंभ करें

php -S localhost:3000

निम्नलिखित को लोड करें URL अपने वेब ब्राउज़र में: http://localhost:3000/upload-image

आपको निम्नलिखित परिणाम देखने को मिलेंगे।

छवियों को अपलोड करना Codeआग लगनेवाला

फ़ाइल चुनें पर क्लिक करें

आपको निम्नलिखित के समान एक संवाद विंडो दिखाई देगी

छवियों को अपलोड करना Codeआग लगनेवाला

अपनी इच्छित छवि का चयन करें, फिर ओपन पर क्लिक करें।

छवियों को अपलोड करना Codeआग लगनेवाला

चयनित फ़ाइल का नाम अपलोड फ़ॉर्म में दिखाई देगा, जैसा कि ऊपर दिए गए चित्र में दिखाया गया है। अपलोड इमेज बटन पर क्लिक करें।

यदि सब कुछ ठीक रहा तो आपको निम्नलिखित परिणाम प्राप्त होंगे।

छवियों को अपलोड करना Codeआग लगनेवाला

"मेरी छवि देखें!" लिंक पर क्लिक करें

आपको अपलोड की गई छवि दिखाई देनी चाहिए। परिणाम निम्न के समान होंगे।

छवियों को अपलोड करना Codeआग लगनेवाला

ध्यान दें कि अपलोड की गई छवि का नाम प्रदर्शित होता है। URLहमने अपलोड की गई छवि के मेटाडेटा से छवि का नाम प्राप्त किया।

नोट: अन्य प्रकार की फाइलों के लिए फाइल अपलोड करने की प्रक्रिया समान ही रहती है।

अक्सर पूछे जाने वाले प्रश्न

RSI CodeIgniter 3 अपलोड लाइब्रेरी do_upload() कॉल के माध्यम से एक फ़ाइल को हैंडल करती है, इसलिए आप $_FILES पर लूप करते हैं और प्रत्येक आइटम के लिए इसे कॉल करते हैं। CodeIgniter 4, getFileMultiple() विधि के माध्यम से सीधे एकाधिक अपलोड का समर्थन करता है।

नहीं. CodeIgniter 4 में अपलोड लाइब्रेरी को रिक्वेस्ट फाइल API से बदल दिया गया है। आप $this->request->getFile('field') को कॉल करते हैं, उसे वैलिडेट करते हैं, और फिर अलग से अपलोड लाइब्रेरी लोड करने के बजाय, फ़ाइल को स्टोर करने के लिए move() का उपयोग करते हैं।

प्रत्येक फ़ाइल को एक यादृच्छिक नाम देने के लिए $config['encrypt_name'] को TRUE पर सेट करें, या $config['file_name'] को अपनी पसंद के किसी मान पर सेट करें। इससे समान मूल नाम वाली मौजूदा फ़ाइलों को ओवरराइट होने से रोका जा सकेगा।

जी हां। AI अनुमत प्रकारों की श्वेतसूची, आकार सीमा और त्रुटि प्रबंधन तैयार कर सकता है, और वास्तविक MIME प्रकार की पुष्टि जैसे अतिरिक्त जांचों का सुझाव दे सकता है। तैनाती से पहले हमेशा वास्तविक फ़ाइलों के विरुद्ध उत्पन्न नियमों का परीक्षण करें।

जी हां। त्रुटि संदेश और अपने कंट्रोलर को पेस्ट करें, और AI कई समस्याओं का पता लगा सकता है, जैसे कि मल्टीपार्ट फॉर्म का न होना, अपलोड_पाथ का न लिखा जा सकना, या allowed_types से एक्सटेंशन का न होना, और फिर समाधान सुझा सकता है।

इस पोस्ट को संक्षेप में इस प्रकार लिखें: