请求不到百度网址的原因

(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);如果是业务需求,请通过后端服务器去请求。
相关推荐
代码搬运媛8 小时前
Jest 测试框架详解与实现指南
前端
counterxing8 小时前
我把 Codex 里的 Skills 做成了一个 MCP,还支持分享
前端·agent·ai编程
wangqiaowq9 小时前
windows下nginx的安装
linux·服务器·前端
之歆9 小时前
DAY_12JavaScript DOM 完全指南(二):实战与性能篇
开发语言·前端·javascript·ecmascript
发现一只大呆瓜9 小时前
Vite凭什么这么快?3分钟带你彻底搞懂 Vite 热更新的幕后黑手
前端·面试·vite
Maimai108089 小时前
React如何用 @microsoft/fetch-event-source 落地 SSE:比原生 EventSource 更灵活的实时推送方案
前端·javascript·react.js·microsoft·前端框架·reactjs·webassembly
kyriewen11 小时前
产品经理把PRD写成“天书”,我用AI半小时重写了一遍,他当场愣住
前端·ai编程·cursor
humcomm11 小时前
元框架的工作原理详解
前端·前端框架
canonical_entropy12 小时前
Attractor Before Harness: AI 大规模开发的方法论
前端·aigc·ai编程
zhangxingchao12 小时前
多 Agent 架构到底怎么选?从 Claude Agent Teams、Cognition/Devin 到工程落地原则
前端·人工智能·后端