加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

Laravel 4作为RESTful后端的AngularJS

发布时间:2020-12-17 08:09:49 所属栏目:安全 来源:网络整理
导读:我正在尝试构建一个Web应用程序,它应该在客户端使用Laravel作为RESTful后端API和AngularJS。 我在Stackoverflow上发表了关于这个问题的所有其他帖子,但是没有人肯定会回答我的疑惑,至少我没有找到一个明确的源代码示例。 例如… 我应该开发两个完全不同的
我正在尝试构建一个Web应用程序,它应该在客户端使用Laravel作为RESTful后端API和AngularJS。
我在Stackoverflow上发表了关于这个问题的所有其他帖子,但是没有人肯定会回答我的疑惑,至少我没有找到一个明确的源代码示例。

例如…

我应该开发两个完全不同的应用程序,后端与Laravel和另一个纯粹的客户端,AngularJS?
但在这种情况下:如何通过单个域(或虚拟主机)来处理它们?

或者我应该在Laravel中创建AngularJS模板,在“views”文件夹中,从他们那里调用Laravel服务?我怀疑这是最好的方法:在这种情况下,后端并不能完全脱离前端实现。

另外,如何正确处理路由?我的意思是:我想从AngularJS路线管理菜单/页面导航,只需要调用Laravel来检索数据并填充我的意见。
按照这篇文章(Angular JS + Laravel 4: How to compile for production mode?)的建议移动“公共”文件夹可能有帮助吗?

Thanx提前提出建议,例子…

最后,我发现一个工作的解决方案,在我的场景中完美,不需要一个子域名。
在这种情况下,Laravel独家作为RESTful Web服务,无服务器端视图或模板:表示层完全需要AngularJS。

假设我有两个完全解耦的应用程序(FE e WS)在同一根文件夹中:

root
|__fe
|__ws

我在Apache httpd-vhosts.conf文件下修改了虚拟主机设置,方法如下:

<VirtualHost *:80>
    ServerName myapp.com
    DocumentRoot "wwwrootfe"

    alias /ws "wwwrootwspublic"
    <Directory "wwwrootwspublic">
        Options Indexes FollowSymLinks MultiViews
        AllowOverride all
            Order allow,deny
        Allow from all
    </Directory>
</VirtualHost>

然后我将“RewriteBase / ws”添加到我的laravel / public / .htacces文件中:

<IfModule mod_rewrite.c>
    Options -MultiViews
    RewriteEngine On

    RewriteBase /ws

    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [NC,L]
</IfModule>

这样我可以在浏览器中写(例如):

http://myapp.com             (AngularJS client side root)
http://myapp.com/ws/users    (RESTful service endpoint for "users")

然后定义一个客户端,AngularJS路由如下:

app.config(function($routeProvider) {
    $routeProvider
        .when('/',{controller: 'HomeController',templateUrl: 'templates/home.html'})
        .when('/users',{controller: 'UsersController',templateUrl: 'templates/users.html'})
        .otherwise({redirectTo: '/'});
});

通过这种方式将其链接到RESTful资源:

app.factory('User',function($resource) {
    return $resource('http://myapp.com/ws/users');
});

app.controller('UsersController',function($scope,User) {
    $scope.title = "Users";
    $scope.users = User.query();
});

我启用了HTML5历史记录API,添加此行来配置我的Angular应用程序:

$locationProvider.html5Mode(true);

与(在index.html头部分内)一起)

<base href="/" />
<meta name="fragment" content="!" />

因此,解决诸如浏览器页面刷新,深层链接或直接页面书签等问题的最后一个要求是将.htaccess文件添加到包含Angular应用程序的文件夹的根目录中:

<IfModule mod_rewrite.c>
    Options -MultiViews
    RewriteEngine On

    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.html [NC,L]
</IfModule>

希望有帮助!

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读