带有 AngularJS html5Mode 的流明会导致重新加载问题答案

【问题标题】：Lumen with AngularJS html5Mode causes reload issue带有 AngularJS html5Mode 的流明会导致重新加载问题
【发布时间】：2016-03-06 02:05:13
【问题描述】：

我们有一个带有 AngularJS 前端的 Lumen 应用程序。我们正在使用前端路由，并通过将 html5Mode 设置为 true 来删除 url 中的主题标签。

问题是，当我们尝试重新加载页面或输入不带标签的地址时，我们会收到错误：

NotFoundHttpException in Application.php line 1244

在我们的 nginx 配置文件中，我们有这一行（我们使用 prerender.io 来缓存我们的页面以进行 SEO）：

location / {
    try_files $uri $uri/ /index.php?$query_string @prerender;

@prerender 看起来像这样（我从 prerender.io 中删除了我的令牌）：

location @prerender {
    proxy_set_header X-Prerender-Token MY-TOKEN-IS-HERE;

    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)") {
        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 http://$prerender;
    }
    if ($prerender = 0) {
        rewrite .* /index.html break;
    }
}

注意：最后一个 if 表示“/index.html”。我已经用“/index.php”试过了。当我这样做时会发生什么，index.php 文件只是被客户端下载，就好像它是一个下载文件一样。

任何解决重新加载问题的帮助将不胜感激。如果您需要任何其他信息，请告诉我。

【问题讨论】：

您的预渲染似乎有问题，但这里没有足够的代码可以肯定地说。
我添加了@prerender 部分，以防它出现问题，就像你说的那样。这是来自 prerender.io 的主要文件

标签： angularjs laravel nginx lumen prerender

【解决方案1】：

我从这个问题得到了答案： Laravel 5 + AngularJS html5Mode

这个问题是针对 Laravel 的，但如果你稍微改变一下，答案就适用于 Lumen。

上面答案中的 Laravel 路由如下所示：

Route::get('/', function () { 
    return View::make('index'); 
});


Route::get('{all}', function () { 
    return View::make('index'); 
});

虽然我的 Lumen 路线是这样的：

$app->get('/', 'AppController@index');
$app->get('{all}', 'AppController@index');

如果你不想，显然你不必进入控制器，但我就是这样设置的。

【讨论】：