次年度申し送りメモ

cakephp で bakeの挙動が変。

実習室の問題か。

bake しなおして over write しても、既存のファイルのタイムスタンプまで更新されるが、コードは元のまま。

ファイルを削除しないとbakeでコードが直らない。

２０１７年度資料

【5分でわかる】PHPのWEBフレームワーク「CakePHP」とは？

https://book.cakephp.org/3.0/ja/tutorials-and-examples/bookmarks/intro.html CakePHPのインストール と ブックマークチュートリアル

PDO と PHP と MySQL http://blog.tojiru.net/article/273342235.html

作業手順：

解説動画

CakePHPのブックマークチュートリアルの前半を作成する。

・CakePHPをインストールする ※２０１８年度はインストールせずに、DL済みのものを配布予定。

自宅など自分のPCで実習を行う場合：

composer.phar をダウンロード。今回DLするバージョン→ 1.4.2 ※２０１８年度は更新予定

d:\xampp\htdocs に配置する。

vs code を開く（スタート → 検索 code）

作業フォルダを D:\xampp\php に設定（ファイル → フォルダーを開く）

php.ini の編集 （実習室PCでは設定変更済み※２０１８年度の予定）

899行目

extension=php_intl.dll

先頭の ; を削除。ファイル保存。

作業フォルダを D:\xampp\ に変更。（ファイル → フォルダーを開く）

vs code のエクスプローラーで、 htdocs を右クリック → コマンド プロンプトで開く

以下のコマンドを実行する。setは２回実行する（最初のsetで環境変数を削除することが必要。実習室の設定上の問題に対応。） ※２０１８年度は↓は実行せずに進める。

set HTTP_PROXY=

set HTTP_PROXY=http://202.236.100.6:8080

d:\xampp\php\php.exe composer.phar create-project --prefer-dist cakephp/app bookmarker

通信障害など何らかの原因でCakePHPがダウンロードできない場合は、

レポートフォルダ → データベース → bookmarker フォルダを d:\xampp\htdocs にコピーする。

ファイル数と容量が多いので、コピーが完了するまで慎重に操作する。

xampp を起動。既に起動していた場合再起動（PHPの設定変更を有効化するため）

データベース bookmarker を新規作成 （※データベース名に空白文字など、余分な文字が入らないように注意する）

テーブルを定義

users bookmarks tags bookmarks_tags

CREATE TABLE users (

    id INT AUTO_INCREMENT PRIMARY KEY,

    email VARCHAR(255) NOT NULL,

    password VARCHAR(255) NOT NULL,

    created DATETIME,

    modified DATETIME

);

CREATE TABLE bookmarks (

    id INT AUTO_INCREMENT PRIMARY KEY,

    user_id INT NOT NULL,

    title VARCHAR(50),

    description TEXT,

    url TEXT,

    created DATETIME,

    modified DATETIME,

    FOREIGN KEY user_key (user_id) REFERENCES users(id)

);

CREATE TABLE tags (

    id INT AUTO_INCREMENT PRIMARY KEY,

    title VARCHAR(255),

    created DATETIME,

    modified DATETIME,

    UNIQUE KEY (title)

);

CREATE TABLE bookmarks_tags (

    bookmark_id INT NOT NULL,

    tag_id INT NOT NULL,

    PRIMARY KEY (bookmark_id, tag_id),

    FOREIGN KEY tag_key(tag_id) REFERENCES tags(id),

    FOREIGN KEY bookmark_key(bookmark_id) REFERENCES bookmarks(id)

);

CakePHPとMySQLの接続設定を編集

vscode で bookmarker/config/app.php

を編集。

232～234行目付近。

return [

    // More configuration above.

    'Datasources' => [

        'default' => [

            'className' => 'Cake\Database\Connection',

            'driver' => 'Cake\Database\Driver\Mysql',

            'persistent' => false,

            'host' => 'localhost',

            'username' => 'root',

            'password' => '',

            'database' => 'bookmarker',

            'encoding' => 'utf8',

            'timezone' => 'UTC',

            'cacheMetadata' => true,

        ],

    ],

    // More configuration below.

];

