create-react-app 問題：拒絕加載圖像&#39;<URL> &#39; 因為它違反了以下內容安全策略指令：

Question

我正在嘗試將 React 應用程序部署到 Heroku。 我有一個 NodeJs/Express API，它正在為我使用 create-react-app 創建的應用程序提供服務。

我試圖在我網站上的外部 API ( https://www.thecocktaildb.com ) 的標簽中顯示圖像，但在生產中我繼續收到以下錯誤：

Refused to load the image '<URL>' because it violates the following Content Security Policy directive: "img-src 'self' data:".

我試圖在我的 public/index.html 文件中使用以下代碼片段的許多變體來解決這個問題，但到目前為止沒有任何效果。

<meta
    http-equiv="Content-Security-Policy"
    content="img-src 'self' https://www.thecocktaildb.com data:;"
/>

我已經沒有什么可以嘗試的了，並且在任何地方都找不到解決方案。 請幫忙。

Answer 1

https://stackoverflow.com/a/40360666/11624647

嘗試添加您的標簽

img-src * 'self' data: https:

代碼：

<meta http-equiv="Content-Security-Policy" content="default-src *;
   img-src * 'self' data: https:; script-src 'self' 'unsafe-inline' 'unsafe-eval' *;
   style-src  'self' 'unsafe-inline' *">