基于Auth的Angular SSR或CSR的Docker和Nginx配置

时间:2019-06-05 20:49:12

标签: angular nginx docker-compose ssr

我正在尝试在低性能的硬件上使用nginx和docker配置SEO友好的Angular应用程序。想法是对未经授权的用户使用带有主动缓存的SSR,而对授权的用户使用CSR。

我已经设计了下一个docker容器layot及其连接性: enter image description here 该架构包含后端,Fornted和Nginx Docker容器。前端容器还公开了Angular的文件,以使Nginx将它们作为静态服务器保存以节省CPU。 要检测用户是否已通过身份验证,我正在检查XSRF-TOKEN cookie。

生成的nginx配置为:

    worker_processes auto;

    events {
      worker_connections 768;

    }

    http {

      access_log /etc/nginx/access_log.log;
      error_log /etc/nginx/error_log.log debug;


      client_max_body_size 20m;

      proxy_cache_path /etc/nginx/cache keys_zone=one:500m max_size=1000m;

      sendfile on;

      map $http_cookie $authTokenExists {
          default               "noToken";
          "~*XSRF-TOKEN=[^;]+"  "hasToken";
      }

      server {
        server_name myapp.com www.myapp.com;

        proxy_cache one;
        proxy_cache_key $request_method$request_uri;
        proxy_cache_min_uses 1;
        proxy_cache_methods GET;
        proxy_cache_valid 200 1m;

        listen [::]:444 http2 ssl;
        listen 444 http2 ssl;


        include /etc/nginx/mime.types;

        keepalive_timeout   70;
        ssl_certificate /etc/ssl/certs/myapp.com.crt;
        ssl_certificate_key /etc/ssl/private/myapp.com.key;

        gzip on;
        gzip_disable "msie6";
        gzip_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript image/svg+xml font/woff2;


        root /dist/browser/;

        location ~* \.(css|js|gif|jpe?g|png|svg)$ {

            add_header DebugAddCacheParamsToStatic true;

            expires 1M;
            add_header Pragma public;
            add_header Cache-Control "public, must-revalidate, proxy-revalidate";
        }

        location ~* \.(css|js|gif|jpe?g|png|svg)$ {

            add_header DebugServeStatic true;

            try_files $uri $uri/;
        }

        location / {

            add_header DebugRewriteToHasOrNoToken true;

            rewrite (.*) /$authTokenExists$1 last;
        }

        location /hasToken {

            add_header DebugServeHasToken true;

            rewrite /hasToken/(.*) /$1  break;

            try_files $uri $uri/ /index.html;

            http2_push /api/events;
        }

        location /noToken {

            add_header DebugServeNoToken true;

            rewrite /noToken/(.*) /$1  break;

            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header X-Forwarded-Port 444;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

            proxy_pass  http://myapp-frontend:4000;
        }

        location /api {

            add_header DebugServeApi true;

            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header X-Forwarded-Port 444;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

            proxy_pass  http://myapp-backend:8080/api;
        }

        location /login {

            add_header DebugServeLogin true;

            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header X-Forwarded-Port 444;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $http_host;

            proxy_pass  http://myapp-backend:8080/login;
        }
      }
    }

该架构伪装成可以正常工作,但我不确定它是否真的支持PROD。可以简化它还是以某种方式使其更稳定?

0 个答案:

没有答案