接口获取图片文件流的缓存问题

后端接口接受的是文件流,前端怎么把一张图片地址转换成文件流 经常听到小伙伴们在说文件流怎么弄,说为什么后端非要文件流!!!那今天我们就来会一会这位_ 阅读详情

最近在做新闻管理的后台,发现图片请求的非常慢,加载过的图片依然重新加载。

这里我是用controller返回图片的,所以每次请求图片的时候会进入controller中然后返回图片,每次返回的responsebody size都会略大于图片大小。

但是在请求tomcat静态资源时,首次加载时和上面情况类似,但是下次刷新responsebody就只有几十b的大小。

一开始没有清空缓存,以为tomcat把图片压缩成几十b大小,感觉这也太不可思议了,但是还是选择尝试一下。在controller中用gzip对图片资源进行压缩


public final class GzipUtil {
    public static byte[] compress(byte[] data) {
        ByteArrayOutputStream byteOutput = new ByteArrayOutputStream(1024);
        GZIPOutputStream output = null;
        try {
            System.out.println("before:"+data.length);
            output = new GZIPOutputStream(byteOutput);
            output.write(data);
        } catch (IOException e) {
        } finally {
            try {
                output.close();
            } catch (IOException e) {
            }
        }
        return byteOutput.toByteArray();
    }
}
 @ResponseBody
    @RequestMapping("img/{id}.jpg")
    public ResponseEntity<byte[]> getImg(@PathVariable Long id,HttpServletRequest request) throws IOException {


       
        HttpHeaders headers = new HttpHeaders();
//      String encoding = request.getHeader( "accept-encoding" );
        headers.setContentType(MediaType.IMAGE_JPEG);
        byte[] data ;
       	if((encoding != null) && (encoding.indexOf( "gzip" ) != -1)){
//            "Content-Encoding", "gzip"
            headers.set("Content-Encoding","gzip");
            data = GzipUtil.compress(FileUtils.readFileToByteArray(new File(imgBasePath+id+".jpg")));
            System.out.println("data size "+data.length);
        }else{
            data =  FileUtils.readFileToByteArray(new File(imgBasePath+id+".jpg"));
        }
        
        headers.setContentLength(data.length);

        return new ResponseEntity<byte[]>(data, headers,
            HttpStatus.CREATED);



    }

 先判断浏览器是否支持 gzip,如果支持使用gzip压缩。

然后在浏览器测试,发现压缩后的responseboy只比压缩前少了几k,看来并不是这个原因


后来清空chrom浏览器缓存(command+shift+R )后发现每次请求和controller请求图片一样。所以可以判断为缓存问题

tomcat :

缓存前

requestheader:

    1. Accept:
      text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
    2. Accept-Encoding:
      gzip, deflate
    3. Accept-Language:
      zh-CN,zh;q=0.8,en;q=0.6
    4. Cache-Control:
      max-age=0
    5. Connection:
      keep-alive
    6. Cookie:
      Hm_lvt_fbd153e223cf03f359f3793430d98ad0=1502073972,1502160655,1502250279; Hm_lpvt_fbd153e223cf03f359f3793430d98ad0=1502262568; JSESSIONID=DBF618B52AB5792C63B8EF60896CEB23
    7. Host:
      smartsowo.com
    8. If-Modified-Since:
      Mon, 07 Aug 2017 03:04:22 GMT
    9. If-None-Match:
      W/"3864-1502075062000"
    10. Referer:
      http://smartsowo.com/
    11. Upgrade-Insecure-Requests:
      1
    12. User-Agent:
      Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Mobile Safari/537.36
