React应用部署到GitHub Pages后报Blocked loading mixed active content错误

Blocked loading mixed active content “http://www.omdbapi.com/?s=l&apikey=ca6be1d4”
Uncaught (in promise) TypeError: NetworkError when attempting to fetch resource.

• 这是浏览器安全策略触发的混合内容拦截规则：GitHub Pages 全站使用HTTPS协议提供服务，所有在HTTPS页面内发起的HTTP明文请求都会被浏览器默认阻止，避免敏感数据被窃听或篡改。
• 本地开发环境一般是HTTP协议的本地服务，和你调用的HTTP协议OMDB接口协议一致，所以不会触发拦截，部署后才会出现报错。

• 直接修改代码中OMDB API的请求前缀，将http://www.omdbapi.com替换为https://www.omdbapi.com，OMDB接口本身完全支持HTTPS协议访问，修改后请求协议和GitHub Pages的站点协议保持一致，即可解决拦截问题。
• 修改完成后本地测试请求正常，重新构建部署到GitHub Pages即可生效。

内容的提问来源于stack exchange，提问作者Vahid