CloudFlare JS 挑战正在打破我的 SPA答案

【问题标题】：CloudFlare JS challenge is breaking my SPACloudFlare JS 挑战正在打破我的 SPA
【发布时间】：2019-06-17 15:01:55
【问题描述】：

我有一个基于 React 的 SPA，它通过 S3 在一个子域 react.mydomain.com 上托管...它与托管在另一个子域 api.mydomain.com 上的 VPS 上的 PHP REST API 通信。 api.mydomain.com 在 CloudFlare 后面。该 Web 应用位于 CloudFront 之后，因为它位于 AWS 上。

我遇到了直接向 API 发出机器人请求的问题，导致我的 VPS 泛滥，我想使用 CloudFlare 的 JS 质询功能来缓解问题。

然而，似乎正在发生的事情是用户能够加载 React webapp（它不在 CloudFlare 后面）。然后，会提示 JS 质询的请求会立即失败并返回 503 响应，因为它是 AJAX 请求，并且与 Javascript 质询不兼容。

我想我可以通过捕获错误和重定向来处理这个问题。但是，如果我手动强制自己的浏览器导航到 api.mydomain.com URL，我将看到 CloudFlare 质询并通过它。但是，如果我随后导航回我的 react.mydomain.com SPA，OPTIONS 请求将失败，因为它无法附加告诉 CloudFlare 它已通过的 cookie。

我不明白如何调整我的基础架构以便利用 JS 挑战。目前我仅限于使用速率限制，但我发现当我变得严重到用户开始抱怨时，我仍然让大约 75% 或更多的不需要的机器人流量通过。

【问题讨论】：

我不了解 cloudflare，但我见过其他解决方案将机器人保护跟踪 cookie 配置为包括前端和 API 域的范围。为了解决主要问题，您需要让您的 JS 代码检测挑战，执行它（例如使用eval()），等待挑战完成，然后重新运行请求。

标签： reactjs laravel security cors cloudflare

【解决方案1】：

如果您有后端访问权限，则可以在检测到机器人时使用 NPM 和 process.kill(process.pid) 作为临时解决方案。

【讨论】：

它（巧合地）创建了一个 [网站] 关闭了连接错误，这对于人类来说是极难绕过的，因此会有效地阻止无头机器人。

【解决方案2】：

我建议不要只在 s3 中托管 spa 文件上传或附件到 s3

在 Ec2 上托管并通过安全组策略阻止所有访问只允许 Cloudflare IP 这里列出了https://www.cloudflare.com/ips/

您还可以使用 Amazon AWS Lambda 无服务器托管而不是 s3 https://aws.amazon.com/lambda/?c=ser&sec=srv

【讨论】：

S3，尤其是前面的 CloudFront，是一个非常适合托管单页应用程序的可扩展解决方案。在 EC2 上托管或使用 Lambda 是不够的。例如，EC2 上的单页应用程序仍必须使用 Node.js 服务或 Apache 服务器提供服务。必须将 Lambda 集成到 API Gateway 才能提供内容。这两种解决方案对于 SPA 来说似乎都很笨拙，而 S3 提供了一个简单的解决方案。看起来用户遇到的问题与应用程序使用的 AWS 服务无关。