Name

 
logo.png
favicon.ico

  1. Accept:
    text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
  2. Accept-Encoding:
    gzip, deflate
  3. Accept-Language:
    zh-CN,zh;q=0.8,en;q=0.6
  4. Cache-Control:
    no-cache
  5. Connection:
    keep-alive
  6. Cookie:
    Hm_lvt_fbd153e223cf03f359f3793430d98ad0=1502073972,1502160655,1502250279; Hm_lpvt_fbd153e223cf03f359f3793430d98ad0=1502262568; JSESSIONID=B178B1C8029776152BBF8EC3FFEF89F4
  7. Host:
    smartsowo.com
  8. Pragma:
    no-cache
  9. Referer:
    http://smartsowo.com/
  10. Upgrade-Insecure-Requests:
    1
  11. User-Agent:
    Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Mobile Safari/537.36

  1. 缓存后
  2. requestheader
    1. Accept:
      text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
    2. Accept-Encoding:
      gzip, deflate
    3. Accept-Language:
      zh-CN,zh;q=0.8,en;q=0.6
    4. Cache-Control:
      max-age=0
    5. Connection:
      keep-alive
    6. Cookie:
      Hm_lvt_fbd153e223cf03f359f3793430d98ad0=1502073972,1502160655,1502250279; Hm_lpvt_fbd153e223cf03f359f3793430d98ad0=1502262568; JSESSIONID=B178B1C8029776152BBF8EC3FFEF89F4
    7. Host:
      smartsowo.com
    8. If-Modified-Since:
      Mon, 14 Aug 2017 03:08:20 GMT
    9. If-None-Match:
      W/"3864-1502680100000"
    10. Referer:
      http://smartsowo.com/
    11. Upgrade-Insecure-Requests:
      1
    12. User-Agent:
      Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Mobile Safari/537.36
    13. 通过Cache-Control的值来判断缓存中是否有这个资源文件,如果有这个文件的缓存,则 通过
      If-Modified-Since和
      If-None-Match值来判断资源文件是否被修改,如果修改重新加载资源返回201 ,页面重新加载图片,如果没有修改则返回304 返回空的responsebody


      1.     @ResponseBody
            @RequestMapping("img/{id}.jpg")
            public ResponseEntity<byte[]> getImg(@PathVariable Long id,HttpServletRequest request) throws IOException {
        
        
                String cacheControl = request.getHeader("Cache-Control");
                if (cacheControl!=null&&!cacheControl.equals("no-cache")){
                    return new ResponseEntity<byte[]>( new HttpHeaders(),
                        HttpStatus.NOT_MODIFIED);
                }
        
        
               /* String eTag = request.getHeader("If-None-Match");
                System.out.println(eTag);
                if(eTag!=null&&eTag.equals("W/\""+id+"\"")){
                    return new ResponseEntity<byte[]>( new HttpHeaders(),
                        HttpStatus.NOT_MODIFIED);
                }*/
                HttpHeaders headers = new HttpHeaders();
        //        String encoding = request.getHeader( "accept-encoding" );
                headers.setContentType(MediaType.IMAGE_JPEG);
                byte[] data ;
               /* if((encoding != null) && (encoding.indexOf( "gzip" ) != -1)){
        //            "Content-Encoding", "gzip"
                    headers.set("Content-Encoding","gzip");
                    data = GzipUtil.compress(FileUtils.readFileToByteArray(new File(imgBasePath+id+".jpg")));
                    System.out.println("data size "+data.length);
                }else{
                    data =  FileUtils.readFileToByteArray(new File(imgBasePath+id+".jpg"));
                }*/
                data =  FileUtils.readFileToByteArray(new File(imgBasePath+id+".jpg"));
                headers.setContentLength(data.length);
        //        headers.setCacheControl("no-cache");
                headers.setETag("W/\""+id+"\"");
                headers.setLastModified(new Date().getTime());
        
        
        //        APPLICATION_OCTET_STREAM
        
                //图片直接下载,导致app无法正常显示
        //        headers.setContentDispositionFormData("attachment", id+".jpg");
                return new ResponseEntity<byte[]>(data, headers,
                    HttpStatus.CREATED);
        
        
        
            }






用户视角下的vfsglobal预约困境:从注册到登录的全流程避坑指南 本文详细解析了vfsglobal签证预约系统从注册到登录的全流程操作,帮助用户避开常见技术陷阱。针对IP限制、DNS解析、浏览器缓存等登录障碍提供实用解决方案,并揭示账号管理的隐藏规则与支付环节的延时处理技巧,助力用户高效完成签证预约。 阅读详情

相关推荐

华为防火墙NAT避坑指南:当双ISP出口遇到服务器发布,这些细节不注意会翻车

