为什么我的 API 请求没有在加载 CloudFront 缓存的页面时发送？
Why doesn't my API request send on load of page cached by CloudFront?
我有一个 Angular 7 应用程序托管在 S3 存储桶上，它向 Elastic Beanstalk 后端发出 API 请求。 S3 存储桶位于 CloudFront 前面，我使用 Lambda 拦截通过 Prerender.cloud 进行预呈现的请求。当我加载我的页面 (https://contrast.fm/calendar) 时，加载页面数据的初始 API 请求没有发送。
这在我的本地环境中工作得很好，即发送到我的日历端点的初始请求。当我通过存储桶 URL 加载网站时也能正常工作。我注意到如果我在 CloudFront 中使 * 无效，请求会在页面加载时成功发送。但是任何后续的页面刷新都不会导致发送请求。
因此，我认为我对我的站点在 CloudFront 方面应该如何工作存在根本性的误解。无论页面是否缓存，应用程序在初始化时发出的 HTTP 请求是否都应该发送？
已解决此问题！该问题与 prerender.cloud 有关。 Prerender.cloud 注入缓存 AJAX 请求的猴子补丁。
要解决，如果您使用的是 prerender.cloud 的 CloudFront + Lambda@Edge 库，则可以将 prerendercloud.set('disableAjaxPreload', true) 放入 handler.js。然而，这并不理想，因为它会导致屏幕闪烁，因为陈旧的缓存数据将消失，来自 AJAX 请求的新数据将在加载时替换它。
您还可以设置window.__PRELOADED_STATE_PLAIN__。这将完全禁用猴子补丁，并在此处进行了详细记录：https://www.prerender.cloud/docs/server-client-transition/state
我有一个 Angular 7 应用程序托管在 S3 存储桶上，它向 Elastic Beanstalk 后端发出 API 请求。 S3 存储桶位于 CloudFront 前面，我使用 Lambda 拦截通过 Prerender.cloud 进行预呈现的请求。当我加载我的页面 (https://contrast.fm/calendar) 时，加载页面数据的初始 API 请求没有发送。
这在我的本地环境中工作得很好，即发送到我的日历端点的初始请求。当我通过存储桶 URL 加载网站时也能正常工作。我注意到如果我在 CloudFront 中使 * 无效，请求会在页面加载时成功发送。但是任何后续的页面刷新都不会导致发送请求。
因此，我认为我对我的站点在 CloudFront 方面应该如何工作存在根本性的误解。无论页面是否缓存，应用程序在初始化时发出的 HTTP 请求是否都应该发送？
已解决此问题！该问题与 prerender.cloud 有关。 Prerender.cloud 注入缓存 AJAX 请求的猴子补丁。
要解决，如果您使用的是 prerender.cloud 的 CloudFront + Lambda@Edge 库，则可以将 prerendercloud.set('disableAjaxPreload', true) 放入 handler.js。然而，这并不理想，因为它会导致屏幕闪烁，因为陈旧的缓存数据将消失，来自 AJAX 请求的新数据将在加载时替换它。
您还可以设置window.__PRELOADED_STATE_PLAIN__。这将完全禁用猴子补丁，并在此处进行了详细记录：https://www.prerender.cloud/docs/server-client-transition/state