时间戳

首页 > 解决方案 > ReactJS 项目，Image 属性的来源返回 CORS 失败

reactjs - ReactJS 项目，Image 属性的来源返回 CORS 失败

问题描述

我的 React JS 应用程序需要一些帮助，因为我是 React 的新手。

我正在从数据库中获取图像的 url，并将其作为道具传递给 Card-Layout 页面。<img className="card__img" src={product.img} alt="product-img" />
但这不起作用并显示 CORB 错误Cross-Origin Read Blocking (CORB) blocked cross-origin response *https://unsplash.com/photos/1ObeMBhLi0k* with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details.

我已经处理了与 Express.JS 相关的 CORS，但遇到了 React 问题。我试过用包“http-proxy-middleware”解决这个问题，但没有奏效。URL 的格式为“https://unsplash.com/photos/1ObeMBhLi0k”

你们中的任何人都可以提出任何解决方案吗？

标签： reactjsimagesrccross-origin-read-blocking

解决方案

从 CDN 加载 React（或其他可能引发错误的库）时，将crossorigin属性添加到您的<img>标签

还要确保 CDNAccess-Control-Allow-Origin:以 HTTP 标头中的 *响应

推荐阅读