Nginx启动Web项目（基础）

以前前后端没有分离的时候，项目启动前后端就一起启动了，现在前后端分离，服务端和页面分开部署。用nginx启动web页面项目。

1、前提：启动服务端，比如服务器端为127.0.0.1:8080，然后所有接口都是以/api开头的，比如登录接口，127.0.0.1:8080/api/login

2、将前端开发好的页面解压，放到一个指定目录下，我这边解压好的目录结构是这样的，index.html是首页

 3、下载nginx，地址：http://nginx.org/en/download.html，我用的是1.16.1，解压后放到你合适的电脑位置

 

 4、在C:\Windows\System32\drivers\etc目录下的hosts文件，以管理员权限打开，在下面添加127.0.0.1 testhosts.com

4.1、配置nginx，在conf/nginx.conf目录里面配置。主要就是配置upstream，server里面的listen、server_name、root、location

events {
    worker_connections  1024;
}

http {
    include       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  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;
    tcp_nopush          on;
    tcp_nodelay         on;
    types_hash_max_size 2048;
    client_max_body_size 20M;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    gzip  on;
	
    upstream localserver {
        #这里配置服务器的地址，刚才我们启动的是8080端口，localserver是我们自定义取的名称，可以更换成其它的名称，注意不要和nginx本身的一些名词冲突就行
	server 127.0.0.1:8080;
    }


    server {
        listen 9999;#这里是nginx监听的端口，就是一会儿浏览器打开的端口，访问的时候用http://testhosts.com:9999，如果这个地方改成80端口，那么就只需要用http://testhosts.com访问就行，多个server可以同时监听80端口，然后代理域名用不同的名字就行
        server_name  testhosts.com;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;
		
	root D:\plugins\product_page\dist;#这里是前端页面的根路径
	location / {
            
            index  index.html index.htm;
        }
		
	location ^~/api/ {#这里表示浏览器所有以/testhosts.com:9999/api开头的请求，经过nginx代理，到服务器都用localserver/api/请求，实际localserver就是上面我们配置服务器地址
	　　proxy_pass  http://localserver/api/;
        }
		
}
        

5、启动nginx.exe

6、访问页面，在浏览器输入testhosts:9999，访问成功。停止nginx的时候，需要启动任务管理器结束进程