本文深入解析华为防火墙在双ISP出口环境下服务器发布的实战配置,重点探讨no-reverse参数对Server-Map表的影响、源进源出功能的实现及线路切换时的会话保持问题。通过策略路由和智能选路技术,确保HTTP/FTP服务在多运营商链路中的高可用性,避免路径不对称和NAT映射冲突等常见陷阱。

weixin_30897233的博客 550

【IO】FileInputStream

一 FileInputStream概述 FileInputStream为文件输入流,以字节流的形式读取文件内容,比如图片文件等等。 FileInputStream是InputStream的子类,我们可以把FileInputStream赋值给InputStream使用。 如果我们要以字符流形式读取文件内容,可以使用FileReader类处理。 二 FileInputStream实例分析

yhl_jxy的博客 1671

知识图谱本体建模之RDF、RDFS、OWL详解

(一)知识图谱本体建模之RDF、RDFS、OWL详解 1.语义网体系 知识图谱于2012年由Google提出,并不是新概念,而是由语义网络(Semantic Network)衍生而来。语义网络由相互连接的节点和边组成,节点表示概念或者对象,边表示他们之间的关系。RDF,RDFS与OWL都是基于语义网的知识表示框架,在节点和边的取值上做了约束,制定了统一标准,为多源数据的融合提供了便利。RDF,RDFS/OWL 属于语义网技术栈,它们的提出,使得语义网克服了语义网络的缺点。其语义网技术栈如下所示。 2.RD

周周的专栏 1万+

给网络接口的图片的缓存即路径

//////App里面的代码 public class App extends Application { @Override public void onCreate() { super.onCreate(); String path = Environment.getExternalStorageDirectory().getPath() ...

weixin_43508288的博客 314

WGS-84 ECEF ENU 坐标系学习记录

地球坐标系固定在地球上而随地球一起在空间做公转和自转运动,因此地球上任一固定点在地球坐标系的坐标就不会由于地球旋转而变化。地心地固直角坐标系和大地坐标系都属于这种坐标系。 一、 几种坐标系 地心地固直角坐标系(ECEF)坐标系 其原点为地球的质心,x轴延伸通过本初子午线(0度经度)和赤道(0deglatitude)的交点。 z轴延伸通过的北极(即,与地球旋转轴重合)。 y轴完成右手坐标系,穿...

YYshuangshuang的博客 1万+

Ubuntu下NVIDIA驱动安装全攻略:从报错到完美运行nvidia-smi的完整流程

本文提供了在Ubuntu系统中安装NVIDIA驱动的完整解决方案,重点解决因驱动版本冲突、内核模块未加载或Secure Boot安全启动导致的`nvidia-smi`报错问题。通过彻底清理旧驱动、处理Secure Boot、选择兼容版本并正确安装,最终确保驱动完美运行。

weixin_29196891的博客 364

GA/百度统计/Piwik:网站分析工具的Cookie设置和访次切分规则

目前主流的网站分析工具一般都是通过javascript检测的方式进行访问监控的,包括商业产品(Omniture)、免费产品(GA/百度统计/CNZZ)、开源产品(Piwik)。虽然说原理大致相同,但是不同的工具在一些基础的统计方法上方式还是有一些微妙的差别。譬如,你在使用多种网站分析工具对同一个网站进行监控时,经常会发现不同的工具给出的Visits总是会有差异(绝对数量有差异,但趋势一致)。即使理

路 1万+

《YOLOv8:从入门到实战》专栏介绍 & 专栏目录

本专栏涵盖了丰富的YOLOv8算法从入门到实战系列教程,专为学习YOLOv8的同学而设计,堪称全网最详细的教程!🌈🌈🌈

小哥谈 6489

网络请求图片及缓存处理

步骤: 1、设置 请求网址(path) 2、构造URL对象 3、设置属性(请求方式、请求超时、读取超时) 4、发送请求 5、判读请求是否成功(进行文件读取、显示) 部分代码如下 package com.example.leixiansheng.internet; import android.graphics.Bitmap; import android.graphics.Bitm

Mr_Leixiansheng的博客 1266

