img引用网络图片资源无法加载问题解决
近期在自己项目中遇到引用一些网络图片资源,显示无法加载,但是在浏览器打开图片路径又可以显示的问题
解决办法:
在图片显示的界面把meta referrer标签改为never
<meta name="referrer" content="never">
或者在img标签上加上:
referrerpolicy="no-referrer"
即可显示
下面我们大致了解一下meta referrer标签
通过Referrer Policy 介绍,了解到,这是一种引用策略,可以用来防止图片或视频被盗。
策略名称 | 属性值(新) | 属性值(旧) |
---|---|---|
No Referrer | no-referrer | never |
No Referrer When Downgrade | no-referrer-when-downgrade | default |
Origin Only | origin | - |
Origin When Cross-origin | origin-when-crossorigin | - |
Unsafe URL | unsafe-url | always |
- No Referrer:任何情况下都不发送 Referrer 信息;
- No Referrer When Downgrade:仅当发生协议降级(如 HTTPS 页面引入 HTTP 资源,从 HTTPS 页面跳到 HTTP 等)时不发送 Referrer 信息。这个规则是现在大部分浏览器默认所采用的;
- Origin Only:发送只包含 host 部分的 Referrer。启用这个规则,无论是否发生协议降级,无论是本站链接还是站外链接,都会发送 Referrer 信息,但是只包含协议 + host 部分(不包含具体的路径及参数等信息);
- Origin When Cross-origin:仅在发生跨域访问时发送只包含 host 的 Referrer,同域下还是完整的。它与
Origin Only
的区别是多判断了是否Cross-origin
。需要注意的是协议、域名和端口都一致,才会被浏览器认为是同域; - Unsafe URL:无论是否发生协议降级,无论是本站链接还是站外链接,统统都发送 Referrer 信息。正如其名,这是最宽松而最不安全的策略;
关于如何运用,在Referrer策略与防盗链中也找到了用法,
这里只举例说一下img的:
通过<a>、<area>、<img>、<iframe>、<link>元素的referrerpolicy属性来规定策略。
结束
img引用网络图片资源无法加载问题解决的更多相关文章
- Android应用程序开发之图片操作(二)——工程图片资源的加载及OOM的处理
(一)工程图片资源的加载方法 在Android应用程序开发之图片操作(一)中,详细说明了如何操作各种资源图片,只是有的没有附上示例代码,在此,我将针对项目工程中的图片资源的显示加载进行说明.官方说明, ...
- Android学习笔记之BitmapFactory.Options实现图片资源的加载...
PS:小项目总算是做完了...历经20多天...素材,设计,以及实现全由自己完成...心力憔悴啊...该写写博客记录一下学习到的东西了... 学习内容: 1.使用BitmapFactory.Optio ...
- AngularJS进阶(三十八)上拉加载问题解决方法
AngularJS上拉加载问题解决方法 项目中始终存在一个问题:当在搜索栏输入关键词后(见图1),按照既定的业务逻辑应该是服务端接收到请求后,首先返回查询的前7条数据,待客户端出现上拉加载时,继续查找 ...
- Django 04 模板标签(if、for、url、with、autoeacape、模板继承于引用、静态文件加载)
Django 04 模板标签(if.for.url.with.autoeacape.模板继承于引用.静态文件加载) 一.if.for.url.with.autoescape urlpatterns = ...
- Web图片资源的加载与渲染时机
此文研究页面中的图片资源的加载和渲染时机,使得我们能更好的管理图片资源,避免不必要的流量和提高用户体验. 浏览器的工作流程 要研究图片资源的加载和渲染,我们先要了解浏览器的工作原理.以Webkit引擎 ...
- Django 1.11 bootstrap样式文件无法加载问题解决
先吐槽一波,多看官方教程,多找对应版本解决方法,多思考!... 在调试模式下面,打开页面无法加载bootstrap.min.css样式,解决思路如下: 查看settings文件INSTALL_APP配 ...
- [IOS]UIWebView 请求网络页面或者加载本地资源页面
UIWebView是一个能够显示网页的IOS视图控件,我们可以用它来访问一个网站.下面是具体的实例: 操作步骤: 1.首先在xib文件中拖放一个UIWebView控件到view中 2.将下载的页面以及 ...
- vue 组件按需引用,vue-router懒加载,vue打包优化,加载动画
当打包构建应用时,Javascript 包会变得非常大,影响页面加载.如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了. 结合 Vue 的 异步 ...
- 网站部署中遇到的问题-网页中js,css和图片资源无法加载
问题描述: 打开的网页跑版,图片无法加载,用控制台调试发现css和js都没有加载. 原因: 没有启用IIS"静态内容". 解决方法: 设置"打开或关闭windows功能& ...
随机推荐
- Window01
1 <script src="~/jquery-easyui-1.5.5.2/jquery.min.js"></script> <link href= ...
- 树莓派配置freeopcua
一.下载freeopcua的源码 git clone https://github.com/FreeOpcUa/freeopcua.git 切换回2016-10-8的版本 git reset 8c16 ...
- Service系统服务(三):查看进程信息、进程调度及终止、系统日志分析、使用systemctl工具
一.查看进程信息 目标: 本例要求掌握查看进程信息的操作,使用必要的命令工具完成下列任务: 找出进程 gdm 的 PID 编号值 列出由进程 gdm 开始的子进程树结构信息 找出进程 sshd 的父进 ...
- getstu
#coding: utf- #title..href... import urllib.request import time url=[ page= j= : url[j]='http://www. ...
- 无法在要求对象展开的函数中使用 __try
解决方案: 单独把try里面的代码封装成一个函数,然后再在try里面调用
- PHP错误检测
开发的时候,我们有时候需要打开错误信息.这时候,可以在php文件里设置:ini_set('display_errors','on');error_reporting(E_ALL); 不过有时候我们及时 ...
- 【IO流】java中文件路径(相对路径、绝对路径)相关类及方法
原文链接:https://blog.csdn.net/Activity_Time/article/details/98034409 1. URL 菜鸟教程:Java URL处理 通常推荐对http等协 ...
- 运维01 VMware与Centos系统安装
VMware与Centos系统安装 今日任务 1.Linux发行版的选择 2.vmware创建一个虚拟机(centos) 3.安装配置centos7 4.xshell配置连接虚拟机(centos) ...
- Django框架(十五)—— forms组件、局部钩子、全局钩子
目录 forms组件.局部钩子.全局钩子 一.什么是forms组件 二.forms组件的使用 1.使用语法 2.组件的参数 3.注意点 三.渲染模板 四.渲染错误信息 五.局部钩子 1.什么是局部钩子 ...
- vue中按需引入mint-UI报Error: .plugins[3][1] must be an object, false, or undefined
{ "presets": ["@babel/preset-env", "@babel/preset-react"], "plugi ...