簡體   English   中英

用於預渲染Angular SPA的Nginx conf

[英]Nginx conf for prerendering Angular SPA

因此,我為Angular SPA應用程序配置了下一個配置:

server {
        listen 80;
        server_name idj.rtech.rs;
        return 301 https://example.com$request_uri;
}

server {

        listen 443 ssl; # managed by Certbot
        ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem; # managed by Certbot
        ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem; # managed by Certbot
        include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
        ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

        root /var/www/example.com/dist;

        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;

        server_name idj.rtech.rs;

        location / {

            # First attempt to serve request as file, then
            # as directory, then fall back to displaying a 404.
            try_files $uri @prerender;
        }

        location @prerender {
        #proxy_set_header X-Prerender-Token YOUR_TOKEN;

        set $prerender 0;
        if ($http_user_agent ~* "baiduspider|twitterbot|facebookexternalhit|rogerbot|linkedinbot|embedly|quora link preview|showyoubot|outbrain|pinterest|slackbot|vkShare|W3C_Validator") {
            set $prerender 1;
        }
        if ($args ~ "_escaped_fragment_") {
            set $prerender 1;
        }
        if ($http_user_agent ~ "Prerender") {
            set $prerender 0;
        }
        if ($uri ~* "\.(js|css|xml|less|png|jpg|jpeg|gif|pdf|doc|txt|ico|rss|zip|mp3|rar|exe|wmv|doc|avi|ppt|mpg|mpeg|tif|wav|mov|psd|ai|xls|mp4|m4a|swf|dat|dmg|iso|flv|m4v|torrent|ttf|woff|svg|eot)") {
            set $prerender 0;
        }

        #resolve using Google's DNS server to force DNS resolution and prevent caching of IPs
        resolver 8.8.8.8;

        if ($prerender = 1) {

            #setting prerender as a variable forces DNS resolution since nginx caches IPs and doesnt play well with load balancing
            set $prerender "service.prerender.io";
            rewrite .* /$scheme://$host$request_uri? break;
            proxy_pass $prerender;
        }
        if ($prerender = 0) {
            rewrite .* /index.html break;
        }
    }
}

但是,當我的應用程序在fb或任何社交媒體上共享時,我只是獲得靜態標簽,或者根本沒有標簽。

有人可以指出錯誤在哪里,以及我在做什么錯嗎?

我是否還應該以角度設置任何內容(動態更新標簽除外),還是僅用於nginx配置?

我也聽說過rendertron,設置起來容易嗎? 什么是nginx conf?

更新1:

所以點擊: curl http://127.0.0.1:3010/https://example.com返回了預渲染的頁面(我在端口3010上托管了預渲染)

點擊curl https://example.com會返回靜態角度。

擊中curl-“ twitterbot” https://example.com不返回任何內容。

擊中curl-“ twitterbot” -v https://example.com返回以下內容:

< HTTP/1.1 400 Bad Request
< Server: nginx/1.10.3 (Ubuntu)
< Date: Wed, 19 Sep 2018 11:16:54 GMT
< Content-Type: text/html;charset=UTF-8
< Transfer-Encoding: chunked
< Connection: keep-alive
< Vary: Accept-Encoding

在您的情況下,當try_files在$ prerender運行之前測試$ uri時,try_files可能會返回索引頁。 您可以在預配置之后將try_files移到哪里的以下配置嗎?

server {
        listen 80;
        server_name idj.rtech.rs;
        return 301 https://example.com$request_uri;
}

server {

        listen 443 ssl; # managed by Certbot
        ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem; # managed by Certbot
        ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem; # managed by Certbot
        include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
        ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

        root /var/www/example.com/dist;

        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;

        server_name idj.rtech.rs;

        location / {

            #proxy_set_header X-Prerender-Token YOUR_TOKEN;

            set $prerender 0;
            if ($http_user_agent ~* "baiduspider|twitterbot|facebookexternalhit|rogerbot|linkedinbot|embedly|quora link preview|showyoubot|outbrain|pinterest|slackbot|vkShare|W3C_Validator") {
                set $prerender 1;
            }
            if ($args ~ "_escaped_fragment_") {
                set $prerender 1;
            }
            if ($http_user_agent ~ "Prerender") {
                set $prerender 0;
            }
            if ($uri ~* "\.(js|css|xml|less|png|jpg|jpeg|gif|pdf|doc|txt|ico|rss|zip|mp3|rar|exe|wmv|doc|avi|ppt|mpg|mpeg|tif|wav|mov|psd|ai|xls|mp4|m4a|swf|dat|dmg|iso|flv|m4v|torrent|ttf|woff|svg|eot)") {
                set $prerender 0;
            }

            #resolve using Google's DNS server to force DNS resolution and prevent caching of IPs
            resolver 8.8.8.8;

            if ($prerender = 1) {

                #setting prerender as a variable forces DNS resolution since nginx caches IPs and doesnt play well with load balancing
                set $prerender "service.prerender.io";
                rewrite .* /$scheme://$host$request_uri? break;
                proxy_pass $prerender;
            }

            try_files $uri $uri/ =404;
        }
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM