Question

我正在尝试在不同的网站上显示我的rails应用程序的公共目录中托管的图像。我基本上不希望用户能够将图像标记的src键入浏览器并访问我的应用程序的uri，以便找到图像。

在做了一些挖掘后，我确定实现这一目标的方法可能是将图像作为base64编码数据发送，然后从接收ajax响应的网站上的数据重建图像。如果我弄错了，请告诉我。

我已经成功地将我的rails应用程序中的base64数据通过ajax发送到我的网站，但是我在从数据构建图像时遇到了困难。

这是我的导轨代码：

def send_image(blank=nil)
  require 'base64'
  @image= "#{Rails.root}/public/test.jpg"
  @imageEncoded = Base64.encode64(@image)

send_data @imageEncoded, :type => 'text/plain', disposition: "inline", :x_sendfile=> true

end

这是ajax回应：

    L2FwcC9wdWJsaWMvcHVwcHkuanBn

这是从ajax响应构建映像的代码：

    $("#picture").attr("src","data:image/jpg;base64," + data);

我想我可能会误解这一切是如何运作的。当我取回结束的数据并将其插入src时，不会显示图像。它只显示一个损坏的图像图标。

如果我自己只发送图像文件（不对数据进行编码），当我查看开发人员工具的“网络”选项卡时，图片会显示在ajax响应中，但我无法使用该数据构建图像。数据响应如下所示：

    ���� :ExifMM*  � s � � � ( 1 � 2 ҇i � -��' -��' Adobe Photoshop CS5 Macintosh2015:05:20 15:25:20 � 0221� ��� �� � n v ( ~ �H H ����Adobe_CM �� Adobed� ���        �� x� " �� �� ? 3 ! 1 AQa "q�2 ���B#$ R�b34r��C %�S���cs5 ���&D�TdE£t6 �U�e���u��F'���������������Vfv��������7GWgw�������� 5 !1 AQaq" 2�� ��B#�R��3$b�r��CS cs4�% ��� &5��D�T� dEU6te����u��F���������������Vfv��������'7GWgw������� ?�T�I%)$�IJI$�R�I$���I%)$�IJI$�R�I$���I%)$�IO���T�I%)$�IJI #&� .�ǆ�J��ɶ��0?ю Ys� o.̘�J~ �z�Ugk �Ø� iU~u�: ��* >� � hL�^� HЎ$*Y9��;��ѵ ��_7I���� �� [� � � � � HI ��K�D�� c ӈ�uQ� � a��;C���;\�} s V%e��)��lm���K r_�-�\��i�IT�/�sa�A�Q�z��1*�r�@ wk�H ��!�� ~��� �O�DN ���7 I$�B�I$�����T�I%) /)��op�th�(� ���2KX k=�?�Qg�����@Ɇ s��԰ �� k��* u�%���\�W��Oc��� ϱ�Ǭ�y��=�� i?�z1�� A�+�<��Vvo� Q��Z� / �c� �����Of�+�5�hy2����; � ���:Ů=c���W]m kˁ��m{v��Ќx�t�e d[���7# ��6ڈp�S � � �Nr�!� N��X8�{�w=�p ��#��+��u�>Ө�S���� ��n����i� � �� B�C�5�'� y ��t�t��� kH �.�^�'� ���/ � ������X���-��-�i>+3�P�.nѸ q� � ��T*$�uu��{���;Lhc�7} ��ަ����X���㸏 �n�_K�ߣi�q �

有人能告诉我这里可能出错的地方吗？我是否必须发送图像，然后 base64对其进行编码并将其添加到图像标记的src中？我无法理解编码的工作原理吗？

对评论的回应

所以我必须写的代码看起来像这样吗？

var request = new XMLHttpRequest();
request.responseType = "blob";
request.open("GET", railsAppEndpoint);

*这是我不明白如何根据你的评论继续进行的地方。我以前从未使用过fetch。我查了一些关于fetch的文档，看起来你应该传递给fetch的第一个参数是一个url。你是说我必须打开XMLHttpRequest，然后还使用fetch？或者是fetch应该替换XMLHttpRequest。

我只是在猜测正确的语法：

fetch()
 .then(
     response => response.blob()
  )

*这里似乎缺少一些东西。

**此时我不知道如何获取Blob网址。我知道如何设置图像的src，但我需要先完成其他步骤。

如何从Rails应用程序和显示图像发送Base64编码图像

0 个答案: