关于angularjs:如何通过prerender.io的nginx结果进行缓存

how caching via nginx result of prerender.io

我们有一个前端带有angular的网站,需要为搜索机器人和其他应用程序(如Skype)进行渲染,以便可以预览页面。
我们使用nginx,该设置用于将从bot到Prorender的请求转发到服务器上。但是在那种情况下,预渲染一页大约需要15秒。

所以,问题是预渲染的设置缓存结果如何?

我已经尝试过:
将用于缓存的设置放入frontend.conf

1
2
3
4
5
6
7
8
9
10
11
12
13
proxy_cache_path  /var/lib/nginx/cache  levels=1:2    keys_zone=STATIC:10m max_size=1G;
proxy_temp_path /var/lib/nginx/proxy 1 2;

server {

location @prerender {
.....................
proxy_cache            STATIC;
proxy_cache_valid      1d;
if ($prerender = 1) {
rewrite .* /$scheme://$host:$server_port$request_uri? break;
proxy_pass http://10.0.2.2:3000;
}}}

运行prerender.io的10.0.2.2服务器

然后我尝试通过另一个nginx来执行此操作,该设置类似于cache-proxy。在frotnend.conf中,我注释了所有缓存设置,并将它们放入其他nginx中。但是我仍然有同样的问题,页面渲染需要15秒,nginx不会进行任何缓存。

UDP。

我尝试了nginx的另一种配置,但是仍然有问题。
架构看起来像

1
web-browser(http://myapp.local) > |AppServer(frontend) is a virtual Server|(proxy_pass) > to > |nginx with proxy cache| > to > |prerender|

proxy-cache.conf

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
proxy_cache_path  /var/lib/nginx/cache  levels=1:2    keys_zone=STATIC:10m max_size=1G;
proxy_temp_path /var/lib/nginx/proxy 1 2;
server {
..............................
    location / {

            proxy_cache            STATIC;
            proxy_ignore_headers Cache-Control;
            proxy_ignore_headers X-Accel-Expires;
            proxy_ignore_headers Expires;
            proxy_cache_methods GET;
            proxy_cache_valid      any  1d; # 200
                    #proxy_cache_key $host$uri$is_args$args;

            proxy_cache_use_stale  error timeout invalid_header updating http_500 http_502 http_503 http_504;

    proxy_pass http://127.0.0.1:3000;
    }}

然后我配置缓存的日志记录。当我向日志中的服务器发出请求时,得到以下信息:

1
2
3
4
GET /http://myweb.local:80/ HTTP/1.0"302" 20"-""10.0.2.2""skype""-""MISS""127.0.0.1:3000""0.388""0.389"
GET /http://myweb.local:80/en/ HTTP/1.0"200" 14685"-""10.0.2.2""skype""-""MISS""127.0.0.1:3000""1.261""1.263"
GET /http://myweb.local:80/ HTTP/1.0"302" 20"-""10.0.2.2""skype""-""HIT""-""-""0.001"
GET /http://myweb.local:80/en/ HTTP/1.0"200" 14689"-""10.0.2.2""skype""-""MISS""127.0.0.1:3000""1.249""1.251"

在预渲染日志中:

1
2
3
4
2016-06-15T14:05:57.880Z getting http://myweb.local:80/en/
2016-06-15T14:05:59.131Z got 200 in 1251ms for http://myweb.local:80/en/
2016-06-15T14:06:00.332Z getting http://myweb.local:80/en/
2016-06-15T14:06:01.885Z got 200 in 1553ms for http://myweb.local:80/en/

我解决了这个问题。它需要添加另一个对标头的忽略proxy_ignore_headers Set-Cookie; 。因此,通过nginx进行缓存预渲染的配置将是:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
proxy_cache_path  /var/lib/nginx/cache  levels=1:2    keys_zone=STATIC:10m inactive=24h  max_size=2g;

server {
.......................
location / {
            try_files $uri @prerender;
    }
     location @prerender {
            set $prerender 0;
.......................
            proxy_cache            STATIC;
            proxy_cache_valid    any 1d;
            proxy_ignore_headers Cache-Control;
            proxy_ignore_headers X-Accel-Expires;
            proxy_ignore_headers Set-Cookie;
            proxy_ignore_headers Expires;
            proxy_cache_key $host$uri$is_args$args;
            proxy_cache_use_stale  error timeout invalid_header updating http_500 http_502 http_503 http_504;

            if ($prerender = 1) {
                    rewrite .* /$scheme://$host:$server_port$request_uri? break;
                    proxy_pass http://10.0.2.2:3000;
            }

向预渲染服务器本身添加缓存是相当容易的,s3和内存缓存可以直接使用。

如果您需要使用nginx来处理缓存,我认为将其放在问题标题中的机会更大。