codigniter upload örneği etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
codigniter upload örneği etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

8 Mart 2015 Pazar

CodeIgniter - 4 - Upload - Resim Havuzu Örneği


Yeni yayınımdan merhabalar... Bu sefer, geçen yayınımda anlattığım CodeIgniter'da Upload meselesini biraz daha genişletmek istiyorum. Bugünkü uygulamamız şöyle olacak:

Bir resim havuzumuz olacak. Buraya resim upload edebileceğiz. Buradaki resimleri görebileceğiz ve silebileceğiz. Veritabanı işlemi yapmayacağız. Bu yayını anlayabilmeniz için, CodeIgniter'ın kurulumunu ve temel mantığını biliyor olmalısınız. Bu konuda sorun yaşıyorsanız, önceki yayınlarımı okuyabilirsiniz:

1- Merhaba Dünya
2- Template Sistemi
3- Resim Upload Etmek

Yine, kolay takip edebilmeniz için, adım adım anlatacağım. Ancak, Template Sistemi başlıklı yayınımdaki kurulumu yaptığınızı varsayıyorum. Buyrun:

1) Kök klasörümüze (site.com) assets adlı bir klasör açacağız. assets'in içine images adlı bir klasör açacağız. images'in içine de resimhavuzu adlı bir klasör açacağız. Upload edeceğimiz resimleri bu klasöre kaydedeceğiz: http://localhost/site.com/assets/images/resimhavuzu/

2) Öncelikle, application/controllers/ klasörü altına resimhavuzu.php adında bir dosya açalım ve bu controller'ımızın kodlarını yazalım:

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class resimhavuzu extends CI_Controller
{
    public function __construct() { parent::__construct(); }
 
    public function index()
    {      
        $data['bilgi'] = '';
        $data['uyari'] = '';

        $this->load->helper('directory');

        $map = directory_map('./public/assets/images/resimhavuzu/');

        $data['dosyalar'] = $map;

        $this->load->view('resimhavuzu_view',$data);
    }
}

Burada, resimhavuzu_view.php adlı view'a gönderilen $bilgi ve $uyari adlı değişkenler dikkatinizi çekmiştir. Eğer resim yükleme sırasında bir sorun oluşursa uyarımızı $uyari değişkenine, eğer işlem başarılı olursa da $bilgi değişkenine bilgi yükleyeceğiz. Ancak sayfa ilk yüklendiğinde (yani index() fonksiyonunda) bilgi veya uyarı görüntülenmeyecek. O yüzden, bu değişkenlere şimdilik boş bir string atadık. Şuanlık controller'ımız hazır. Buraya daha sonra tekrar döneceğiz. Ama öncelikle sayfamızı görmek için, view dosyamızı da oluşturalım...

3) application/views/ klasörü altına, resimhavuzu_view.php adında bir dosya oluşturalım ve içine şu basit formu yerleştirelim:

<!doctype html>
<html lang="tr-TR">
<head>
    <meta charset="UTF-8">
    <title>Resim Havuzu</title>
    <base href="<?=base_url()?>">
</head>
<body>
    <?=$bilgi?>
    <?=$uyari?>
    <hr />
    <form method='post' action='resimhavuzu/yukle' enctype='multipart/form-data'>
        <input type='file' name='resim' />
        <input type='submit' value='Resmi Yükle' />
    </form>
    <hr />
    <?php foreach($dosyalar as $dosya) { ?>
        <div><img src='assets/images/resimhavuzu/<?=$dosya?>' /></div>
        <div><a href='resimhavuzu/sil/<?=$dosya?>'><?=$dosya?> adlı resmi sil</a>
        <hr />
    <?php }?>
</body>
</html>

