加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 大数据 > 正文

如何从服务器端perl程序获取图像数据并使用javascript显示在div

发布时间:2020-12-16 06:13:21 所属栏目:大数据 来源:网络整理
导读:我做了很多搜索,要么答案不起作用,要么这不是一个好的解决方案.将引用放入html的解决方案如: img src="html://localhost/cgi-bin/fd.cgi"/ 有两个问题,一个是图像会改变,它会被缓存.我知道我可以在调用中放置一个随机参数并解决问题,但另一个问题是程序运行
我做了很多搜索,要么答案不起作用,要么这不是一个好的解决方案.将引用放入html的解决方案如:

<img src="html://localhost/cgi-bin/fd.cgi"/>

有两个问题,一个是图像会改变,它会被缓存.我知道我可以在调用中放置一个随机参数并解决问题,但另一个问题是程序运行了几秒钟.我使用javascript,setInterval来循环. perl程序读取一个图像文件并对其进行注释.这需要一段时间,3或4秒,显示屏在此期间显示空白,因此我有两个div,一个是隐藏而另一个是显示.逻辑是我将加载隐藏的图像,当加载完成时,我将隐藏第一个并显示第二个,下一个通道,反之亦然.似乎没有任何事件我可以陷入“装载完成”.没有我在调试器中看到的无论如何.

ajax调用会引入数据,但我无法弄清楚如何显示它.我将base64编码在perl脚本中.这是javascript.

$.ajax({ type: 'GET',url: 'http://localhost/cgi-bin/fdmap/image.pl',success: function(data) 
{ 
    $('#img1').html('<img src="data:image/jpg;base64,'+data+'"');

},error: function(data)
{
    console.log("Error ");
    return true;
},

});

HTML:
????

<div id="img1"></div>
<div class="hidden" id="img2"></div>

这是perl片段

binmode STDOUT; 
print $cgi->header("image/jpg;base64");
open INP,"pcb.jpg";
my $it;
while(<INP>) {
    my $in = $_;
    $it.=$in;
}
my $encoded = encode_base64($it);
print $encoded;

我只是使用一个小的jpg文件进行测试.一旦我弄清楚如何显示图像数据,我将动态生成图像.

当我从控制台运行perl脚本时,我得到以下(截断的)输出.

Content-Type: image/jpg;base64^M
^M
/9j/4AAQSkZJRgABAQEASABIAAD/2wBDAAUDBAQEAwUEBAQFBQUGBwwIBwcHBw8LCwkMEQ8SEhEP
ERETFhwXExQaFRERGCEYGh0dHx8fExciJCIeJBweHx7/2wBDAQUFBQcGBw4ICA4eFBEUHh4eHh4e
Hh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh7/wAARCAF9AZwDASIA

如果我查看通过javascript调试器收到的数据,我看到:

HTTP/1.1 200 OK
Date: Sun,05 May 2013 15:28:43 GMT
Server: Apache/2.2.14 (Ubuntu)
Keep-Alive: timeout=15,max=99
Connection: Keep-Alive
Transfer-Encoding: chunked
Content-Type: image/jpg;base64

并且响应中的数据与控制台上转储的数据相同.

但是没有显示任何内容,也没有任何错误消息可供查看.只是一个空白的屏幕.我一直在研究这个问题好几个小时.感谢你给与我的帮助.
哦,如果它在IE中工作,我可以更少关心.

解决方法

只有快速扫描,所以我不确定,但是 – 你确定比

$('#img1').html('<img src="data:image/jpg;base64,'+data+'"');
                                                          ^ 
                             //not missing the tag-end?---+

因为你得到了

<img src="data:image/jpg;base64,/9j/4AAQSkZJRgABAQEASAB....."

和需要(恕我直言)

<img src="data:image/jpg;base64,/9j/4AAQSkZJRgABAQEASAB....." />

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读