はじめてのSymfony4 + Vue.js

3. Symfonyのコントローラ作成

2018年07月05日 by unio

Controllerの作成

まずはsrc/Controller/配下にTutorialController.phpファイルを作成してください。
src/Controller/TutorialController.php
            
                <?php
                namespace App\Controller;

                use Symfony\Bundle\FrameworkBundle\Controller\Controller;
                use Symfony\Component\HttpFoundation\Response;
                use Symfony\Component\Routing\Annotation\Route;

                /**
                 * @Route("/tutorial")
                 */
                class TutorialController extends Controller
                {
                    /**
                     * @Route("/index", name="tutorial_index", methods="GET")
                     */
                    public function index(): Response
                    {
                        $html = <<<HTML
                <!DOCTYPE html>
                <html>
                <head><title>チュートリアル</title></head>
                <body>はじめてのSymfony4 + Vue.js</body>
                </html>
                HTML;

                        return new Response($html);
                    }
                }
            
        
Controllerを用意できたらビルトインウェブサーバを動かしてみましょう。 ビルトインウェブサーバはbin/consoleserver:startで動作します。 (停止する場合はserver:stopを実行してください)
            
                bin/console server:start
                 [OK] Server listening on http://127.0.0.1:8000
            
        
http://localhost:8000/tutorial/indexにアクセスするとWebページが表示されます。
Route設定
コントローラにRoute設定を行うことで、実際のURLとしてページにアクセスすることができます。 今回は@Routeアノテーションを利用しましたが、config/routes.yamlでも設定できます。
                        
                            /**
                             * @Route("/tutorial")
                             */
                            class TutorialController extends Controller
                            {
                                /**
                                 * @Route("/index", name="tutorial_index", methods="GET")
                                 */
                                public function index(): Response
                        
                    
このようにクラスと関数両方にアノテーションを設定することで、URLに階層構造を持たせることができます。 クラスは"/tutorial"でコントローラは"/index"なので、URLのパスは/turorial/indexとなります。 また、下記コードのようにパス以外のプロパティも設定できます。
                        
                            /**
                             * @Route("/index", name="tutorial_index", methods="GET")
                             */
                        
                    
プロパティ 概要
name Route名。twigやその他URLを生成するときの参照名として使える。
methods 受け付けることのできるHTTPメソッドの種類。
ビルトインウェブサーバ
PHPには標準でビルトインウェブサーバが実装されています。 ApacheやNginxなどのウェブサーバを用意しなくても、ビルトインウェブサーバを使えばHTTP経由でPHPを実行することができます。 あくまでも必要最低限のサーバ機能なので、開発用として利用しましょう。
プロファイラツールバー
これはSymfonyのプロファイラ機能によるツールバーです。 Symfonyのプロファイラは非常に強力で、パフォーマンス確認からDoctrineのSQL実行ログなど、デバッグに必要な情報を素早く確認できます。 ツールバーを表示させたくない場合は、config/packages/dev/web_profiler.yamlのtoolbar設定をfalseにします。
config/packages/dev/web_profiler.yaml
                        
                            web_profiler:
                                toolbar: false
                                intercept_redirects: false
                            framework:
                                profiler: { only_exceptions: false }
                        
                    
非常に多くの情報を確認することができるので、本番環境での利用は避けましょう。
実行環境設定について
Symfonyは実行環境毎に設定を切り替えることができます。 開発環境や本番環境に応じてDBの接続設定を変えたり、プロファイラ設定を有効にするなどができます。 Symfony4にはデフォルトでDotenvがバンドルされており、 実行環境の設定は.envファイルのAPP_ENVで行います。 アプリ実行時にはAPP_ENVに対応したconfig/packages配下の設定が読み込まれます。
.env
                        
                            # This file is a "template" of which env vars need to be defined for your application
                            # Copy this file to .env file for development, create environment variables when deploying to production
                            # https://symfony.com/doc/current/best_practices/configuration.html#infrastructure-related-configuration

                            ###> symfony/framework-bundle ###
                            APP_ENV=dev
                            ...
                        
                    
.envファイル自体は環境依存かつ機微情報(DBのパスワードなど)が含まれるため、デフォルトでgitignoreされています。 代わりにテンプレートとなる.env.distが用意されており、 composer install時にテンプレートを元にした.envファイルが作成されます。

twigテンプレートの利用

Controllerに直接HTMLを書いても間違いではありませんが、PHPコードの見通しも悪く運用も大変になるので、大抵はテンプレートを導入して開発を行います。 Symfony4ではtwigと呼ばれるテンプレートエンジンが推奨されているので、さっそく利用してみましょう。

まずtemplates/tutorial/配下にindex.html.twigファイルを作成してください。
templates/tutorial/index.html.twig
            
                <!DOCTYPE html>
                <html>
                <head><title>チュートリアル</title></head>
                <body>はじめてのSymfony4 + Vue.js</body>
                </html>
            
        
次はTutorialControllerを少し修正します。 @Templateアノテーションの追加と、returnをResponseからarrayに変更します。
src/Controller/TutorialController.php
            
                <?php
                namespace App\Controller;

                use Sensio\Bundle\FrameworkExtraBundle\Configuration\Template;
                use Symfony\Bundle\FrameworkBundle\Controller\Controller;
                use Symfony\Component\Routing\Annotation\Route;

                /**
                 * @Route("/tutorial")
                 */
                class TutorialController extends Controller
                {
                    /**
                     * @Route("/index", name="tutorial_index", methods="GET")
                     * @Template
                     */
                    public function index(): array
                    {
                        return [];
                    }
                }
            
        
このようにテンプレートを利用すると、コントローラとHTMLを分離して開発できるのでコードの見通しがよくなります。 http://localhost:8000/tutorial/indexにアクセスすると、先程と同じページが表示されます。
テンプレート設定
@Templateを引数無しで利用すると、クラスの名前空間と関数名に対応するtwigファイルを利用します。 今回はApp\Controller\TutorialControllerindex()関数なので、 templates/tutorial/index.html.twigが自動で適用されます。 また、下記コードのようにtwigファイルを指定することもできます。
                        
                            @Template("tutorial/index.html.twig")
                        
                    
@Templateは非常に便利ですが、各関数で1つのテンプレートしか設定できません。 テンプレートを複数出し分けたい場合や、そもそもアノテーションを利用しない場合は、下記のようにしてtwigテンプレートを呼び出すことができます。
                        
                            <?php
                            namespace App\Controller;

                            use Symfony\Bundle\FrameworkBundle\Controller\Controller;
                            use Symfony\Component\HttpFoundation\Response;
                            use Symfony\Component\Routing\Annotation\Route;

                            /**
                             * @Route("/tutorial")
                             */
                            class TutorialController extends Controller
                            {
                                /**
                                 * @Route("/index", name="tutorial_index", methods="GET")
                                 */
                                public function index(): Response
                                {
                                    return $this->render('tutorial/index.html.twig');
                                }
                            }
                        
                    
次のチュートリアルでは、Vue.jsを使った簡単なページを作成します。