Burada, tasarımı güzelleştirecek hiçbir kod yazmadım. Siz CSS'le daha düzgün bir yapı oluşturabilirsiniz. Konumuz bu değil. Bu sayfayı oluşturduğunuzda,
http://localhost/site.com/resimhavuzu
linki ile sayfaya erişebilirsiniz. "Resmi Yükle" butonuna tıkladığınızda, url'miz şu şekle girecek:
http://localhost/site.com/resimhavuzu/yukle
Bunun anlamı: "resimhavuzu adlı controller'ın yukle() adlı fonksiyonunu çalıştır"
Ancak henüz böyle bir fonksiyon oluşturmadık. Sıra bunu oluşturmaya geldi.

4) Şimdi yeniden application/controllers/resimhavuzu.php yolundaki controller'ımızı açalım ve index() fonksiyonundan sonra, class'ımızın içinde kalacak şekilde, şu fonksiyonu da ekleyelim:

public function yukle()
{
    $data['bilgi'] = '';
    $data['uyari'] = '';

    if( !$this->input->post() ) $data['uyari'] = 'Bu sayfaya direkt erişmemelisiniz';
    else
    {
        $config['upload_path'] = 'assets/images/resimhavuzu/';
        $config['allowed_types'] = 'gif|jpg|jpeg|png';
        $config['file_name'] = 'ResimHavuzu';

        $this->load->library('upload', $config);
        $sonuc = $this->upload->do_upload('resim');

        if( !$sonuc ) $data['uyari'] = '<strong>Hata:</strong> '.$this->upload->display_errors();
        else
        {
            $yuklenen_ad = $this->upload->data()['raw_name'].$this->upload->data()['file_ext'];
            $data['bilgi'] = 'Resim, "'.$yuklenen_ad.'" adıyla, başarıyla yüklendi.';
        }

        $this->load->helper('directory');

        $data['dosyalar'] = directory_map('./public/assets/images/resimhavuzu/');

        $this->load->view('resimhavuzu_view',$data);
    }
}

Merak edenler için: Dosyaları bir dizi halinde bize sunan, CodeIgniter'ın directory_map() fonksiyonunu kullanabilmek için, directory adlı helper'ı yüklememiz gerekiyordu.

yukle() fonksiyonumuzu da yazmamızla birlikte, şuan resim upload edebiliyoruz. Şimdi de sıra, son işlemimiz olan silme işleminde... resimhavuzu_view.php dosyamızda bir link koymuştuk: Her resmin altında, resimhavuzu/sil/dosyaadı şeklinde href parametresi barındıran bir <a> tagı. Şimdi, bu linke tıklandığında olacakları işleyelim.

5) Yüklediğimiz resimlerin altındaki linklere tıkladığımızda, şöyle bir url yapımız oluyor:
http://localhost/site.com/resimhavuzu/sil/ResimHavuzu3.jpg
Anlamı: resimhavuzu controller'ındaki sil() fonksiyonuna ResimHavuzu3.jpg parametresini göndererek çalıştır.

O halde, application/controllers/resimhavuzu.php yolundaki controller'ımızı açalım ve bir parametre alan sil() fonksiyonumuzu oluşturalım. yukle() fonksiyonundan sonra, şu fonksiyonu ekleyin:

public function sil($dosya='')
{
    if( $dosya == '' ) redirect(base_url().'resimhavuzu');

    unlink('public/assets/images/resimhavuzu/'.$dosya);
    $data[bilgi'] = $dosya.' adlı resim, resim havuzundan kaldırıldı.';

    $this->load->helper('directory');
    $data['dosyalar'] = directory_map('./public/assets/images/resimhavuzu/');
    $this->load->view('resimhavuzu_view',$data);
}

İşte bu kadar. Artık resimhavuzu adlı klasörümüze resim ekleyebiliyoruz. Resimleri listeleyebiliyoruz ve silebiliyoruz. Temel haliyle bu bilgileri anlatmaya çalıştım. Bunun üzerine kendinize göre sayfayı tasarlayabilirsiniz.

Mesela resmi silmek için ilgili linke tıklandığında, pat diye silmesin de önce bir sorsun mu istiyorsunuz? O halde linkleri şu şekilde düzenleyin:

<a
    href='assets/images/resimhavuzu/<?=$dosya?>'
    onclick='return confirm('<?=$dosya?> adlı resim silinecek!');'
>
    <?=$dosya?> adlı resmi sil
</a>

Veya eğer hiç resim yoksa, resimlerin listelendiği bölüme "Hiç resim yok" yazmasını isteyebilirsiniz. Bunun için de, resimleri listeleyen foreach döngüsünü kapsayan bir if yapısı kullanabilirsiniz:

<?php if( count($dosyalar) > 0 ) { ?>
    <?php foreach($dosyalar as $dosya) { ?>
        ...
    <?php } ?>
<?php } else echo 'Hiç resim yok'; ?>

Bu gibi geliştirmeler size kalmış. Başka bir yayında görüşmek üzere. :)

