使用Rarible API获取NFT地板价遇CORS及请求失败问题求助

遇到的错误 #

调用Rarible地板价API时触发跨域限制：

origin 'http://xyz' has been blocked by CORS policy

Uncaught (in promise) TypeError: Failed to fetch

涉及API端点 #

https://api.rarible.org/v0.1/data/collections/{collection}/floorPrice

文档要求的集合ID格式 #

required
string (OlapCollectionPattern) ^(ETHEREUM|FLOW|TEZOS|POLYGON|SOLANA):.*$
Identifier of collection

解决方案 #

1. 解决CORS跨域问题 #

前端直接请求第三方API必然会触发浏览器的CORS限制，推荐两种解决方式：

• 后端代理（生产环境必用）：搭建自己的后端服务，由后端发起对Rarible API的请求，前端再调用自身后端接口。示例Node.js（Express框架）代码：

  const express = require('express');
  const fetch = require('node-fetch');
  const app = express();
  
  app.get('/api/floor-price/:collection', async (req, res) => {
    const collection = req.params.collection;
    try {
      const response = await fetch(`https://api.rarible.org/v0.1/data/collections/${collection}/floorPrice`);
      const data = await response.json();
      res.json(data);
    } catch (err) {
      res.status(500).json({ error: err.message });
    }
  });
  
  app.listen(3000, () => console.log('Proxy server running on port 3000'));
  

  前端直接请求http://localhost:3000/api/floor-price/{collection}即可。
• 浏览器插件（仅开发测试用）：安装CORS Unblock类插件临时绕过限制，但上线环境绝对不能依赖这种方式。

2. 确保集合ID格式正确 #

集合ID必须严格遵循{链标识}:{集合合约地址}的格式，比如：

• ETH链集合：ETHEREUM:0x123456789abcdef123456789abcdef123456789a
• Polygon链集合：POLYGON:0xabcdef123456789abcdef123456789abcdef1234
  必须与你获取的NFT所属链完全对应，格式错误会导致API返回无效响应。

3. 正确发起请求 #

该API使用GET方法，无需额外请求头（当前文档未提及API密钥要求），直接将正确格式的集合ID拼接至URL中即可发起请求。

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