Flow测试网Access API调用报错：CLI正常FCL异常及CORS问题

1. 初始错误：URL Scheme不支持 #

报错URL scheme "access.devnet.nodes.onflow.org" is not supported的核心原因：

• access.devnet.nodes.onflow.org:9000是gRPC协议端点，而浏览器环境下的FCL调用依赖HTTP/REST协议，无法直接兼容gRPC端点。
• 配置FCL时必须指定Flow官方的REST API端点，且需携带完整的https://协议头。

2. CORS跨域问题解决 #

更换为https://rest-testnet.onflow.org后出现跨域错误，是因为该官方REST端点的CORS策略未包含*.app等自定义域名，浏览器同源策略会拦截跨域请求。以下是可行解决办法：

方案一：本地开发环境配置代理 #

通过前端项目的代理工具转发请求，绕过浏览器跨域限制：

• Vue项目：在vue.config.js中添加代理配置：

module.exports = {
  devServer: {
    proxy: {
      '/v1': {
        target: 'https://rest-testnet.onflow.org',
        changeOrigin: true,
        secure: true
      }
    }
  }
}

• React项目：在package.json中添加：

"proxy": "https://rest-testnet.onflow.org"

之后将FCL配置的端点改为/（本地代理地址）即可。

方案二：生产环境搭建后端代理 #

部署一个简单的后端服务（如Node.js/Go），负责转发Flow REST请求，前端调用自身后端接口避免跨域：
示例Node.js代理（Express）：

const express = require('express');
const axios = require('axios');
const app = express();

app.use(express.json());

app.post('/v1/scripts', async (req, res) => {
  try {
    const response = await axios.post('https://rest-testnet.onflow.org/v1/scripts', req.body, {
      params: req.query
    });
    res.send(response.data);
  } catch (err) {
    res.status(err.response.status).send(err.response.data);
  }
});

app.listen(3000, () => console.log('Proxy server running on port 3000'));

前端FCL配置的端点改为自己的代理服务地址即可。

方案三：正确配置FCL基础参数 #

确保FCL的测试网配置正确（仍需配合代理解决跨域）：

import * as fcl from "@onflow/fcl";

fcl.config()
  .put("accessNode.api", "https://rest-testnet.onflow.org")
  .put("discovery.wallet", "https://fcl-discovery.onflow.org/testnet/authn")

3. 脚本逻辑验证 #

你的Cadence脚本和CLI命令可正常运行，说明脚本逻辑无问题，故障仅出在FCL端点配置与跨域处理环节。

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