保存する。

Scaffold 機能を利用して CRUD 用のWebページを作成する。

vs code のエクスプローラーで、 htdocs フォルダの中の、

CakePHPをインストールした bookmarker を右クリック → コマンド プロンプトで開く

※２０１８年度は path 設定不要※予定

SET PATH=%PATH%;d:\xampp\php

bin\cake bake all users

bin\cake bake all bookmarks

bin\cake bake all tags

ブラウザで↓のURLにアクセス

http://localhost/bookmarker/bookmarks

※ サービス名が bookmarker で テーブル名が bookmarks よく確認して入力する。

作成したWebページにサンプルデータを書き込む。

New User で、ユーザーを新規登録

New Tags で、ブログのタグ（カテゴリ）を新規登録

New Bookmark で、↑２つを使って（ユーザーはID番号で指定）適当なWebサイトを登録

List Bookmarks でブックマークを一覧表示して、スクリーンショットを撮影。

次回は、bookmarksチュートリアルの

パスワードハッシュを追加

から、作業を続ける。

第A回課題

・授業中課題が２点（スクリーンショット）

・期末課題のサービス企画・テーブル設計が１点 ←※重要

今回考えたサービスをCakePHPとMySQLを使って実装します。

Webで利用できるサービスとして完成させ、機能を追加し、サンプルデータを入力したら期末課題は制作完了。

残り５回＋テスト週間の作業時間を予定。

２０１６年度資料

期末課題についてテーマの選定、企画を行う。

キーワード： 要求仕様

Web対応のDBMSを利用したデータベースの設計と実装の開発演習を行う。

使用する開発環境は

XAMPP

で、

データベースは、 MySQL

Webアプリケーションフレームワークは、

CakePHP

を使う。

ドット・インストール の CakePHP入門 の講座（全32回）を参考に、Ｗｅｂデータベースの例として Blog システムを作成する。

このＷｅｂデータベースを 元に、 各自の企画したデータベースを作成していく。

データベースのUI部分は、HTMLでデザインするので、関連科目を習得していることが望ましい。

※演習環境の確認※

今回から取り掛かる、期末の演習課題は D:ドライブ の XAMPP を利用して作業をしてください。

■演習１

CakePHP を XAMPP 環境にインストールし、CakePHP用のアカウントやフォルダをセットアップする。

・ＣａｋｅＰＨＰについて

CakePHP は Webアプリケーションフレームワーク。 他のWebアプリケーションフレームワークとしては、Ruby on Rails が有名。その他、 CodeIgnitor というフレームワークなど、数々のフレームワークが登場している。

フレームワークを利用することで、Webサービス構築に必要な一連の作業を簡略化でき、サービス構築の手間を省くことができる。

CakePHP はその名の通り、 プログラム言語PHPを使用するフレームワークである。

多少、PHPの知識を要するが、利用するには定型の使用方法を覚えるだけで済む場合が多い。

・ＭＶＣについて

MVC はシステム開発の設計コンセプト。ＣａｋｅＰＨＰではＭＶＣに基づきプログラムを記述する。

Model データ。データベースとPHPの連携処理。

View 外見。UI、利用者画面。

Controller サービスの振る舞い。URLとサービスの提供する機能の制御。コマンド。

ＣａｋｅＰＨＰの方針：

CoC Convention over Configuration (設定より規約（を優先する）)

ファイルに付ける名前、コード中の変数名、データベースのテーブル名には CakePHP のルールに従ったものをつける。

CakePHPの命名規約について http://qiita.com/nvtomo1029/items/1147b8796af3d906c3a9

MVCの設計方針では、

プログラムは、 Model View Controller の各役割に応じて 別々の場所（ファイル）で管理される。

以下の演習は、コードを記述するファイルのファイル名と、配置場所（フォルダ）をよく確認してすすめること。

・CakePHPインストール

