如何解决在Amazon ECS中无缝部署React + Nginx + Docker
当我在Amazon ECS中使用React + Nginx重新部署容器时,即使重新加载页面后,一段时间(约5-10秒)的浏览器也无法加载我的静态js块(在重新部署之前已更改)。
之后,我将异步导入包装为:
// in routes file
const DashboardPage = lazy(() =>
componentLoader(
() =>
import(
/* webpackChunkName: "dashboard_page" */ "pages/Dashboard/DashboardPage"
),attemptsLeft,)
// ... some code
export const componentLoader = (
lazyComponent: any,attemptsLeft: number,): Promise<any> => {
return new Promise((resolve,reject) => {
lazyComponent()
.then(resolve)
.catch((error: any) => {
setTimeout(() => {
if (attemptsLeft === 0) {
reject(error);
return;
}
componentLoader(lazyComponent,attemptsLeft - 1).then(
resolve,reject,);
},1500);
});
});
};
因此,使用此包装器,我可以执行块请求,而无需 reload 页面,然后等到块将可供下载。在下面的屏幕上,您可以看到在第四个尝试浏览器上成功上传了代码块。
问题是为什么不允许该块首次下载?我希望亚马逊必须立即用Docker容器切换实例。
Nginx配置:
user nginx;
worker_processes 1;
error_log /dev/stdout info;
pid /var/run/nginx.pid;
events {
worker_connections 1024;
}
http {
include /etc/nginx/mime.types;
default_type application/octet-stream;
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"';
access_log /var/log/nginx/access.log main;
sendfile on;
keepalive_timeout 65;
proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=some_zone:10m max_size=100m
inactive=10m use_temp_path=off;
proxy_cache_valid 200 3m;
server {
listen 9080;
server_name localhost;
location / {
root /app;
index index.html;
try_files $uri $uri/ /index.html;
}
location /actuator/health {
default_type application/json;
return 200 '{"status":"UP"}';
}
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。