通过JavaScript调用Algolia REST API遭遇CORS错误求助

嘿，我一眼就揪出问题所在了——你的请求URL根本不完整，这就是触发CORS报错的核心原因！

问题根源 #

你现在只请求了Algolia的根域名 https://${APP_ID}-dsn.algolia.net/，但Algolia的搜索REST API要求必须指定具体的索引名称，正确的端点格式是：
https://${APP_ID}-dsn.algolia.net/1/indexes/{你的索引名称}/query

当你请求根域名时，服务器会返回重定向响应，而浏览器的同源策略明确禁止跨域请求跟随这类重定向，所以才会抛出那些CORS相关的错误提示。

修正后的代码 #

把URL补全，加上你的实际索引名称，同时记得用搜索专用的API密钥（绝对不能用Admin密钥，既不安全还可能有跨域限制）：

const API_KEY = '你的搜索专用API密钥'; // 用Search-Only Key，别用Admin Key
const APP_ID = 'my_app_id';
const INDEX_NAME = '你的索引名称'; // 替换成你自己的索引名
const url = `https://${APP_ID}-dsn.algolia.net/1/indexes/${INDEX_NAME}/query`;
const query = 'my_query';
const data = { 
  params: `query=${query}&hitsPerPage=1` 
};

fetch(url, {
  method: 'POST',
  body: JSON.stringify(data),
  mode: 'cors',
  headers: new Headers({
    'Accept': 'application/json',
    'Content-Type': 'application/json; charset=UTF-8',
    'X-Algolia-API-Key': API_KEY,
    'X-Algolia-Application-Id': APP_ID
  })
})
.then(res => res.json())
.catch(error => console.error('Error:', error))
.then(response => console.log('Success:', response));

额外注意事项 #

• API密钥选择：登录Algolia后台，在「API密钥」页面找到「Search-Only API Key」，这个密钥是专门给前端使用的，默认允许CORS请求；Admin密钥拥有全权限，绝对不能暴露在前端代码里，而且可能被配置为禁止跨域。
• Allowed Origins配置：如果还是遇到CORS问题，检查你使用的API密钥的「Allowed Origins」设置，确认你的前端域名（比如http://localhost:3000或生产环境域名）已经被添加到允许列表中。

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