使用Codeigniter進行照片上傳，裁剪和保存

Question

我們正在開發基於CI框架的社交網絡項目。我在網上搜索，但感到困惑。如何上傳照片，允許用戶裁剪照片並使用數據庫保存，以便在通話時檢索照片？我正在使用這個資料圖片。

在視圖：

<?php echo form_open_multipart ('index.php/Main/do_upload'); ?> 
<table class="table"> 
    <tr> 
     <td>Title</td> 
     <td><?php echo form_input('title'); ?></td> 
    </tr> 
    <tr> 
     <td>Image</td> 
     <td><?php echo form_upload('userfile'); ?></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td><?php echo form_submit('submit', 'Save', 'class="btn btn-primary"'); ?></td> 
     <?php echo form_close(); ?> 
    </tr>  
</table> 

在控制器：

public function do_upload() 
{ 
    $config['upload_path']   = './uploads/'; 
    $config['allowed_types']  = 'gif|jpg|png'; 
    $config['max_size']    = 100; 
    $config['max_width']   = 1024; 
    $config['max_height']   = 768; 

    $this->load->library('upload', $config); 

    if (! $this->upload->do_upload('userfile')) 
    { 
     $error = array('error' => $this->upload->display_errors()); 

     $this->load->view('Material_view', $error); 
    } 
    else 
    { 
     $data = array('upload_data' => $this->upload->data()); 

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

Answer 1

使用Bluimp多個文件上傳（https://blueimp.github.io/jQuery-File-Upload）和Croppr（https://fengyuanchen.github.io/cropperjs/）插件一起。 在Bluimp中，您可以獲得足夠的代碼（在他們的站點中有codeigniter類）來處理codeigniter中的文件上傳。

Answer 2

請嘗試與cropper js。我已經使用這個，這是非常容易的，它會完全填滿你的要求

https://github.com/fengyuanchen/cropper

Answer 3

創建圖像模型和粘貼代碼

<?php 
class Image_model extends CI_Model { 
public function __construct() { 
    parent::__construct(); 
    $this->load->helper('url'); 
    $this->load->library('upload'); 
    $this->load->library('image_lib'); 
} 
public function do_resize($filename) 
{ 

    $source_path = 'uploads/' . $filename; 
    $target_path = 'uploads/thumb/thumb_'.$filename; 

    $config_manip = array(

     'image_library' => 'gd2', 
     'source_image' => $source_path, 
     'new_image' => $target_path, 
     'maintain_ratio' => TRUE, 
     'width' => 150, 
     'height' => 150 
    ); 
    $this->image_lib->initialize($config_manip); 
    $this->load->library('image_lib', $config_manip); 


    if (!$this->image_lib->resize()) { 
     echo $this->image_lib->display_errors(); 
     die(); 
    } 
} 

public function img_upload() 
{ 
    $config = array(
     'upload_path' => "uploads", 
     'allowed_types' => "*", 
     'overwrite' => TRUE, 
     'max_size' => "5048000", // Can be set to particular file size , here it is 2 MB(2048 Kb) 
     'max_height' => "3000", 
     'max_width' => "3000" 
    ); 
    $this->upload->initialize($config); 
    $this->load->library('upload', $config); 

    if($this->upload->do_upload()) { 
     $response = array('upload_data' => $this->upload->data()); 
     $this->do_resize($response['upload_data']['file_name']); 

    } 
    /*else{ 
     $error    = array('error'=>$this->upload->display_errors()); 
     //print_r($error);die(); 

    }*/ 
    } 
} 

調用此函數像這樣在你的控制器

<?php if (! defined('BASEPATH')) exit('No direct script access allowed'); 
class Post extends CI_Controller { 
    public function __construct(){ 
    parent::__construct(); 
    $this->load->model('image_model'); 
    } 
    public function add() { 
     if(isset($_FILES)){ 
      $config    = $this->image_model->img_upload(); 
      $file_data    = $this->upload->data(); 
      $data['feature_image'] = $file_data['file_name']; 
      } 
    $lat_id  =  $this->your_model->save($data); 
}