react设置img标签url网络地址不显示

简介: react设置img标签url网络地址不显示

问题


学习React Web页面开发的过程中,遇到了一个问题设置img标签的图片地址,没有任何显示,但是换另外一个图片地址就可以展示,但是通过浏览器直接访问图片地址是没有问题的,有点纳闷,就查阅了一下资料。

通过学习了解调,src设置网络图片无法展示,是因为浏览器在访问图片地址时会自动在请求上添加了refre字段,而有些网站服务器针对refre做了防盗链设计就返回了403,自然就无法展示。

解决方案


解决方案也很简单, 在react项目的public路径下,找到index.html文件,在head标签中添加如下代码即可

<meta name="referrer" content="no-referrer">

微信图片_20220610121510.png

目录
相关文章
|
Java
Java开发实现图片URL地址检验,如何编码?
【10月更文挑战第14天】Java开发实现图片URL地址检验,如何编码?
559 4
|
8月前
|
C++
基于Reactor模型的高性能网络库之地址篇
这段代码定义了一个 InetAddress 类,是 C++ 网络编程中用于封装 IPv4 地址和端口的常见做法。该类的主要作用是方便地表示和操作一个网络地址(IP + 端口)
359 58
|
8月前
基于Reactor模式的高性能网络库github地址
https://github.com/zyi30/reactor-net.git
201 0
|
Java 程序员
JAVA程序员的进阶之路:掌握URL与URLConnection,轻松玩转网络资源!
在Java编程中,网络资源的获取与处理至关重要。本文介绍了如何使用URL与URLConnection高效、准确地获取网络资源。首先,通过`java.net.URL`类定位网络资源;其次,利用`URLConnection`类实现资源的读取与写入。文章还提供了最佳实践,包括异常处理、连接池、超时设置和请求头与响应头的合理配置,帮助Java程序员提升技能,应对复杂网络编程场景。
303 9
|
前端开发 JavaScript
React 标签组件 Tag
在现代Web开发中,标签(Tag)是常见的UI元素,用于分类、标记或表示状态。本文基于React框架,介绍如何创建和管理标签组件,涵盖基础使用、样式处理及常见问题与易错点。通过函数式组件定义标签,并使用CSS或CSS-in-JS进行样式处理。常见问题包括样式冲突、事件绑定错误和可关闭标签逻辑错误,提供解决方案如命名空间、CSS模块化和正确事件绑定方法。掌握这些内容有助于提高开发效率和代码质量。
424 27
|
存储 缓存 网络协议
|
Java 开发者
JAVA高手必备:URL与URLConnection,解锁网络资源的终极秘籍!
在Java网络编程中,URL和URLConnection是两大关键技术,能够帮助开发者轻松处理网络资源。本文通过两个案例,深入解析了如何使用URL和URLConnection从网站抓取数据和发送POST请求上传数据,助力你成为真正的JAVA高手。
307 11
|
存储 缓存 网络协议
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点,GET、POST的区别,Cookie与Session
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点、状态码、报文格式,GET、POST的区别,DNS的解析过程、数字证书、Cookie与Session,对称加密和非对称加密
|
前端开发 JavaScript UED
react-router 里的 Link 标签和 a 标签有什么区别
`react-router` 中的 `Link` 标签与 HTML 中的 `a` 标签的主要区别在于:`Link` 是专门为 React 应用设计的,用于实现客户端路由导航,不会触发页面的重新加载,而 `a` 标签则会刷新整个页面。使用 `Link` 可以提升应用的性能和用户体验。
|
域名解析 缓存 负载均衡
网络浏览器并输入地址到显示的整个过程
网络浏览器并输入地址到显示的整个过程