如何通过Azure Verizon Premium CDN从Azure Blob提供带有路由的Angular 2 SPA

Question

此处没有足够的关于重写规则的文档https://docs.microsoft.com/en-us/azure/cdn/cdn-rules-engine-reference-features。还需要4个小时才能刷新，因此尝试各种正则表达式组合是不切实际的。

我在Azure Blob上托管了一个Angular 2单页应用程序（英雄示例应用程序），并希望从Azure CDN提供它。但是，Angular 2路由需要特殊处理，即重写到index.html的路由。这是我使用NGINX代理的工作示例。如何将其翻译为Azure Verizon Premium CDN？

# Filename: /etc/nginx/nginx.conf
http {
    ...
    rewrite_log on;

    server {
        listen       80;
        server_name  www.heroes.com;

        proxy_connect_timeout       600;
        proxy_send_timeout          600;
        proxy_read_timeout          600;
        send_timeout                600;

        location / {
            error_log /var/log/nginx/rewrite.log notice;
            rewrite '^(\/(\w+))*\/?(\.\w{5,})?\??([^.]+)?$' /heroes/index.html break;
            proxy_pass https://xxxxxx.blob.core.windows.net/heroes/;
            proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header        X-Forwarded-Proto https;

        }
    }
}

Answer 1

您可以使用存储帐户上的“静态网站”选项在Azure静态网站上使用angular 2+。无需重写规则。

请确保同时添加“ index.html”作为“索引文档名称”和“错误文档路径”（否则刷新或初始请求将失败）