Angular部署至Nginx、Tomcat，及性能分析

Angular部署至Nginx、Tomcat，及性能分析

打包Angular工程

ng build --prod

工程目录下的dist是构建后的代码

部署至Nginx

将dist中的代码复制到一个指定目录，例如

linux：/usr/local/ngweb

windows: D:/ngweb/

修改nginx/conf/nginx.conf

server{
	listen 80;
	server_name  localhost;
	location / {
	    root   /usr/local/ngweb/;
	    index  index.html;
    	try_files $uri $uri/ /index.html;
    }
}

try_files $uri $uri/ /index.html; 若找不到匹配路径则匹配/index.html

启动nginx

    /usr/local/nginx/sbin/nginx

重启nginx

    /usr/local/nginx/sbin/nginx -s reload

部署至Tomcat

修改app.routing.module.ts，使用useHash，如果不设置的话，在路由地址发生变化后刷新页面会导致404错误

    @NgModule({
        imports: [RouterModule.forRoot(routes, { useHash: true })],
        exports: [RouterModule]
    })

将dist中的代码复制到 tomcat/webapps/ROOT/ 下,默认端口为8080

若需要将端口修改为80则在 tomcat/conf/server.xml 中设置

<Connector port="80" protocol="HTTP/1.1" connectionTimeout="20000" redirectPort="8443" />

启动tomcat

    sh /usr/local/tomcat/bin/startup.sh

停止tomcat

    sh /usr/local/tomcat/bin/shutdown.sh

性能对比

• 环境：1核2G内存Centos7 (VMWare)、Nginx(1.15.8)、Tomcat(7.0.65)
• 工具： Apache-JMeter

100并发

Nginx

Tomcat

200并发

Nginx

Tomcat

500并发

Nginx

Tomcat

通过对比，Nginx在高并发下性能较Tomcat更好