3dmax文件格式转换——.max 转换为 .flt(解决转换后.flt没有纹理贴图的问题)

本文主要介绍如何在3dmax中将.max格式文件转换为.flt格式文件,并解决转换后的文件没有纹理贴图的问题。 在3dmax中,将.max文件转换为.flt格式,只需导出选择.flt格式即可,但是导出的文件在osgEarth中加载后,缺少纹理和贴图。 下面是解决方案: 1、选中加载的模型,然后点击 渲染-> 渲染到纹理 2、将 渲染到纹理 子窗口往下拉,点击 添加 按钮,添加 ...

cchangcs 6170

《网络存储技术》形考实训4:为小微企业搭建基于Windows Server的文件共享与权限管理服务

本文介绍了在域环境下部署DFS分布式文件系统的完整流程。项目目标是将3台存储服务器(NS1、NS2、NS3)上的多个共享文件夹通过DFS命名空间进行统一整合,使员工可通过单一访问路径访问所有资源。实施步骤包括:1)搭建AD域环境并创建用户/组;2)将存储服务器加入域并配置共享权限;3)在域控制器安装DFS命名空间角色;4)创建基于域的命名空间(\xc.cn\共享);5)将各服务器共享文件夹映射到命名空间;6)进行客户端访问验证。通过DFS实现了物理存储位置不变情况下的逻辑统一访问,提高了文件管理的便捷性和可

深耕计算机专业知识与技术。 946

html图片缓存,网页如何缓存图片_html/css_WEB-ITnose

网页的图片是 调用服务器action,以数据流的形式写到页面的。 每次进入页面都会重新下载图片有没有办法可以缓存图片,在缓存中直接取出回复讨论(解决方案)http://www.cnblogs.com/yuyii/archive/2008/10/16/1312238.html设置Cache-Control我加上还是会 去加载图片图片是个action请求二进流还能缓存吗?没听说过。页面级缓存都是针...

weixin_36057741的博客 1307

使用xlwings在Python中对Excel表格进行操作是非常方便的,可以实现自动化处理、批量数据处理等功能

使用xlwings在Python中对Excel表格进行操作是非常方便的,可以实现自动化处理、批量数据处理等功能。本篇文章主要介绍如何使用xlwings对Excel表格进行多行多列数据设置和操作,并给出相应的源代码。接着,我们可以对这个范围内的所有单元格进行操作,如设置字体颜色、填充颜色、对齐方式等。以上就是使用xlwings对Excel表格进行多行多列数据操作和设置字体颜色、填充色和对齐方式的全部内容。最后,我们可以将数据写入到单元格中,也可以从单元格中读取数据。在Excel中,可以通过。

BUG?不存在的! 713

后端接口接受的是文件流,前端怎么把一张图片地址转换成文件流?

经常听到小伙伴们在说文件流怎么弄,说为什么后端非要文件流!!!那今天我们就来会一会这位。

世轩的博客 1684

IMSL CNL 7.0.0 (x86-64)Crack

IMSL CNL 7.0.0 (x86-64)Crack intel的算法库破解文件,这是C++版本的破解文件

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

通用文件流 OCR 到文本 API 接口

通用文件流 OCR 到文本 API 接口通用文件流识别接口,基于机器学习,精准识别率。

DevOpenClub 专栏 612

假人有限元模型

假人模型,车辆碰撞假人有限元模型,适合做乘员安全的研究者利用

HTTP通过base64图片上传遇到的问题

​在做开放接口的时候,遇到个问题就是如何通过HTTP上传一个图片,考虑到接口的传输只支持json(API程序的限制),所以优先考虑前端先将图片转成base64字符串,再上传字符串给后端。 ​后端在做上传文件到服务器时,需要用到文件流(inputstream),所以这也可以考虑两种方式,一种是直接上传,另外一种是先将base64转成图片保存到临时路径下,再通过保存的图片拿到文件流。下面具体看下两种获...

Machine的博客 1611

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

调用第三方接口返回文件流并存储文件到本地

