首页 前端知识 nginx部署vue前端项目,访问报错500 Internal Server Error

nginx部署vue前端项目,访问报错500 Internal Server Error

2024-02-04 11:02:02 前端知识 前端哥 809 492 我要收藏

前言

描述:当我配置好全部之后,通过 服务器 ip 地址访问,遇到报错信息:500 Internal Server Error

情况说明

前提:我是通过Docker启动nginx容器,通过-v 绑定数据卷,将html文件和nginx.conf通过挂载的方式启动。

我将vue项目打包放在 html路径下。通过启动命令启动nginx容器,命令如下所示:

docker run -d --privileged=true --name nginx -v /mydata/nginx/html:/usr/share/nginx/html -v /mydata/nginx/nginx.conf:/etc/nginx/nginx.conf -p 80:80 nginx

一、展示配置

1.1 nginx.conf
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;

    server {
        listen       80;
        server_name  localhost;
		charset utf-8;

		location / {
            root   /usr/share/nginx/html;
	    	try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }
		


     	error_page   500 502 503 504  /50x.html;
    	location = /50x.html {
            root   html;
        }
    }
}

1.2 详细解释
		location / {
            root   /usr/share/nginx/html;

/usr/share/nginx/html:对应的路径应该是docker内部映射的html所在的文件路径,而不是主机上的html所在路径。

总结

至于为什么会出现标题上面的报错,是因为我把配置文件内的 root 对应的路径写错了。所以在我排查的过程中,一直觉得很奇怪,明明html路径也有,容器启动正常,就是访问不到。花费了一些时间。

  • 知识归纳:
  • 在这个实验中,我意识到nginx.conf这个文件针对的是容器内部才有效,而不是看着容器外面的路径。
转载请注明出处或者链接地址:https://www.qianduange.cn//article/1271.html
标签
nginx
评论
会员中心 联系我 留言建议 回顶部
复制成功!