CodeIgniter图像水印在使用动态输出时返回空白图像

Question

我正在使用jquery将数据发布到控制器函数，该函数将位于服务器上的图像进行水印并动态地将其发回。水印功能在我不使用动态输出时起作用，但是当我这样做时，它只是返回一个空白图像，其周围有1像素的灰色边框。

返回的图像命名正确，并且正确地应用了图像类型标头。这是从网络检查返回狼吞虎咽-DE-对韩国人的第一行：

ÿØÿàJFIFÿþ;CREATOR: gd-jpeg v1.0 (using IJG JPEG v90), quality = 90 

实现这一点的任何替代方法，将不胜感激，都在这现在花费数天时间，但收效甚微。如果可能的话，我宁愿保持服务器上的图像不变。

的Java：

$('#body').on('click', '#get_file', function(ev) 
{ 
    ev.preventDefault(); 

    var type = 'file'; 
    var uid = $('#file_select').val(); 

    var v1 = retD['res'][0].v1; 
    var v2 = retD['res'][0].v2; 
    var v3 = retD['res'][0].v3; 
    var v4 = retD['res'][0].v4; 

    $.ajax({ 
     type: 'POST', 
     url: '<?php echo site_url("Home_controller/drawInfo") ?>', 
     data: {v1:v1, v2:v2, v3:v3, v4:v4}, 
     dataType: 'html', 
     success: function(img) 
     { 
      $("#i").attr("src", img); 
     } 
    }); 
}); 

控制器：

function drawInfo() 
{ 
    $v1 = $_POST['v1']; 
    $v2 = $_POST['v2']; 
    $v3 = $_POST['v3']; 
    $v4 = $_POST['v4']; 

    $config['image_library'] = 'gd2'; 
    $config['source_image'] = './img/Test_image.jpg'; 
    $config['wm_text'] = 'v1: ' . $v1 . ' v2: ' . $v2 . ' v3: ' . $v3 . ' v4: ' . $v4; 
    $config['wm_type'] = 'text'; 
    $config['dynamic_output'] = true; 
    $config['wm_font_color'] = 'ff0000'; 
    $config['wm_font_path'] = './system/fonts/texb.ttf'; 
    $config['wm_vrt_alignment'] = 'bottom'; 
    $config['wm_hor_alignment'] = 'center'; 
    $config['wm_padding'] = '20'; 

    $this->image_lib->initialize($config); 

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

Answer 1

从您再回到与图像的二进制数据的控制器，但在使用Javascript，你想用它作为的“SRC”属性img元素。

在控制器中，您应该返回新生成的图像的src。
当您设置路径并将权限设置到您将生成映像的文件夹（它应该可以由apache写入）时，请小心。

控制器：

function drawInfo() 
{ 
    $return = array(
     'src' => '', 
     'error' => '', 
    ); 
    $v1 = $_POST['v1']; 
    $v2 = $_POST['v2']; 
    $v3 = $_POST['v3']; 
    $v4 = $_POST['v4']; 

    $config['image_library'] = 'gd2'; 
    // set image path 
    $config['source_image'] = FCPATH . 'img/Test_image.jpg'; 
    // this image will be watermarked (path should be writable by apache!!!) 
    $config['new_image'] = FCPATH . 'img/Test_image_new.jpg'; 
    $config['wm_text'] = 'v1: ' . $v1 . ' v2: ' . $v2 . ' v3: ' . $v3 . ' v4: ' . $v4; 
    $config['wm_type'] = 'text'; 
    // to false to save image to file instead of print it (you can leave this setting because the false is the default value) 
    $config['dynamic_output'] = false; 
    $config['wm_font_color'] = 'ff0000'; 
    // set the proper path!! 
    $config['wm_font_path'] = FCPATH . 'system/fonts/texb.ttf'; 
    $config['wm_vrt_alignment'] = 'bottom'; 
    $config['wm_hor_alignment'] = 'center'; 
    $config['wm_padding'] = '20'; 

    $this->image_lib->initialize($config); 

    if(!$this->image_lib->watermark()) 
    { 
     $return['error'] = $this->image_lib->display_errors(); 
    } 
    else 
    { 
     // generate the URL of the new watermarked image (modify to your needs) 
     $return['src'] = base_url() .'/'. $config['new_image']; 
    } 
    echo json_encode($return); 
} 

JavaScript的：

$.ajax({ 
     type: 'POST', 
     url: '<?php echo site_url("Home_controller/drawInfo") ?>', 
     data: {v1:v1, v2:v2, v3:v3, v4:v4}, 
     dataType: 'html', 
     success: function(response) 
     { 
      if(response.error) 
      { 
       alert(response.error); 
      } 
      else 
      { 
       $("#i").attr("src", response.src);  
      } 
     } 
    });