如何在浏览器中呈现动态图像

时间:2015-03-10 17:24:23

标签: javascript image dynamic

我正在尝试在浏览器中呈现动态创建的图像。图像在运行时期间被多次更新,因此我正在尝试刷新它。但是,只要启动的浏览器中的刷新调用使用缓存的源,而不发送查询服务器。我正在使用rails 4.2和ruby 2.2。

这是我的刷新电话

$().ready(function(){ 
$("#ajax_sub").onclick=function(){
           var par=$("#ajax_par").value
               $.ajax({
                type: "get",
                url: 'pages/plot',
                data: {'symbol' : par}
            }).success(function(){
                if($("#img_plot")){
                    remove_plot()
                }
                refresh_plot()
          })
        }
    })
refresh_plot=function(){
    console.log("loading image")
    img_obj=document.createElement("img")
    img_obj.id="img_plot"
    img_obj.src="/pages/stream"
    $("#plot").appendChild(img_obj)
}

这是控制台输出

  
    

在2015-03-10开始获取127.0.0.1的GET“/ pages / plot?symbol = cos”     11:35:44 -0400由PagesController处理#plot as / 参数:     {“symbol”=>“cos”}在31毫秒内完成200 OK(浏览次数:0.2ms |     ActiveRecord:0.0ms)

         

在2015-03-10 11:35:44 -0400开始获取127.0.0.1的GET“/ pages / stream”     由PagesController处理#stream作为HTML发送文件public / plot.png(0.3ms)在1ms内完成200 OK(ActiveRecord:0.0ms)     [2015-03-10 11:35:44] WARN无法确定内容长度     反应机构。设置响应或集的内容长度     响应#chunked = true

         

在2015-03-10开始获取127.0.0.1的GET“/ pages / plot?symbol = sin”     11:35:51 -0400 PagesController处理#plot为 / 参数:     {“symbol”=>“sin”}在27ms完成200 OK(浏览次数:0.2ms |     ActiveRecord:0.0ms)

  

Ajax调用更新控制器中的图像(页面#plot)并调用“/ pages / stream”启动来自页面#stream的send_file请求。  在第一次单击时,将启动两个Get调用,之后只启动一个。

如何修改此行为,以便图像刷新?

1 个答案:

答案 0 :(得分:0)

使用您的浏览器开发者控制台查看正在进行的操作。我假设没有为图像发出请求,因为它的源已经被缓存。您可以通过将所有缓存标头设置为无缓存或附加像?somerandomstring这样的图像网址的独特内容来避免这种情况,这样您的浏览器每次都会使缓存失效。