5 Mart 2015 Perşembe

CodeIgniter - 3 - Resim Upload Etmek


Upload Meselesi


Buraya kadar olan yayınlarımı okuduysanız, codeigniter kurulumu hakkında bilgi sahibisiniz demektir.

Eğer okumadıysanız, şu linklerden ulaşabilirsiniz:
Yayın 1 - Merhaba Dünya
Yayın 2 - Template Sistemi

CodeIgniter'a yeni başlayanların merak ettikleri, çözüm bulmakta zorlandıkları bir konu hakkında bilgi vermek istiyorum. Nasıl resim upload ederiz? Bu iş çok basit. Ben de mümkün olduğunca, işinize yaramayacak kodları kullanmadan anlatıyorum:

Öncelikle bir view dosyası oluşturalım. application/views/ altına resimyukle_view.php adında bir dosya açalım. Burada, resim upload edeceğimiz bir formumuz olacak. Resmi POST ettiğimizde de yine aynı sayfa görüntülenecek ve "Resim başarıyla yüklendi!" mesajı verecek.

<html>
    <head>
        <title>Upload</title>
        <base href="http://localhost/site.com/" />
    </head>
    <body>
        <div><?=$bilgi?></div>
        <form action="resimyukle/yukle" method="post" enctype="multipart/form-data" >
            <div><strong>Resim Seçin:</strong> <input type="file" name="resim" /></div>
            <div><input type="submit" value="Yükle" /></div>
        </form>
    </body>
</html>

Böylelikle bir formumuz oldu. Bu view sayfası, resimyukle adlı controller'a bağlı. Bu controller'ımızı da oluşturalım. application/controllers/ klasörü içine resimyukle.php adlı bir dosya oluşturun ve şunları yazın:

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class resimyukle extends CI_Controller
{
        public function __construct() { parent::__construct(); }

        public function index()
        {
            $data['bilgi'] = '';
            $this->load->view('resimyukle_view', $data);
        }

        public function yukle()
        {          
            $config['upload_path'] = 'assets/images/'; // dosyayı upload edeceğimiz klasör
            $config['allowed_types'] = 'gif|jpg|jpeg|png';                // izin verilen dosya uzantıları
            $config['file_name'] = 'Resim';                                      // dosya hangi adla kaydedilsin?

            $this->load->library('upload', $config);               // CodeIgniter'ın upload sınıfını yükledik
            $sonuc = $this->upload->do_upload('resim');     // Dosyamızı upload ediyoruz.
         
            if($sonuc) $data['bilgi'] = 'Resim başarıyla yüklendi!';
            else $data['bilgi'] = 'Resim yüklenemedi. Hata Mesajı: '.$this->upload->display_errors();

            $this->load->view('resimyukle_view', $data);
        }
}

İşe bu kadar. Ama kafanıza takılan sorular var... Yüklediğimiz resim, "Resim" adıyla kaydoluyor. Peki ya yine resim yüklemek istersek, o da mı "Resim" adıyla kaydedilecek (yani üzerine mi yazılacak)? Hayır. Eğer yeni bir resim upload edilirse, klasörde "Resim" adlı başka bir resim dosyası olduğundan, Resim1 olarak kaydedecektir. (dosya uzantısını kendisi ekliyor) Ama eğer istersek bir ayar yapıp, aynı adlı dosyanın üzerine yazılmasını da sağlayabiliriz.

