Angular、Laravel 4 和 MySQL 数据库最佳实践

Posted

技术标签:

【中文标题】Angular、Laravel 4 和 MySQL 数据库最佳实践【英文标题】:Angular, Laravel 4 and MySQL database best practices 【发布时间】:2013-10-30 16:44:30 【问题描述】:

我对 Angular 很陌生,并且对 Laravel 4 有一些经验。 我正在构建一个应用程序,用户可以在其中“即时”编辑,但也可以保存到 mysql

最初的计划是使用 Angular 来管理实时编辑,并使用 Eloquent 将数据存储和检索到 MySQL DB。我知道您可以通过 Angular 连接到 DB,但我想知道最好的解决方案是什么。

最好是分开还是使用 Angular? 如果对所有事情都使用 Angular,会不会出现一些性能问题? Angular 是否像 Eloquent 一样易于用于 DB 交互? 如果我使用 Eloquent for DB,是否可以直接将数据传递给 Angular?

我已经开始使用 Angular 构建应用程序的实时编辑部分,我不得不说我发现它非常容易学习并且非常强大。我现在必须决定如何处理存储。

谢谢

【问题讨论】:

任何人都可以提到使用一个来对抗另一个的 + 和 - 吗?看来我可以使用 Laravel 和 jQuery 做任何我想做的事情。我想知道将 Angular 用于业务逻辑和数据库交互是否有优势? 【参考方案1】:

查看伟大的 Dave Mosher 的本教程,我认为它可能正是您正在寻找的,他使用 Laravel、Angular 和 MySQL:

Youtube 截屏:http://www.youtube.com/watch?v=hqAyiqUs93c

源码:https://github.com/davemo/end-to-end-with-angularjs

【讨论】:

谢谢,现在看看【参考方案2】:

使用 angular.js 和 laravel 的最佳方式是使用 REST API。

例如,如果您有一个管理面板来管理用户,那么方法将是,

在你的路线中,

Route::resource('users', 'UsersController');

控制器长这样,

<?php

/**
*
* Users  Controller
* 
*/

class UsersController extends AdminController 

    /**
     * Display all users.
     *
     * @return Response
     */

    public function index() 

        $users = User::where('id', '!=', Auth::user()->id)->get();

        return Response::json(array(
            'status' => 'success',
            'users' => $users->toArray()),
            200
        );

    


    /**
     * Show the form for creating a new resource.
     *
     * @return Response
     */

    public function create() 
        //
    

    /**
     * Store a newly created resource in storage.
     *
     * @return Response
     */

    public function store() 
        // add some validation also
        $input = Input::all();

        $user = new User;

        if ( $input['name'] ) 
            $user->name = $input['name'];
        
        if ( $input['username'] ) 
            $user->username = $input['username'];
            $user->password = Hash::make($input['username']);
        
        if ( $input['email'] ) 
            $user->email = $input['email'];
        


        $user->save();

        return Response::json(array(
            'status' => 'success',
            'users' => $user->toArray()),
            200
        );
    

    /**
     * Display the specified resource.
     *
     * @param  int  $id
     * @return Response
     */

    public function show($id) 
        $user = User::where('id', $id)
                    ->take(1)
                    ->get();

        return Response::json(array(
            'error' => false,
            'users' => $user->toArray()),
            200
        );
    

    /**
     * Show the form for editing the specified resource.
     *
     * @param  int  $id
     * @return Response
     */

    public function edit($id) 
        //
    

    /**
     * Update the specified resource in storage.
     *
     * @param  int  $id
     * @return Response
     */

    public function update($id) 
        // add some validation also
        $input = Input::all();

        $user = User::find($id);

        if ( $input['name'] ) 
            $user->name = $input['name'];
        
        if ( $input['username'] ) 
            $user->username = $input['username'];
        
        if ( $input['email'] ) 
            $user->email = $input['email'];
        


        $user->save();

        return Response::json(array(
            'status' => 'success',
            'message' => 'User Updated'),
            200
        );
    

    /**
     * Remove the specified resource from storage.
     *
     * @param  int  $id
     * @return Response
     */

    public function destroy($id) 
        $user = User::find($id);

        $user->delete();

        return Response::json(array(
            'status' => 'success',
            'message' => 'User Deleted'),
            200
        );
    


然后是脚本,

var app = angular.module('myApp', []);
// include this in php page to define root path
app.factory('Data', function()
    return 
        root_path: "<?php echo Request::root(); ?>/"
    ;
);

GET - 获取所有用户

$http(method: 'GET', url: Data.root_path + 'users').
success(function(data, status, headers, config) 
    $scope.users = data.users;
).
error(function(data, status, headers, config) 
    $scope.users = [];
);

GET - 获取单个用户进行编辑

$http(method: 'GET', url: Data.root_path + 'users/'+id).
success(function(data, status, headers, config) 
    $scope.entry = data.users[0];
).
error(function(data, status, headers, config) 
    $scope.entry = [];
);

PUT - 更新单个用户

$http.put(Data.root_path + 'users/'+entry.id, entry).
success(function(data, status, headers, config) 
    //
).
error(function(data, status, headers, config) 
    //
);

POST - 保存新用户

$http.post(Data.root_path + 'users', entry).
success(function(data, status, headers, config) 
    //
).
error(function(data, status, headers, config) 
    //
);

DELETE - 删除用户

$http.delete(Data.root_path +'users/'+id)
.success(function(response)  
    //
)
.error(function(response) 
    //
);

【讨论】:

在这种情况下,您认为在业务逻辑上使用 Angular 比 Laravel 有什么优势吗?你认为它会平衡服务器和客户端之间的负载吗? 我对用于制作自定义灵活框架的 Laravel 4 + Angular JS 感觉很好。【参考方案3】:

创建 RESTful 端点以使用 Laravel 管理资源。正如已经指出的,这对于资源控制器来说非常简单:

Route::resource('user', 'UsersController');

然后您使用 AngularJS 资源与之交互。获取用户、编辑模型然后保存(通过回调中的 $ 调用)的示例(来自文档)。

var User = $resource('/user/:userId', userId:'@id');
var user = User.get(userId:123, function() 
  user.abc = true;
  user.$save();
);

http://docs.angularjs.org/api/ngResource.$resource

更好的是,为资源创建一个 Angular JS 服务,这样您就可以将其注入多个控制器并获取所有定义的方法。

这是一篇关于如何设置的精彩帖子:

http://blog.brunoscopelliti.com/building-a-restful-web-service-with-angularjs-and-php-more-power-with-resource

【讨论】:

以上是关于Angular、Laravel 4 和 MySQL 数据库最佳实践的主要内容,如果未能解决你的问题,请参考以下文章

Laravel 4 + Angular 身份验证路由

Laravel 4 和 Angular JS 和 Twitter Bootstrap 3 分页

如何将 Laravel 5.4 与 Angular 4 集成

使用 laravel 和 Angular 4 问题通过 API 在数据库中保存文件

为啥这个 Angular 脚本无法检索 Laravel 4 生成的 JSON?

使用“multipart/form-data”时,Laravel 4 未收到 Angular $http PUT 数据