请求不到百度网址的原因

(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);如果是业务需求,请通过后端服务器去请求。
相关推荐
小徐_23337 分钟前
Wot UI 2.2.0 发布:Button 新增 subtle,VideoPreview 预览体验继续增强
前端·微信小程序·uni-app
天蓝色的鱼鱼2 小时前
关于 CSS 你可能不知道的属性,但关键时刻很有用
前端·css
泯泷3 小时前
第 2 篇:设计第一套字节码:Opcode、Instruction 与 Constant Pool
前端·javascript·安全
妙码生花3 小时前
从 PHP 到 AI + Golang,程序员自救转型手记(十五):优化细节、网络请求封装
前端·后端·ai编程
泯泷3 小时前
第 1 篇:从 1 + 2 开始:亲手写出第一台 JSVM
前端·javascript·安全
团团崽_七分甜3 小时前
Spring Boot 核心知识点总结
前端
lichenyang4533 小时前
从一个按钮开始,理解 ASCF 框架到底在做什么
前端
古夕4 小时前
第三方 SSO 接入实践:redirect_uri 编码、回调一致性与跨项目联调
前端·vue.js
朦胧之4 小时前
页面白屏卡住排查方法
前端·javascript