CakePHP から最新のリリース版をダウンロード できる。

この演習では、レポートフォルダ（データベース）に上記リンク先からダウンロードしたものを用意した。こちらをコピーして利用するとよい。

今回利用するVersionは、CakePHP 2.7.0-RC である。

※2016.6 最新版は cakePHP 3.2 、ブックマークサービス や Blogシステム 作成 のチュートリアル はこちら

cakephp-2.7.0-RC.zip

を D:ドライブに各自でコピーして、ダブルクリックで解凍する。

デスクトップにフォルダが作成され、解凍される。

フォルダ名を blog学籍番号 に修正する。 例） blog3113789

blog フォルダを移動する。移動先： D:ドライブ XAMPP → htdocs （ドキュメントルート）

デスクトップの blogフォルダは削除しておく。

フォルダの中身、よく使う場所の確認。

htdocsに配置したcakephp（blog学籍番号）のフォルダの中を確認する。

app ->

Config 設定ファイル（database.php など設定ファイル）

Controller URLで呼びだされるサービス（phpの関数）用プログラム

Model データベースとの連携プログラム（テーブルの設定）

View Webページの表示用プログラム(chtml によるテンプレート）

webroot css や 画像など素材置き場

・ データベース設定

XAMPPコントローラ（D:ドライブ）を起動し、 Webサーバ、 MySQLサーバを起動する。

ブラウザから、 URL http://localhost/blog学籍番号/ にアクセスする。

CakePHPの設定画面が表示されるか確認する。

XAMPPのPHPMyAdim（MySQL管理ツール）から、データベースの作成 と ユーザID登録を行う。

■ Blog 用データベースの作成

データベース → データベースの作成：

 データベース名 blog学籍番号

 照合順序 utf8_general_ci

■ユーザIDの登録

ユーザの作成：

ユーザ → ユーザを追加する

 ユーザ名 cakephp

 Host %          修正不要

 パスワード cakephp

 re-type cakephp

 グローバル特権 すべてチェックする

→実行

↓の cakephp のユーザ設定と同じになっているか確認

CakePHPの設定ファイル編集：

D:\XAMPP\htdocs\blog\app\Config

の

database.php.default を コピーして 名前を database.php に変更。

class DATABASE_CONFIG {

public $default = array(

'datasource' => 'Database/Mysql',

'persistent' => false,

'host' => 'localhost',

'login' => 'user',

'password' => 'password',

'database' => 'database_name',

'prefix' => '',

//'encoding' => 'utf8',

);

を修正。

class DATABASE_CONFIG {

public $default = array(

'datasource' => 'Database/Mysql',

'persistent' => false,

'host' => '192.168.201.??',

'login' => 'cakephp',

'password' => 'cakephp',

'database' => 'blog学籍番号',

'prefix' => '',

'encoding' => 'utf8',

);

??はPCの番号。（０は書かない）

XAMPPの Apacheの設定を変更

D:\xampp\apache\conf の httpd.conf の修正

ServerName localhost:80

を

ServerName 192.168.201.??:80

??はPCの番号。（０は書かない）

Webサーバを再起動（Stop→Start）

ブラウザから、 URL http://192.168.201.??/blog学籍番号/ にアクセスする。（ブックマーク推奨）

※ localhost でcakePHPにアクセスできるが、 ipアドレスではアクセスできない場合は、下方のトラブル対応の記述を参照

・開発

Blogシステムと、データベースの基本機能。

用語 CRUD Create Read Update Delete

レコードの 登録 読取 修正 削除 → Blog では、 記事の 投稿 表示 修正 削除

データベースシステムに必須の機能

を以下で作成していく。

ファイルの置き場所：

Model(Model/Post.php)

Controller(Controller/PostsController.php)

View(View/Posts/)

index.ctp

view.ctp

add.ctp

edit.ctp

・postsテーブル

MySQLに、テーブルを作成：

blog データベースを選択して、以下のSQLコマンドで作成する。

create table posts (

  id int not null auto_increment primary key,

  title varchar(50),

  body text,

  created datetime default null,

  modified datetime default null

);

posts テーブルの設定確認：

PHPMyAdminからデータを数件登録する。

入力項目は title と body だけでよい。特に id は自動入力されるので、入力しないこと。

テーブルの内容を表示して確認。

・Scaffold

Modelフォルダに

Post.php

<?php

class Post extends AppModel {

}

Controllerフォルダに

PostsController.php

<?php

class PostsController extends AppController {

public $scaffold;

}

を作成する。

※拡張子に注意。ファイルを保存した後で、.php になって切ることを確認。 .txt などになっていたら修正する。

※ Modelフォルダなど、同じフォルダ内のphpファイルをコピーして名前を修正し、Terapadで編集する手順を推奨。

scaffold について：

来週以降、

index （トップページ）

create （投稿）

update （修正）

delete （削除）

などのメソッド（プログラムの部品）を追加してBlogシステムを作成していく。

動作確認

今回は、動作確認用の テスト機能 scaffold を利用して、Blogデータベース

とCakePHPの接続が正常であることを確認する。

http://192.168.201.??/blog3114???/posts をブラウザで表示して scaffold を試す。

表示例）

※トラブル対応

演習で発生しそうな問題と対応方法について

・blogの画面で 漢字が文字化けする場合。

→ データベースの設定 database.php で UTF8が設定されているか確認。

→ ｐｈｐファイルを保存したときの文字コードが UTF8 であるか確認。

・cakePHPのホーム画面は表示できるが、Blog画面が表示されない場合

例）この様なエラー画面

→ MySQL のユーザ設定を確認する。 'cakephp'@'%' ホストの指定なし。グローバル特権。

・localhost でcakePHP に接続できるが、 ipアドレスで接続できない場合。

→ webサーバの設定を確認する。 httpd.conf の ServerName の記述。Webサーバの再起動。

httpd.confに余分な文字（全角の空白）や不足が無いか確認。

→ OS の設定を修正する。

スタート → 検索窓 → regedit.exe → 以下の画面で、

HKCU → Software → Microsoft → Windows → CurrentVersion → Internet Settings

の順に開いて、

ProxyOverride の項目をダブルクリックする。

以下の設定と比べて、異なっているようなら修正する。

webclass.nagoya-bunri.ac.jp;192.168.*.*;*.nagoya-bunri.ac.jp;<local>

OSを再起動する。

・その他のエラー

→ cakePHPのフォルダのコピーをやり直す

コピー中にエラーなど何らかの原因で、一部のファイルがコピーされていない場合がある

■提出

来週以降に指示する。Blogデータベースと htdocsのblogフォルダをまとめて提出の予定。

（今回の演習のポイント）

cakePHP では、MVC モデル・ビュー・コントローラー

データベース（とその中のデータ）

Webページ

プログラム（表示・検索などの条件）

の３つの要素を、「名前」で自動的に結び付けます。

Blogの記事(posts) システム

テーブル名 posts

モデル Post.php

ビュー Posts/index.ctp など

コントローラ PostsController.php の PostsControllerクラス

↑の4要素を名前「Post」 とその複数形「Posts」によって、cakePHPが連携させる。

※※ scaffold （足場）機能を利用せずに、 bake コマンドで、モデル、コントローラー、ビューの各ファイルを自動生成することもできる。

むしろbake の利用が cakePHP らしい制作方法。

cakePHP3 の新バージョンでは、 scaffold 機能は廃止された。

＃宿題１ ＝ 予習

ファイルの作成・設定を進めておく。

ただし、

ドットインストールの cakePHP講座では、jQuery やajaxを利用したUIのアニメーション制御が紹介されているが、この演習ではjQueryとajaxは扱わない。

＃宿題２

期末課題として作成する、Webサービスのテーマを決める。

例）

テーマ： ボードゲーム貸し出し管理

データベース名： boardgame

テーブル名とフィールド名

games id name maker

users id name

rentals id user_id game_id date date