Laravel + AngularJS 将路由传递到 Angular

问题描述 投票:0回答:2

我正在尝试使用 Laravel 中的 RESTful API 和 Angular 中的富客户端来编写应用程序。顺便说一句,这效果很好。 Laravel 执行初始路由并启动 Angular 客户端,然后发现它需要身份验证并重定向到

/login
。从这里开始,它是纯粹的客户端通过 REST 与后端异步通信。如果你问我的话,很漂亮。然而;如果用户在某个时刻想要刷新浏览器,或者将 URL 作为链接发送给某人 - 它就会中断。不好!

例如,在

/signup/
上刷新,将导致 Laravel 首先捡起球并通过

重定向到默认路线

start/global.php

App::error(function(NotFoundHttpException $exception, $code) {
    $allowed = array("api","css","fonts","html","img","js");
    if(0 == count(array_intersect(array_map('strtolower', explode(' ', Request::path())), $allowed))) {
        return Redirect::route('home');
    }
});

这导致我迷失了用户最初想要到达的地方。一旦 Angular 获得控制权,原来的路线就会丢失,它只能再次呈现

/login
。我猜如果我在 .htaccess 中做一些魔法,我可能会丢失错误处理程序,该处理程序目前由标准 HTML5 样板 .htaccess +

保存
<IfModule mod_rewrite.c>
    Options +FollowSymlinks
    Options -MultiViews
  # Options +SymLinksIfOwnerMatch
    IndexIgnore */*

    RewriteEngine On
    RewriteBase /

    # If a directory or a file exists, use it directly
    RewriteCond %{REQUEST_FILENAME} -s [OR]
    RewriteCond %{REQUEST_FILENAME} -l [OR]
    RewriteCond %{REQUEST_FILENAME} -d
    RewriteRule ^.*$ - [NC,L]

    # Otherwise forward it to index.php
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^(.*)$ index.php [L,QSA]
</IfModule>

.htaccess 和 Apache 配置对我来说是一个大黑洞。我觉得它一点也不直观。

对于在 Laravel 上运行的单页应用程序,如何确保用户在刷新或直接启动 URL 时获得正确的角度视图?

php angularjs laravel .htaccess
2个回答
2
投票

如果我正确理解你的问题,我就是这样做的:

我将所有 Laravel 的 RESTful API 路由分组到

/api/
目录下,如下所示:

Route::group(array('prefix' => 'api'), function()
{
    Route::resource('users', 'UsersController');
    Route::resource('products', 'ProductController');
    ...
}

这个目录当然可以被称为任何名称。但重要的是,这意味着你可以将 Angular 路由与 Laravel 的 API 路由分开,只要用户不尝试直接访问

/api/
目录即可。

这将释放 Angular 处理的所有其他路由。这是我的 Laravel

routes.php
文件的其余部分的样子:

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

// catch-all -- all routes that are not index or api will be redirected
App::missing(function()
{
    return View::make('index'); // should also redirect to AngularJS
}

最后一个功能很重要。以您的用例为例,如果用户要在

/signup/
上刷新,那么 Laravel 会简单地将路由传递到 Angular(索引页面),Angular 反过来会检测其路由之间的匹配并将用户发送到预期的位置页。如果用户尝试导航到不存在的页面,例如
/nothingtoseehere/
,则会发生完全相同的情况 - 它们只会被发送到索引页面。从这里你可以使用 Angular 处理错误。

希望这有点用。


0
投票

已修复! :-)

由于我通常只想在服务器上找不到路由时将请求转发到 Angular,因此我只调用应用程序仅视图创建控制器。

start/global.php

App::error(function(NotFoundHttpException $exception, $code) {
    $allowed = array("api","css","fonts","html","img","js","scripts");
    if(0 == count(array_intersect(array_map('strtolower', explode(' ', Request::path())), $allowed))) {
        // Only return the view response if the request does not specifically ask for a json response.
        if (!Request::wantsJson()) {
            // Instead of performing a redirect here, pretend everything is 
            // normal and act as if the 'home' route has been called.
            $controller = new HomeController();
            return $controller->callAction('getHome', array());//Redirect::route('home');
        }
    }
});

可能是一个肮脏的黑客行为,但如果没有人提出更好的解决方案,我会将其标记为解决方案。 :-)

© www.soinside.com 2019 - 2024. All rights reserved.