Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >显示来自React中URL的图像

显示来自React中URL的图像
EN

Stack Overflow用户
提问于 2021-05-23 03:19:58
回答 1查看 47关注 0票数 0

我正在尝试从一个S3桶加载用户化身,在这个桶中,在向/uploads/resume/{user_uid}发出GET请求时,图像返回一个URL。我的请求就是这样

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
const getAvatar = async() => {
    var myHeaders = new Headers();
    myHeaders.set('Authorization', 'Basic ' + credentials);
    var requestOptions = {
      method: 'GET',
      headers: myHeaders,
      redirect: 'follow'
      };
     
      let response;

      try {
          response = await fetch (`${APIlink}/uploads/resume/${user_uid}`, requestOptions)
      } catch (err) {
          console.log("Failed");
          return;
      }
      const result = await response.text();
      setAvatarURL(result);
      console.log(avatarURL);

  };

那我就知道

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<img src={avatarURL}/>

在我的呈现方法中,显示用户的化身,但没有显示任何内容。在对图像标记执行检查元素时,我看到URL中有一个额外的双引号,类似于这个<img src=""URL""> avatarURL应该是一个字符串,那么为什么会有另外一对引号呢?

console.log(avatarURL);会给我带来"https://i*******“这样的东西

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-05-23 03:26:18

试着这样做:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<img src={avatarURL.replace(/['"]+/g, '')}/>  // to remove extra double quotes
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/67659150

复制
相关文章
WindowBuilder入门:使用swt的canvas类构造显示URL图像
版权声明:本文为博主原创文章,转载请注明源地址。 https://blog.csdn.net/10km/article/details/53377864
10km
2019/05/25
1.3K0
OpenCV中图像的读取,显示与保存
相关函数:cv2.imread()、cv2.imshow()、cv2.imwrite()
py3study
2020/01/19
2.9K0
OpenCV中如何读取URL图像文件
最近知识星球收到的提问,觉得是一个很有趣的问题,就通过搜集整理归纳了一番,主要思想是通过URL解析来生成数据,转为图像/Mat对象。但是在Python语言与C++语言中的做法稍有不同。
OpenCV学堂
2019/07/19
5.9K0
c#利用Halcon的图像显示控件显示图像
?
vv彭
2020/10/27
2.9K0
c#利用Halcon的图像显示控件显示图像
浏览器中输入 URL 到网页显示的过程
图片来源:《图解HTTP》 总体来说分为以下几个过程: DNS 解析 TCP 连接 发送 HTTP 请求 服务器处理请求并返回 HTTP 报文 浏览器解析渲染页面 连接结束 具体可以参考下面这篇文章: 从输入 URL 到页面加载发生了什么? 常见 HTTP 状态码 状态码 各协议与 HTTP 协议之间的关系 图片来源:《图解HTTP》
happyJared
2019/06/24
1.4K0
URL中的#
作者:阮一峰   http://www.ruanyifeng.com/blog/2011/03/url_hash.html
超然
2018/08/03
1.8K0
MATLAB的图像显示方法
在 MATLAB 中, 序列是用矩阵向量表示, 但它没有包含采样信息, 即序列位置信息, 为 此, 要表示一个序列需要建立两个向量; 一是时间序列 n , 或称位置序列, 另一个为取值序 列 x ,表示如下:
timerring
2023/03/04
4.8K0
MATLAB的图像显示方法
基于FPGA的图像显示
这几天一直在调试FPGA的图像显示系统,今天终于成功,图像不在闪烁,也不再边框缺失。
FPGA开源工作室
2019/10/29
1.8K0
基于FPGA的图像显示
opencv显示图像
如果说我们在些项目的过程中会频繁的查看我们的图片,我们就可以直接给它封装一个方法:
淼学派对
2023/10/14
2120
opencv显示图像
React-Router-URL参数
React Router 是 React 应用中常用的路由管理库,而 URL 参数则是它的一个关键概念。URL 参数允许您在路由之间传递数据,从而使您的应用程序更灵活和交互性更强。
杨不易呀
2023/10/01
2830
在 React 中缩放、裁剪和缩放图像
在本文中,我们将了解如何使用 Cropper.js 在 React Web 应用中裁剪图像。尽管我们不会将这些图像上传到远程服务器进行存储,但是很容易就能完成这个任务。
疯狂的技术宅
2020/02/26
6.3K0
在 React 中缩放、裁剪和缩放图像
用 React 分页显示数据用react分页显示数据
展示一下主要三个组件:父组件listBox、列表组件List、按钮组件PageButton
一个会写诗的程序员
2018/08/17
3K0
用 React 分页显示数据用react分页显示数据
react中实现搜索结果中关键词高亮显示
网上看到很多js实现的关键词高亮显示,方法都是一个道理,先获取要替换的文字区域,然后在用正则匹配到关键词,并进行替换。
蓓蕾心晴
2018/08/01
5.1K0
react中实现搜索结果中关键词高亮显示
OpenCV中图像显示你不知道的编程技巧
OpenCV 中最常用的一个API函数 imshow 各种编程与应用技巧,是否有你以前一直想的,但是从来没有成功过的操作!
磐创AI
2019/10/09
1.5K0
OpenCV中图像显示你不知道的编程技巧
OpenCV中图像显示你不知道的编程技巧
OpenCV 中最常用的一个API函数 imshow 各种编程与应用技巧,是否有你以前一直想的,但是从来没有成功过的操作!
OpenCV学堂
2019/09/20
1.9K0
OpenCV中图像显示你不知道的编程技巧
react如何监听路由url变化
使用这些生命周期钩子可以监听到路由相同,参数不同的变化,但是监听不到完全不相同的url的变化。即使路由不同,componentDidMount组件内容所更新的东西变了,但是代码变了,页面没有变,找到了一种方法。withRouter
蓓蕾心晴
2018/09/20
7.9K0
url带中文参数显示乱码的问题
最近要上个项目,其实很简单的东西,就是拼接一个url,不过url中的参数需要UrlEncode编码的,其实对我来说,这个问题很好解决,C#用HttpUtility.UrlEncode来进行编码,asp用Server.UrlEncode来进行编码。 问题解决了吗?问题刚刚开始 因为这个公用转向文件,是针对所有分站的,分站代码有.net和asp两种,文件编码格式也不一样。 头大的事情开始了。asp站的文件编码是gb2312,虽然.net的文件格式也是gb2312,但因为webconfig里设置的reque
脑洞的蜂蜜
2018/02/01
3.9K0
React Native的列表显示
前言 在一个移动App中,我们最常用的内容展现形式就是列表。今天,我们尝试用React Native完成对列表的开发。 ListView ListView作为一个React Native官方提供的控件,我们需要了解它的属性。 dataSource 是列表的数据源,通常以一个数组的形式传给ListView。 renderRow 是列表的表现层,我们可以获得dataSource的单项数据,然后用于单项渲染。 官方例子 import React, { Component } from 'react'; impor
Oceanlong
2018/07/03
1.9K0
【译】React Native URL 路由库
可以参考链接:https://developer.android.com/training/app-indexing/deep-linking.html
腾讯IVWEB团队
2020/06/28
1.2K0
【OpenCV】图像的读入与显示
相关工程文件下载: 链接:https://pan.baidu.com/s/1jfDQTdOQqIf34-D5Nx6big 密码:0d13
EdenChen
2018/04/17
1.6K0
【OpenCV】图像的读入与显示

相似问题

在react native中显示来自URL的外部SVG图像

335

显示来自URL的图像

31

显示来自URL的图像

12

来自URL的图像未在Android react原生应用程序中显示

219

无法显示来自URL的图像

10
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文