Create a restful application with AngularJS and Zend 2 framework

最新推荐文章于 2024-08-11 23:25:41 发布

weixin_34150503

最新推荐文章于 2024-08-11 23:25:41 发布

阅读量86

点赞数

文章标签： php 数据库 json

原文链接：https://my.oschina.net/hantsy/blog/177297

版权

为什么80%的码农都做不了架构师？>>>

#Create a restful application with AngularJS and Zend 2 framework

This example application uses AngularJS/Bootstrap as frontend and Zend2 Framework as REST API producer.

##The backend code

This backend code reuses the database scheme of the official Zend Tutorial, and gets REST API support from the Zend community.

Zend2 provides a AbstractRestfulController for RESR API producing.

<pre> class AlbumController extends AbstractRestfulController { public function getList() { $results = $this->getAlbumTable()->fetchAll(); $data = array(); foreach ($results as $result) { $data[] = $result; } return new JsonModel(array( 'data' => $data) ); } public function get($id) { $album = $this->getAlbumTable()->getAlbum($id); return new JsonModel(array("data" => $album)); } public function create($data) { $data['id']=0; $form = new AlbumForm(); $album = new Album(); $form->setInputFilter($album->getInputFilter()); $form->setData($data); $id=0; if ($form->isValid()) { $album->exchangeArray($form->getData()); $id = $this->getAlbumTable()->saveAlbum($album); }else { print_r( $form->getMessages()); } return new JsonModel(array( 'data' => $id, )); } public function update($id, $data) { $data['id'] = $id; $album = $this->getAlbumTable()->getAlbum($id); $form = new AlbumForm(); $form->bind($album); $form->setInputFilter($album->getInputFilter()); $form->setData($data); if ($form->isValid()) { $id = $this->getAlbumTable()->saveAlbum($form->getData()); } return new JsonModel(array( 'data' => $id, )); } public function delete($id) { $this->getAlbumTable()->deleteAlbum($id); return new JsonModel(array( 'data' => 'deleted', )); } protected $albumTable; public function getAlbumTable() { if (!$this->albumTable) { $sm = $this->getServiceLocator(); $this->albumTable = $sm->get('Album\Model\AlbumTable'); } return $this->albumTable; } } </pre>

The naming convention of the methods for REST API is listed in the following table.

<table> <thead> <tr><td>URL</td><td>HTTP Method</td><td>Controller Method</td><td>Description</td></tr> </thead> <tbody> <tr><td>/albums</td><td>GET</td><td>getList</td><td>Get the list of Albums</td></tr> <tr><td>/albums</td><td>POST</td><td>create</td><td>Create a new Album</td></tr> <tr><td>/albums/:id</td><td>GET</td><td>get</td><td>Get the details of a Album</td></tr> <tr><td>/albums/:id</td><td>PUT</td><td>udpate</td><td>Update a Album by id</td></tr> <tr><td>/albums/:id</td><td>DELETE</td><td>delete</td><td>Delete a Album by id</td></tr> </tbody> </table>

Besides the naming convention, you have to set the routing rule to make it work.

Change the content of module/Album/config/module.config.php to the following.

<pre> <?php return array( 'controllers' => array( 'invokables' => array( 'Album\Controller\Album' => 'Album\Controller\AlbumController', ), ), // The following section is new and should be added to your file 'router' => array( 'routes' => array( 'album' => array( 'type' => 'segment', 'options' => array( 'route' => '/albums[/:id]', 'constraints' => array( 'id' => '[0-9]+', ), 'defaults' => array( 'controller' => 'Album\Controller\Album' ), ), ), ), ), 'view_manager' => array( 'strategies' => array( 'ViewJsonStrategy', ), ), ); </pre>

For producing REST API, it needs render a JSON view instead of the HTML view.

The frontend AngluarJS pages

It is very similar with the before AngularJS CakePHP application and AngularJS Grails application.

I do not want to duplicate the codes in this post, please checkout the codes github.com.

https://github.com/hantsy/angularjs-zf2-sample

Run the application

Clone the source from github.com.

<pre> git clone https://github.com/hantsy/angularjs-zf2-sample </pre>

Run php composer.phar install to install the depencies automaticially. This applicalication also used Composer to manage the dependencies.

Create a vhost setting in Apache for this application, set the value of the DocumentRoot is <your application path>/public.

<pre> <VirtualHost *:80> ServerName zf2-tutorial.localhost DocumentRoot E:/MyWorks/hantsy-labs/angularjs-zf2-sample/public SetEnv APPLICATION_ENV "development" <Directory E:/MyWorks/hantsy-labs/angularjs-zf2-sample/public> DirectoryIndex index.php AllowOverride All Order allow,deny Allow from all </Directory> </VirtualHost> </pre>

Change the database setting(username and password) in the config/autoload/local.php.

<pre> return array( 'db' => array( 'username' => 'root', 'password' => '', ), ); </pre>

Start apache server.

Open browser, navigate to http://zf2-tutorial.localhost/app/index.html#/albums.

albums