Şimdi biraz detaylandıralım.

1) $config adlı bir dizi kullandık ve upload kütüphanemizi yüklerken, bu diziyi de parametre olarak belirttik. Bu dizinin ne işe yaradığını anlamışsınızdır zaten. Upload işleminin ayarlarını belirtiyoruz. Peki bu ayarlara başka nasıl parametreler verebilirdik? Buyrun, ellislab.com sitesinden aldığım tabloyu kendimce Türkçe'ye çevirdim:

ÖzellikVarsayılan DeğerTürAçıklama
upload_pathNone(string)Resmi hangi klasöre kaydedeceğiz?
Tam yol vermemiz gerekiyor.
allowed_typesNone(string)Hangi dosya uzantılarına izin vereceğiz?
Örnek: 'gif|jpg|jpeg|png'
file_nameNone(string)Eğer bu parametreye (üstteki örnekte 'Resim'  dediğimiz gibi) bir değer verirsek, dosyayı bu isimle kaydeder.
Eğer parametre vermezsek, dosyayı orijinal adıyla kaydeder.
(Uyarı: Türkçe karakterlerde sorun yaşarsınız)
overwriteFALSETRUE/FALSE
(boolean)
Adı üzerinde. Kaydedilen dosyayla aynı dosya adına sahip başka dosya varsa, üzerine yazılsın mı?
max_size0(int)KB cinsinden, izin verilen maksimum dosya boyutu.
0 verilirse, limitsiz kabul edilir.
(PHP'nin verdiği limit başka bir mevzu tabii ki...)
max_width0(int)Piksel cinsinden, izin verilen maksimum genişlik değeri.
0 verilirse, limitsiz kabul edilir.
max_height0(int)Piksel cinsinden, izin verilen maksimum yükseklik değeri.
0 verilirse, limitsiz kabul edilir.
max_filename0(int)Dosya adının uzunluğu en fazla kaç karakter olsun?
0 verilirse, limitsiz kabul edilir.
encrypt_nameFALSETRUE/FALSE
(boolean)
Hiç kullanmadım ama sanırım true yapılırsa, dosya adını rastgele şifreli bir adla değiştiriyor.
remove_spacesTRUETRUE/FALSE
(boolean)
Dosya adındaki boşluklar silinsin mi?

2) Yükleme işlemi başarılı olduğunda, yüklenen dosyayla ilgili hangi verilere ulaşabiliriz? Öyle ya, dosyamız yüklendikten sonra bu dosyayı veritabanına da yazmak isteyebiliriz. O halde, kaydedilen resim adını bir değişkene atabilmek isteriz.

$this->upload->do_upload(); fonksiyonumuzdan true dönmüşse, yani resim başarıyla kaydedilmişse, $this->upload->data() komutuyla bize sunulan dizi ile, şu bilgilere ulaşabiliriz:

$bilgiler = $this->upload->data();

$resmin_orijinal_adi = $bilgiler['orig_name'];

$yuklenen_resmin_adi = $bilgiler['raw_name'].$bilgiler['file_ext'];

$yuklenen_klasor_yolu = $bilgiler['file_path'];  //  assets/images/

$yuklenen_dosya_yolu = $bilgiler['full_path'];  //   assets/images/Resim.jpg

$resim_uzantisi = $bilgiler['file_ext'];  //   .jpg

$resim_mi = $bilgiler['is_image'];  //   1

$resim_width = $bilgiler['image_width'];  //   800

$resim_height = $bilgiler['image_height'];  //   600

$img_icin_genislik = $bilgiler['image_size_str'];  // width='800' height='200'
//Bunu da bir img tagına kolayca yazabilelim diye yapmışlar herhalde.

Umarım bir yardımım dokunmuştur. Yorumlarınızı beklerim.
 Başka yayınlarda görüşmek üzere...

Site Haritası

CodeIgniter Yayınları 1. Merhaba Dünya : CodeIgniter'da Merhaba Dünya yazısını görün... 2. Template Sistemi : CodeIgniter ile sta...