我有一个用Angular 7编写的应用程序,我正在使用NGINX将其部署到Docker容器中。当我运行这个容器时,除了在浏览器(F5)中刷新页面,我会得到一个nginx404错误页面之外,其他一切都可以正常工作
这是我的nginx.conf文件,您可以从中看到我尝试了“try\u文件”
用户nginx;
工人1;
error\u log/var/log/nginx/error.log warn;
pid/var/run/nginx.pid;
事件{
工人(1024);;
}
http{
包括/etc/nginx/mime.types;
默认_类型应用程序/八位字节流;
日志格式主“$remote\u addr-$remote\u user[$time\u local]“$request””
“$status$body\u bytes\u sent”$http\u referer”
“$http_user_agent”“$http_x_forwarded_for””;
access\u log/var/log/nginx/access.log main;
发送文件到;
#tcp_nopush on;
保持生命超时65;
gzip on;
包括/etc/nginx/conf.d/*.conf;
服务器{
听80;
地点/{
root/usr/share/nginx/html;
index.html;
尝试使用文件$uri/index.html;
}
}
}
我的Dockerfile:
来自节点的
:作为构建器
运行apk更新&&;apk add——无缓存生成git
WORKDIR/app
复制package.json package-lock.json/app/
运行cd/app&&;npm安装
抄袭/应用程序
运行cd/app&&;npm运行构建
来自nginx:阿尔卑斯山
运行rm-rf/usr/share/nginx/html/*&&;rm-rf/etc/nginx/nginx.conf
复制./nginx.conf/etc/nginx/nginx.conf
复制--from=builder/app/dist/hyper-client-admin/usr/share/nginx/html
暴露80
CMD[“nginx”,“-g”,“守护进程关闭;”]
已部署容器上的目录为:
/usr/share/nginx/html#ls-la
总数23564
drwxr-xr-x 1根根根4096年5月20日00:18。
drwxr-xr-x 1根根目录4096年3月8日03:05。。
drwxr-xr-x 2根根目录4096年5月20日00:18资源
-rw-r--r--1根根根290728 May 20 00:18 es2015-polyfills.js
-rw-r--r--1根根根211178 May 20 00:18 es2015-polyfills.js.map
-rw-r--r--1根根997年5月20日00:18 favicon.png
-rw-r--r--1根根目录770 May 20 00:18 index.html
-rw-r--r--1根根根114749 May 20 00:18 main.js
-rw-r--r--1根根115163 May 20 00:18 main.js.map
-rw-r--r--1根根根241546 May 20 00:18 polyfills.js
-rw-r--r--1根根根240220五月20日00:18 polyfills.js.map
-rw-r--r--1根根目录6224 May 20 00:18 runtime.js
-rw-r--r--1根根目录6214 May 20 00:18 runtime.js.map
-rw-r--r--1根根1117457 May 20 00:18 styles.js
-rw-r--r--1根根1191427年5月20日00:18 styles.js.map
-rw-r--r--1根根目录10048515 May 20 00:18 vendor.js
-rw-r--r--1根根目录10505601 May 20 00:18 vendor.js.map
以下是控制台输出:
172.17.0.1-[20/May/2019:00:18:30+0000]“GET/HTTP/1.1”200 371“-”Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,如Gecko)Chrome/74.0.3729.157 Safari/537.36“-”开发\超级客户端管理>;
172.17.0.1--[20/May/2019:00:18:30+0000]“GET/runtime.js HTTP/1.1”200 6224http://localhost:81/“Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,类似Gecko)Chrome/74.0.3729.157 Safari/537.36”
172.17.0.1--[20/May/2019:00:18:30+0000]“GET/polyfills.js HTTP/1.1”200 241546http://localhost:81/“Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,类似Gecko)Chrome/74.0.3729.157 Safari/537.36”
172.17.0.1--[20/May/2019:00:18:30+0000]“GET/main.js HTTP/1.1”200 114749http://localhost:81/“”Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,类似Gecko)
Chrome/74.0.3729.157 Safari/537.36“-”
172.17.0.1--[20/May/2019:00:18:30+0000]“GET/styles.js HTTP/1.1”200 1117457http://localhost:81/“Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,类似Gecko)Chrome/74.0.3729.157 Safari/537.36”
172.17.0.1---[20/May/2019:00:18:30+0000]“GET/vendor.js HTTP/1.1”200 10048515http://localhost:81/“Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,类似Gecko)Chrome/74.0.3729.157 Safari/537.36”
172.17.0.1---[20/May/2019:00:18:31+0000]“GET/assets/logo-white.svg HTTP/1.1“200 4519”http://localhost:81/“”Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,
如壁虎)铬/74.0.3729.157狩猎/537.36“-”
172.17.0.1---[20/May/2019:00:18:31+0000]“GET/favicon.png HTTP/1.1“200 997”http://localhost:81/login“Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,类似Gecko)Chrome/74.0.3729.157 Safari/537.36”
172.17.0.1---[20/May/2019:00:18:35+0000]“获取/登录HTTP/1.1”404188“-”Mozilla/5.0(Windows NT 10.0;Win64;x64)AppleWebKit/537.36(KHTML,类似Gecko)Chrome/74.0.3729.157 Safari/537.36“-”
2019/05/20 00:18:35[错误]6#6:*4 open()“/usr/share/nginx/html/login”失败(2:没有这样的文件或目录),客户端:172.17.0.1,服务器:localhost,请求:“GET/login HTTP/1.1”,主机:“localhost:81”
你知道这是怎么回事吗
更新:实际答案在@Rajesh答案的评论中。问题是我正在处理/etc/nginx/nginx.conf,我需要处理/etc/nginx/conf.d/default.conf
在Angular应用程序上刷新后,我们需要告诉nginx web服务器在显示错误页面之前,首先查看index.html文件,看请求的路由是否存在。这对我来说很好:
服务器{
听80;
服务器名称localhost;
地点/{
root/usr/share/nginx/html;
尝试_文件$uri$uri//index.html;
index.html index.htm;
}
错误\u第500页502 503 504/50x.html;
location=/50x.html{
root/usr/share/nginx/html;
}
}