无法从Wiki API接收数据，CodePen代码请求故障排查求助

嘿，我碰到过类似的情况，来帮你捋一捋~

首先看控制台的两个提示：脚本加载失败和沙盒属性的提示，这俩其实是关联的。CodePen的嵌入式iframe默认带有沙盒限制，虽然提示说同时开启allow-scripts和allow-same-origin会移除限制，但JSONP请求依赖动态创建<script>标签的方式，有时候会被这个沙盒规则拦截，导致请求失败。

给你几个可行的解决方案：

1. 改用CORS请求替代JSONP #

维基百科API是支持CORS的，只要在请求参数里加上origin=*，就能直接用fetch或者axios这类方式请求，不需要依赖JSONP的script标签。举个简单的例子：

// 用fetch请求Wiki API
const searchTerm = "dsfds";
fetch(`https://en.wikipedia.org/w/api.php?action=opensearch&search=${searchTerm}&format=json&origin=*`)
  .then(res => res.json())
  .then(data => {
    console.log("拿到数据啦：", data);
    // 这里可以处理你的数据逻辑
  })
  .catch(err => console.error("请求出错：", err));

这种方式避开了动态script标签的加载问题，也更符合现代前端的请求方式。

2. 调整CodePen的沙盒设置（可选） #

如果你还是想用JSONP，可以去CodePen项目的Settings > Behavior里，找到Sandbox选项，确保勾选了allow-scripts和allow-same-origin。不过亲测有时候还是会有小问题，所以更推荐第一种方案。

3. 检查API请求参数 #

确保你的API参数是完整的：

• action=opensearch：指定使用搜索接口
• format=json：指定返回JSON格式数据
• origin=*：允许跨域请求（关键参数）
• search=xxx：你的目标搜索关键词

试试上面的方法，应该就能正常获取数据啦~

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