调用第三方接口都很常见 但一般都是json格式的反参 一些功能需要我们获取文件流,存储到本地 URL url = new URL(URL); urlConnection = (HttpURLConnection) url.openConnection(); urlConnection.setRequestMethod("POST"); urlConnection.setConnectTimeout(1000);

qq_43021813的博客 5828

【二进制流转换成图片文件,不同网络请求配置问题(Content-Type,responseType)】

fetch 是现代浏览器原生支持的 API======async与await使用======使用 x-www-form-urlencoded 格式======age: 30headers: {},});===========请求使用 FormData 格式===========});fetch 请求返回的是一个 Response 对象。responseType用于指定服务器响应的数据类型。常见的数据类型有:“”、“blob”、“document”、“json”、"

weixin_45179978的博客 952

pdf.js预览pdf文件流(base64)

pdf.js预览pdf文件流(base64)

西洲 1万+

HttpsURLConnection上传文件流

项目需要对接外部接口,将图片文件流发送到外部接口,下面代码就是HttpsURLConnection如何上传文件流:/** * HttpsURLConnection上传文件流 * * @param args * @throws Exception */ public static void main(String[] args) throws

不忘初心的博客 5136

restful批量上传文件_Java文件上传:Restful接口接收上传文件,缓存在本地

接口代码import lombok.extern.slf4j.Slf4j;import org.springframework.web.bind.annotation.PostMapping;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annota...

weixin_39970855的博客 1381

DzzOffice开发手册常用接口篇

如:index.php?1.若系统版本数已达到上限,即系统版本数量设置数(包含不开启版本和版本数量达到或超出版本数限制),该操作将移除当前操作文件最老版本,并保存当前内容为最新版本(如未开启版本,等同覆盖当前文件);2.若版本数未达到系统版本数设置上限,包含版本开启并且版本数设置为0(即不限制版本数量),或当前文件版本小于最大版本数,该操作将保存当前内容为操作文件最新版本。c.如果复制文件为目录,且目标位置有同名目录,且源文件位置不与目标位置相同,则将源文件目录中文件放入目标位置同名目录中,否则新建。

小胡的博客 1408

提供图片下载接口

1.浏览器请求地址: localhost:8080/download/img?path=home/ccsp/img/abc.jpg 2.后台控制层 /** * 提供下载图片的接口 * @author: ljg * @Datetime: 2019年8月7日下午6:13:53 * @ClassName:DownloadfilesController */ @Controller @Re...

解州-关阳的博客 863

Appcan 图片实现缓存

理论参阅如下: 5、离线存储之zy_icache.js 网页中不光包含JSON数据,图片、音乐等也是必不可少的元素。一般网页编程下,我们先用getJSON接口获取数据,并转换返回的数据为JSON格式,通过JS代码我们把JSON格式数据转化为网页HTML代码添加到页面里进行显示。而图片常用为标签或者元素的background-image属性。在这种处理机制下,图片是由浏览器负责下载并进行

Black Monkey 3212

uniapp-h5文件流与url下载实战:解决PDF空白与跨域问题

本文深入解析了在uniapp H5环境中实现文件下载的实战方案,重点解决了PDF文件下载后打开空白的常见问题。通过对比文件流下载与URL下载两种核心方式,详细阐述了Blob对象与Object URL的原理,并提供了关键代码示例。文章还系统分析了跨域问题的成因与前后端协作解决方案,为开发者提供了从原理到实践的完整指南。

u6v7w8x的博客 1045

详细讲解Android的图片下载框架UniversialImageLoader之磁盘缓存(一)

沉浸在Android的开发世界中有一些年头的猴子们,估计都能够深深的体会到Android中的图片下载、展示、缓存一直是心中抹不去的痛。鄙人亦是如此。Ok,闲话不说,为了督促自己的学习,下面就逐一的挖掘Android中还算是比较牛叉的图片处理框架UniversialImageLoader以飨读者吧!    凡事如果过于草率必将陷入泥塘不能自拔。还是按部就班的一步一步的将这个框架给啃透。    第

zhangjiaofa的专栏 1470
上一篇: solr6.6.0实时更新mysql数据
下一篇: centos安装maven环境
programmeryu
博客等级 码龄11年 23粉丝 67原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值