Question

我有ReportPdf继承自Prawn::Document 当我从Rails控制台测试时，pdf中嵌入的png图像正确呈现。

ReportPdf.new(param1,param2).render_file('/Users/ZZ/Desktop/test.pdf')

~~但是，当从控制器请求时：~~

def generate_pdf
  pdf = ReportPdf.new(param1, param2)
  send_data pdf.render, filename: 'report.pdf', type: 'application/pdf'
end

~~图像未呈现，其他内容呈现没有任何问题。~~

~~我尝试过使用Amazon S3的本地图片和图片。两者在控制台中都可以正常工作，但不能从控制器中工作。~~

控制器中的generate_pdf方法也提供了正确的pdf。如果我直接请求PDF，则会正确呈现PDF。我用邮差测试了它。

但是，仅当从Angular中的导出按钮请求时，才会呈现PDF中的图像。以下是实现：

后端：

class ReportPdf < Prawn::Document
  def initialize(param1, param2)
    super()
    @param1 = param1
    @date = Time.zone.parse(param2) || Time.zone.now
    header
  end

  def header
    img = open('https://s3-ap-southeast2.amazonaws.com/bucket/folder/logo.png')
    # use local image
    # img = "#{Rails.root}/app/assets/images/logo.png"
    data = [[{ image: img, image_width: 150, vposition: :center },
           "#{@param1.name} - #{@param2.suburb}"]]
    table(data, cell_style: { borders: {}, 
                            valign: :center, align: :right, size: 25, width:
                          270 })
  end
end

前端：

  $scope.exportToPdf = function() {
    var tmpDate = moment(new Date($scope.date)).format('DD-MM-YYYY');
    $http({
      method: 'GET',
      url: '/resourceA/' + $stateParams.resourceAId + '/resourceB/daily_pdf?day=' + tmpDate
    }).
    success(function(data, status, headers, config) {
      var anchor = angular.element('<a/>');
      anchor.attr({
        href: 'data:application/pdf;charset=utf-8,' + encodeURI(data),
        target: '_blank',
        download: 'daily_report.pdf'
      })[0].click();
    }).
    error(function(data, status, headers, config) {
      // something here.
    });
  };

我猜问题是编码，图像二进制数据在编码过程中被破坏了。错误在哪里？

Answer 1

当我们看不到试图将图像添加到PDF的代码时，很难分辨出错误在哪里。 ReportPdf如何访问图像？

也许这里有适合你情况的提示。在我的代码中，当为图库生成pdf时，图库会创建pdf，并且每张照片都会通过以下调用将自己添加到pdf：

photo = Photo.find(photo_id)
photo.add_to_pdf(pdf, h_pos, v_pos, h_size, v_size)

照片类方法使用（删除布局计算）：

def add_to_pdf(pdf, h_pos, v_pos, h_size, v_size)
  pdf.image self.image.path(:full),
            :position => pos_sym,
            :vposition => vpos_sym,
            :fit => [size,vsize]
end

用于生成pdf的虾，用于图像附件的回形针（照片has_attached_file：image）

图像未使用AngularJs

1 个答案: