调用Facebook Graph API获取直播评论时出现CORS错误如何解决

你遇到的CORS报错是浏览器同源策略的强制限制，Facebook的streaming-graph接口默认不会为第三方业务域名添加CORS允许头，因此前端直接发起请求必然会被拦截。本地开发正常大概率是你开启了浏览器跨域插件、或者本地开发服务器配置了代理规则，绕过了跨域校验。
另外你当前的代码存在严重安全隐患：直接在前端明文写入access_token，任何人打开页面抓包就能获取到你的接口凭证，可能被滥用导致你的Facebook开发者权限出现风险。

• 方案1：后端代理转发（最推荐）
  你可以在自己的业务后端新增一个代理接口，前端不再直接请求Facebook地址，改为请求你自己的后端接口，由后端服务向Facebook发起请求拉取直播评论数据，再把结果返回给前端。这种方案既解决了跨域问题，还能把access_token保存在后端，避免前端泄露。
  如果需要保持EventSource的长连接特性，你可以让后端代理接口也支持SSE协议，和前端保持长连接，后端收到Facebook的推送后直接转发给前端即可。

• 方案2：配置服务器反向代理
  如果你不想改后端业务逻辑，可以用Nginx、Caddy等服务器配置反向代理规则，指定某个路径下的请求自动转发到https://streaming-graph.facebook.com，前端请求你自己域名下的这个路径即可，示例Nginx配置参考：

location /fb-streaming/ {
    proxy_pass https://streaming-graph.facebook.com/;
    # 可替换为你自己的业务域名，生产环境不要用*
    add_header Access-Control-Allow-Origin *; 
}

配置后前端的EventSource地址改为/fb-streaming/[你的videoID]/live_comments?xxx即可，不会再出现跨域问题。

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