请求不到百度网址的原因

(index):1 Access to XMLHttpRequest at 'https://www.baidu.com/' from origin 'http://localhost:5173' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

这个错误信息与你上一轮对话中的 Vue 模板报错完全不同。这是一个典型的 CORS(跨域资源共享)错误,发生在浏览器的网络请求层面。

虽然你提供的网页解析内容显示的是百度的"404 Not Found"页面,但关键信息在那行红色的报错:

❌ 错误核心

CORS policy: No 'Access-Control-Allow-Origin' header...

这意味着:你本地的开发服务器(http://localhost:5173)试图通过 AJAX/XHR 请求访问百度(https://www.baidu.com/),但百度服务器拒绝了这次请求。


💡 为什么会发生?

  1. 同源策略限制:浏览器为了安全,禁止网页脚本(JavaScript)向不同域名、端口或协议的服务器发起请求。
  2. 百度的策略 :百度作为公开网站,主要面向浏览器直接访问,通常会配置 CORS 头部允许任意第三方网站(如你的本地开发环境)通过脚本调用其接口。
  3. 你的操作 :你的代码中很可能有一行类似 fetch('https://www.baidu.com/')axios.get('https://www.baidu.com/') 的逻辑。

🛠️ 如何解决?

根据你的具体需求,可以选择以下几种方案:

方案一:更换为支持 CORS 的测试接口(推荐)

如果你只是想测试"能不能发请求",请不要使用百度或淘宝等大厂网站(它们通常会屏蔽非浏览器请求)。

请改用专门用于测试的 API:

复制代码
// 例如,使用 JSONPlaceholder
fetch('https://jsonplaceholder.typicode.com/posts/1')
  .then(response => response.json())
  .then(data => console.log(data));
方案二:后端代理(如果你需要获取百度的数据)

如果你确实需要获取百度的数据,不能直接在前端浏览器里发请求,必须通过你自己的后端服务器作为"中间人"去请求。

  1. 前端请求你的本地后端:http://localhost:3000/proxy-baidu
  2. 你的后端服务器(Node.js/Python等)去请求百度:https://www.baidu.com/
  3. 后端拿到数据后,再返回给前端。
方案三:开发环境关闭 CORS(仅限调试,不推荐)

如果你是在开发环境(如 Vite),可以通过配置 vite.config.js 来代理请求,欺骗浏览器,但这通常用于请求你自己的后端 API,而不是去请求百度。


📌 总结

  • 错误原因:你在本地网页里直接用 JS 请求了百度,百度拒绝了。
  • 解决办法 :如果是练手,请换一个测试 API(如 jsonplaceholder);如果是业务需求,请通过后端服务器去请求。
相关推荐
Gary Studio5 小时前
Selinux编写
linux·服务器·前端
网络点点滴5 小时前
NPM的包版本管理
前端·npm·node.js
光影少年5 小时前
react性能优化比较好的办法有哪些?
前端·react.js·性能优化
fix一个write十个5 小时前
从零搭建音视频通话太痛苦?这个 Vue3 CallKit 让你 5 分钟搞定 1v1 + 群聊通话
前端·vue.js·github
豹哥学前端5 小时前
告别割裂式学习:待办清单项目,一次性掌握数组、本地存储与事件委托
前端·javascript
JYeontu5 小时前
照片墙太死板?做一个会随风摇摆的绳串图片交互效果
前端·javascript·css
2501_915921435 小时前
HTTPS前端劫持 新一代流量劫持解决方案
前端·网络协议·ios·小程序·https·uni-app·iphone
Yue栎廷5 小时前
邪修:Markdown加粗语法**本土化改造
前端·javascript·人工智能
爱怪笑的小杰杰5 小时前
优化 UniApp 日历组件的多语言切换:告别 setLocale 引起的 App 重启
java·前端·uni-app