上传到amazon s3的图片在浏览器不显示,而是下载

2024-06-18 11:08

本文主要是介绍上传到amazon s3的图片在浏览器不显示,而是下载,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

通过boto3把图片上传到s3上以后,图片不在浏览器显示,而是下载

问题解决很简单,重要的是解决思路

遇到问题一定要理智分析问题原因,找到根本原因,问题自然就解决了

1、先用curl 看一下这个图片的头是啥
说来惭愧,竟然不知道怎么拿到这个图片链接的header
在浏览器上输入链接,F12,勾选上Preserve log,然后访问此链接
在这里插入图片描述

这时在控制台就能看到请求了,然后把curl拿下了
在终端执行curl 命令

 curl 'http://xxxxxxxxxx.log' -H 'Connection: keep-alive' -H 'Pragma: no-cache' -H 'Cache-Control: no-cache' -H 'Upgrade-Insecure-Requests: 1' -H 'User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.131 Safari/537.36' -H 'Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3' -H 'Accept-Encoding: gzip, deflate' -H 'Accept-Language: zh-CN,zh;q=0.9,en;q=0.8' -H 'Cookie: csrftoken=9HTnAyzu7nDOukolc8u1ufoD9GJdV7e1DAI6KkFUmETYe3IMAjFfj996YdryBy0T' --compressed **-k -v >/dev/null**

添加 -k -v 参数
>/dev/null是把下载结果丢掉

可以看到返回结果

< HTTP/1.1 200 OK
< Server: nginx/1.12.2
< Date: Sat, 20 Jul 2019 02:03:18 GMT
< Content-Type: application/octet-stream
< Content-Length: 14617
< Connection: keep-alive
< Last-Modified: Fri, 19 Jul 2019 15:37:36 GMT
< ETag: “5d31e3c0-3919”
< Accept-Ranges: bytes
<
{ [data not shown]

重点就是Content-Type,Content-Type是octet-stream,浏览器就会执行下载

2、解决问题
上传图片的时候指定Content-Type为 text/plain image/jpeg image/png浏览器都会显示而不下载,
因为图片有不同的样式,为了方便就都把Content-Type统一为image/jpeg,浏览器是不会只根据Content-Type的值去处理的,只是作为参考,浏览器会识别出正确格式而正确显示。
只不过我们设置成image/jpeg更贴边。

3、处理老图片
安装aws客户端
参考 https://docs.aws.amazon.com/zh_cn/cli/latest/userguide/cli-chap-install.html#post-install-configure

pip install awscli --upgrade --user

配置基本信息

$aws configure

$ aws configure
AWS Access Key ID [None]: AKIAIOSFODNN7EXAMPLE AWS
Secret Access Key [None]: wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY
Default region name [None]: us-west-2
Default output format [None]:json

执行命令把bucket下的所有内容变成image/jpeg格式

aws s3 cp s3://bucket_name/ s3://bucket_name/ --recursive  --include '*' --metadata-directive REPLACE --content-type='image/jpeg'

把以.jpg结尾的内容变成image/jpeg格式

aws s3 cp s3://bucket_name/ s3://bucket_name/ --recursive --exclude '*' --include '*.jpg' --metadata-directive REPLACE --content-type='image/jpeg'

这篇关于上传到amazon s3的图片在浏览器不显示,而是下载的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1071918

相关文章

Java下载文件中文文件名乱码的解决方案(文件名包含很多%)

《Java下载文件中文文件名乱码的解决方案(文件名包含很多%)》Java下载文件时,文件名中文乱码问题通常是由于编码不正确导致的,使用`URLEncoder.encode(filepath,UTF-8... 目录Java下载文件中文文件名乱码问题一般情况下,大家都是这样为了解决这个问题最终解决总结Java下

Python利用PIL进行图片压缩

《Python利用PIL进行图片压缩》有时在发送一些文件如PPT、Word时,由于文件中的图片太大,导致文件也太大,无法发送,所以本文为大家介绍了Python中图片压缩的方法,需要的可以参考下... 有时在发送一些文件如PPT、Word时,由于文件中的图片太大,导致文件也太大,无法发送,所有可以对文件中的图

JavaWeb-WebSocket浏览器服务器双向通信方式

《JavaWeb-WebSocket浏览器服务器双向通信方式》文章介绍了WebSocket协议的工作原理和应用场景,包括与HTTP的对比,接着,详细介绍了如何在Java中使用WebSocket,包括配... 目录一、概述二、入门2.1 POM依赖2.2 编写配置类2.3 编写WebSocket服务2.4 浏

java获取图片的大小、宽度、高度方式

《java获取图片的大小、宽度、高度方式》文章介绍了如何将File对象转换为MultipartFile对象的过程,并分享了个人经验,希望能为读者提供参考... 目China编程录Java获取图片的大小、宽度、高度File对象(该对象里面是图片)MultipartFile对象(该对象里面是图片)总结java获取图片

Java实战之自助进行多张图片合成拼接

《Java实战之自助进行多张图片合成拼接》在当今数字化时代,图像处理技术在各个领域都发挥着至关重要的作用,本文为大家详细介绍了如何使用Java实现多张图片合成拼接,需要的可以了解下... 目录前言一、图片合成需求描述二、图片合成设计与实现1、编程语言2、基础数据准备3、图片合成流程4、图片合成实现三、总结前

使用Python实现图片和base64转换工具

《使用Python实现图片和base64转换工具》这篇文章主要为大家详细介绍了如何使用Python中的base64模块编写一个工具,可以实现图片和Base64编码之间的转换,感兴趣的小伙伴可以了解下... 简介使用python的base64模块来实现图片和Base64编码之间的转换。可以将图片转换为Bas

CSS自定义浏览器滚动条样式完整代码

《CSS自定义浏览器滚动条样式完整代码》:本文主要介绍了如何使用CSS自定义浏览器滚动条的样式,包括隐藏滚动条的角落、设置滚动条的基本样式、轨道样式和滑块样式,并提供了完整的CSS代码示例,通过这些技巧,你可以为你的网站添加个性化的滚动条样式,从而提升用户体验,详细内容请阅读本文,希望能对你有所帮助...

css实现图片旋转功能

《css实现图片旋转功能》:本文主要介绍了四种CSS变换效果:图片旋转90度、水平翻转、垂直翻转,并附带了相应的代码示例,详细内容请阅读本文,希望能对你有所帮助... 一 css实现图片旋转90度.icon{ -moz-transform:rotate(-90deg); -webkit-transfo

Python实现文件下载、Cookie以及重定向的方法代码

《Python实现文件下载、Cookie以及重定向的方法代码》本文主要介绍了如何使用Python的requests模块进行网络请求操作,涵盖了从文件下载、Cookie处理到重定向与历史请求等多个方面,... 目录前言一、下载网络文件(一)基本步骤(二)分段下载大文件(三)常见问题二、requests模块处理

C#实现添加/替换/提取或删除Excel中的图片

《C#实现添加/替换/提取或删除Excel中的图片》在Excel中插入与数据相关的图片,能将关键数据或信息以更直观的方式呈现出来,使文档更加美观,下面我们来看看如何在C#中实现添加/替换/提取或删除E... 在Excandroidel中插入与数据相关的图片,能将关键数据或信息以更直观的方式呈现出来,使文档更