我是一个自学成才的编程新手,只有一个月的学习年龄. 目前我已经通过观看YouTube建立了一个项目,我想在GitHub页面上显示项目结果,但在try 了所有方法后,网站仍然无法正确显示网站的内容,只显示了readme.md作为页面内容.

  1. 这是我的作品:https://github.com/PerdidoenCoding/first_react_app
  2. 这是我的GitHub页面URL:https://perdidoencoding.github.io/first_react_app/

经过多次try ,终于找到了错误,为什么它显示readme.md文件,而不是正确的网站.我没有安装gh-pages软件包. 在正确安装gh-pages包并运行 npm run deploy,网站终于显示出来了,但是网站没有运行我从omdbapi得到的API_URL函数,我该怎么解决这个问题?

推荐答案

您的API_URL使用http提供服务,而Github页面使用https协议提供服务,导致mixed content error,这是由于https提供服务的站点正在获取不安全的资源(图像、脚本、API等)造成的.将其更改为https应该会加载您期望从中获得的数据.

您可以在此处阅读有关混合内容的更多信息(link)

请注意,在您当前的状态下,您在try 获取API时会遇到网络错误,而您没有处理该错误,因此我也会将您的setMovies个内容包装在try/Catch中,并提供一个后备或通知用户有关问题的信息.如果API实际上关闭了怎么办?实际上,显示没有蝙蝠侠电影是不正确的.

Reactjs相关问答推荐

避风港访问端口以包含Reaction应用程序

如何通过浏览器路由在单独的.jsx文件中使用MUI抽屉?

TypeError:SearchProduct.get()获得了意外的关键字参数查询'

如何使用useState响应快速/顺序状态更新

React-React中是否完全支持基于类的组件?

我在Route组件上使用元素属性,这样就不需要ID了吗?

Gitlab CI和VITE环境变量出现问题

在任何渲染之前在ReactJs中获取数据

如何垂直对齐 React Bootstrap Table 行中的项目

React 无效的钩子调用:如何避免嵌套钩子?

如何更新redux状态存在的输入框

useState数组不更新

条件渲染元素的测试不起作用

React - 错误边界未捕获错误

状态链接未传递到路由页面

如何保留我的下一个授权用户会话?所以我可以使用提供的 ID 在其他路由中获取数据

react-query、react-hook-form 和表单验证

在 redux 工具包中使用 dispatch 发送多个操作

如何在 JSX 中使用 -webkit- 前缀?

React Router 6,一次处理多个搜索参数