阿里云ubuntu下nginx部署上线后报错问题

文章尾部有笔者配置的nginx服务的/etc/nginx/nginx.conf上线参考文件。

报错1

nginx: [emerg] bind() to 0.0.0.0:80 failed(98: Address already in use)

....

nginx: [emerg] bind() to 0.0.0.0:80 failed(98: Address already in use)

nginx: [emerg] still could not bind()

可能存在占用端口问题！
可以通过netstat -tanp | grep 80查看谁占用了进程，然后通过kill命令关掉即可。

报错2

当你修改了/etc/nginx/nginx.conf配置上线文件的服务监听端口设置为80端口时保存出来，重启service nginx restart服务报错以下：

Job for nginx.service failed because the control process exited with error code.
See "systemctl status nginx.service" and "journalctl -xe" for details.

解决方法：执行ps -ef | grep nginx看下面，找到www-data的进程号，通过kill -quit 7253 和kill -quit 7254杀掉进程，重启服务即可。

root        7253       1  0 09:58 ?        00:00:00 nginx: master process nginx
www-data    7254    7253  0 09:58 ?        00:00:00 nginx: worker process
root       10933       1  0 19:35 ?        00:00:00 nginx: master process /usr/sbin/nginx -g daemon on; master_process on;
root       10934   10933  0 19:35 ?        00:00:00 nginx: worker process
root       10948    9784  0 19:36 pts/1    00:00:00 grep --color=auto nginx

看到www-data是否熟悉下面报错三的的3的配置，因为你更改了nginx服务启动用户为user root了，但是www-data用户并不会因此停掉（依旧占用80端口），所以导致你启动报错，所以需要手动杀掉早期nginx默认的user-data用户开启的进程。

报错3

错误：Nginx 403 forbidden

原因：当Nginx读取本地目录时如果收到403错误，是由于nginx的权限问题。
解决方法：

• 1.查看/var/www/html是否设置了相应的index.html文件
• 2.设置所有父目录为755权限，设置目录下里文件为644权限就可以避免权限不正确。（ /usr,/usr/local,/usr/local/nginx,/usr/local/nginx/html的可以增加x的可执行权限）
• 3.可能是前后端分离的配置文件问题找到/etc/nginx/nginx.conf文件后找出user www-data修改改为user root即可。

修改权限（这些文件都是root的，而Nginx默认是www-data用户来运行，所以没有权限写入root的文件）：chown -R www-data:www-data /var/www/html

nginx 配置文件

以笔者阿里云的ubuntu 20.xx系统为例
安装 nginx

apt-get install nginx

如果你本机也安装了 apache2 服务你会发现和 nginx 服务的线上部署文件的默认存放在目录都是/var/www/html/目录下，一般前端打包的项目文件都放这里（访问就是公网IP加文件名的（默认端口80）即可访问网站。），当然你可以通过修改/etc/nginx/nginx.conf文件修改访问的前端打包的文件，后面的配置。

有可能你的一个项目前后端是分离的，比如笔者前端项目采用vue,后端采用Node.js，前端设置了vue.config.js文件跨域，那么就必须配置文件了。

vue.config.js配置文件`

// 注意设置了本文件需要重新 yarn run serve 启动项目
module.exports = {
    publicPath: './',
    outputDir: 'dist',
    devServer: {
        // host: 'localhost',
        // port: 8001,
        // https: false,
        // hotOnly: false,
        proxy: {
            '/api': {
                target: 'http://localhost:3000/', // 开发环境后端地址
                changeOrigin: true, // 是否跨域
                pathRewrite: {
                    '^/api': '/',
                },
            },
        },
    },
}

项目完成后yarn run build打包。
如果部署上线呢，笔者的配置/etc/nginx/nginx.conf文件如下：

下面加 # !!注 的注释自己注意下细节

#user www-data;
user root;  # !!注
worker_processes auto;
pid /run/nginx.pid;
include /etc/nginx/modules-enabled/*.conf;

events {
	worker_connections 768;
	# multi_accept on;
}

http {

	##
	# Basic Settings
	##

	sendfile on;
	tcp_nopush on;
	tcp_nodelay on;
	keepalive_timeout 65;
	types_hash_max_size 2048;
	# server_tokens off;

	# server_names_hash_bucket_size 64;
	# server_name_in_redirect off;

	include /etc/nginx/mime.types;
	default_type application/octet-stream;

	##
	# SSL Settings
	##

	ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3; # Dropping SSLv3, ref: POODLE
	ssl_prefer_server_ciphers on;

	##
	# Logging Settings
	##

	access_log /var/log/nginx/access.log;
	error_log /var/log/nginx/error.log;

	##
	# Gzip Settings
	##

	gzip on;

	# gzip_vary on;
	# gzip_proxied any;
	# gzip_comp_level 6;
	# gzip_buffers 16 8k;
	# gzip_http_version 1.1;
	# gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;

	##
	# Virtual Host Configs
	##

	#include /etc/nginx/conf.d/*.conf;
	#include /etc/nginx/sites-enabled/*;
	server {
		listen 3000;     # !!注
		server_name 这里填你的阿里云域名或者公网ip地址;  # !!注

		location / {
			root	/root/test/vue-admin/dist/;  # 自己修改打包文件的目录
			index   index.html; # 默认打开的页面
		}

		location /api/ {            # !!注 ，这里是前端vue.config.js文件的配置一样，这里有时报错可能就是忘了斜杠号
			proxy_pass  http://127.0.0.1:3000/;  # !!注 ，有时报错可能就是忘了斜杠号
		}
	}

	server {
		listen 80;
		server_name  这里填你的阿里云域名或者公网ip地址;

		location / {
			root  /var/www/html/;   # 这里也可以简写为html
			index  index.html;
		}
	}
	
	#include /etc/nginx/conf.d/*.conf;
	#include /etc/nginx/sites-enabled/*;
}


#mail {
#	# See sample authentication script at:
#	# http://wiki.nginx.org/ImapAuthenticateWithApachePhpScript
# 
#	# auth_http localhost/auth.php;
#	# pop3_capabilities "TOP" "USER";
#	# imap_capabilities "IMAP4rev1" "UIDPLUS";
# 
#	server {
#		listen     localhost:110;
#		protocol   pop3;
#		proxy      on;
#	}
# 
#	server {
#		listen     localhost:143;
#		protocol   imap;
#		proxy      on;
#	}
#}

配置好上面后测试文件是否配置正确nginx -t，通过后重启服务service nginx restart，访问你的<公网地址>:端口即可访问配置文件相应的项目。

注意访问，也要在阿里云开启相应的端口才能正常访问，当访问报错出现403就是文件权限问题，你可以设置目录权限为755但目录里面的权限设置为644才能正常访问，如chmod 644 fileName.html>