JobeetでYii2フレームワークを学習する(5)

この章では主に求人の詳細ページを整えて、MVCのViewに関する知識を深めると共に、開発におけるトラブルに遭遇した場合の対応方法について説明します。

テンプレートの反映

view.phpを以下の通りに編集します。

views/job/view.php
<?php

use yii\helpers\Html;
use yii\helpers\Url;

/* @var $this yii\web\View */
/* @var $model app\models\Job */

$this->title =  sprintf('%s is looking for a %s', $model->company, $model->position);
$this->params['breadcrumbs'][] = ['label' => 'Jobs', 'url' => ['index']];
$this->params['breadcrumbs'][] = $this->title;
\yii\web\YiiAsset::register($this);
$this->registerCssFile("@web/css/job.css", [
  'depends' => [\app\assets\AppAsset::className()],
], 'css-job');
?>
<div id="job">
  <h1><?php echo $model->company ?></h1>
  <h2><?php echo $model->location ?></h2>
  <h3>
    <?php echo $model->position ?>
    <small> - <?php echo $model->type ?></small>
  </h3>

  <?php if($model->logo != ''): ?>
    <div class="logo" style="">
      <a href="<?php echo $model->url ?>">
        <?php echo Html::img('@web/uploads/jobs/'.$model->logo, [
          'alt' => $model->company.' logo',
        ]) ?>
      </a>
  </div>
  <?php endif; ?>

  <div class="description">
    <?php echo nl2br($model->description) ?>
  </div>

  <h4>How to apply?</h4>
  <p class="how_to_apply"><?php echo $model->how_to_apply ?></p>

  <div class="meta">
    <small>posted on <?php echo $model->created_at ?></small>
  </div>

  <div style="padding: 20px 0">
    <?php echo Html::a('Edit', Url::toRoute(['job/update', 'id' => $model->id])) ?>
  </div>
</div>

以下のようにスタイルの反映が確認できます。

変更箇所

上記反映に伴いプログラムや変数の設定等の変更を行った箇所は以下の通りです。

タイトルタグ

$this->title =  sprintf('%s is looking for a %s', $model->company, $model->position);

タイトルタグは$this->title がView内のグローバル変数として扱われており、titleタグに割り当てされます。

スタイルシート読み込み

this->registerCssFile("@web/css/job.css", [
  'depends' => [\app\assets\AppAsset::className()],
], 'css-job');

求人詳細ページのみAppAssetに登録されているスタイルの後にjob.cssのスタイルを読み込むように指定しています。

imgタグの追加

<?php echo Html::img('@web/uploads/jobs/'.$model->logo, [
  'alt' => $model->company.' logo',
]) ?>

求人企業ロゴの表示にHtmlヘルパーからimgタグを出力するようにしています。

しかしこの画像が表示されておりません。

開発におけるトラブル

システム開発は下準備(要件定期・仕様・設計など)を正規化する事で以降の開発はスケジュール通り進む筈が、予測できなかった意図しないところで状況が変わる事は良く耳にします。

Jobeetの開発においてもマニュアル通りに進めた筈が求人企業ロゴが表示されないトラブルに見舞われました。

トラブルの原因について

画像が表示されない原因について調べてみます。

画像を表示する箇所のHTMLソースコードを確認します。

<div class="logo" style="">
  <a href="http://www.sensiolabs.com/">
    <img src="/uploads/jobs/sensio-labs.gif" alt="Sensio Labs(1) logo">      
  </a>
</div>

上記コードより以下のパスにて画像ファイルを指定しているのが確認できます。

/uploads/jobs/sensio-labs.gif
↓ 絶対パスの場合、以下の通り
http://yii-jobeet.takeho.com/uploads/jobs/sensio-labs.gif
↓ ローカルパスの場合、以下の通り
/var/www/html/yii-jobeet.takeho.com/uploads/jobs/sensio-labs.gif

続いてローカルパスにて sensio-labs.gif のファイルがあるか確認しようとするとファイルどころか、uploads ディレクトリそのものが無いのが原因だとわかりました。

トラブルの対応について

原因の調査では、uploads ディレクトリが無いのが原因だとわかりましたので、ドキュメントルートにuploadsディレクトリを作成し、 以下よりダウンロード・回答したファイル(jobs)をフォルダーごとアップロードします。

やってはいけない対応

もう一つのトラブル対応策として画像ファイルが無ければ求人企業ロゴを以下のように表示しない方法があります。

views/job/view.php
  <?php if($model->logo != '' && file_exists(Yii::alias('@web').'/uploads/jobs/'.$model->logo)): ?>
    <div class="logo" style="">
      <a href="<?php echo $model->url ?>">
        <?php echo Html::img('@web/uploads/jobs/'.$model->logo, [
          'alt' => $model->company.' logo',
        ]) ?>
      </a>
  </div>

この方法もトラブル対応方法として一見有効であり親切な機能のように見えますが、これはやってはいけない方法です。

求人企業ロゴ画像の判定は、データベースの求人テーブル(Job)のカラム(logo)に値が入っていた場合、表示する設計になっていますが、これでは、値を入れた場合、表示していることが確認できません。

画像ファイルが無い為、画像が表示されず、alt タグのテキストが代わりに表示されている事が原因そのものを視覚的に表示しているのに対し、これでは状態が分からなくなってしまいます。

この為、このトラブルは画像ファイルを用意する事が正しい対応となります。

トラブルをふりかえって

一見トラブルと思った事がプロジェクト全体を見渡す事でトラブルでな無い事が良くありますが、この原因の殆どは開発者がプロジェクトを断片的にしか把握していない事が起因する一つとしてあげられます。

大規模なプロジェクトになる程、各々の開発者にプロジェクト全体を把握する事が難しくなるのが現実ですが、少し引いてプロジェクトを見渡すだけで解決できる事も多いのも事実です。

Yiiを学習されている方にプロジェクト全体を把握するよう命令するつもりがありませんが、これから様々なプロジェクトに携わるに当たり、必ずトラブルにも遭遇します。

そんな時は、今いる場所から少し引いて自身の関わるプロジェクトを見る事で解決策を探す方法もある事を頭の片隅に入れて頂けると幸いです。

タイトルとURLをコピーしました