使用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); 
}