🕛 2021.1.30 00:30

誰でも苦労せずにPHPが使えるよ。第5回 複数記事に対応!誰でも簡単に連想配列をイメージできるコツ!

今回は複数の記事に対応したいと思います。今までは、記事を投稿して出力するのは1記事だけしかできませんでした。前の記事は新しい記事に上書きをされてしまっていました。新しい記事を投稿しても前の記事は残るように作成します。

前回は、JSONファイルからデータを取得して投稿記事一覧を作成、CSSを使い装飾をしました。

ブログ投稿を複数投稿に対応する

ブログ投稿後の処理を複数投稿に対応します。

JSONを配列形式にする

JSONを配列形式に格納するようにします。[ ]の中に記事の内容ごとにカンマで区切るとJSONで配列になります。JSONファイルを次のように書き換えましょう。

[
    {
      "title":"面白いサッカー",
      "category":"スポーツ",
      "comment":"サッカー楽しいスポーツです。"
    },
    {
      "title":"面白いバスケ",
      "category":"スポーツ",
      "comment":"バスケも楽しいです。"
    }
]

投稿後、JSONファイルを読み込んで、PHPの連想配列に変換します。次に新しい投稿データを連想配列に追加していく処理にします。

投稿後、真っ白なページになってしまうところも変えたいと思います。前回PHPファイルにはHTML文を書けることを学習しました。今回もPHPファイルにHTML文をかいて、「投稿完了」メッセージと、投稿リストページのリンクをはりましょう。

<?php

$title = htmlentities($_POST['title'], ENT_QUOTES);
$category = htmlentities($_POST['category'], ENT_QUOTES);
$comment = htmlentities($_POST['comment'], ENT_QUOTES);

if( empty($title) || empty($comment) ){
  header('Location: index.html');
  exit;
}

#$title = str_replace("楽しい", "面白い", $title);
#全角カナから半角カナに変える
#$title = mb_convert_kana($title, "k");

$blog_content = [ 
  "title" => $title,
  "category" => $category,
  "comment" => $comment,
];

//① JSONファイルから読み込み
$file = "blog.json";
$json = file_get_contents($file);
$data = json_decode($json, true);

//② 連想配列に新しい投稿データを追加
$data[] = [ 
    "title" => $title,
    "category" => $category,
    "comment" => $comment,
];

//③ 連想配列をJSONデータに変換しJSONファイルに保存
$blog_json = json_encode($data, JSON_UNESCAPED_UNICODE);
file_put_contents($file, $blog_json);

?>
<html>
<head>
<title>投稿完了</title>
</head>
<body>
<h1>投稿完了</h1>
投稿しました。<br/>
<a href="articles.php">投稿記事一覧へ</a><br/>
<a href="index.html">記事投稿へ</a>
</body>
</html>

JSONファイルから読み込み

JSONファイルからJSONデータを読み込み、PHPの連想配列に変換します。JSONデータの配列に新しい投稿データを追加するためです。

連想配列に新しい投稿データを追加

PHPの配列は、次のような書き方で値を追加することができます。ターミナルを開いて「php -a」を入力してインタラクティブモードにして次を入力してみましょう。

$hoge[] = 'AAA';
$hoge[] = 'BBB';
var_dump($hoge);
array(2) {
       [0]=> string(3) "AAA"
       [1]=> string(3) "BBB"
 }

配列にXXXとYYYが追加されました。

連想配列ではどうでしょうか。$dataという配列に、新しい投稿データの配列を追加します。

$hoge[] = ['AAA','XXX'];
$hoge[] = ['BBB','YYY'];
var_dump($hoge);
 
 p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000} span.s1 {font-variant-ligatures: no-common-ligatures} 
 array(4) {
   [0]=>
   string(3) "XXX"
   [1]=>
   string(3) "YYY"
   [2]=>
   array(2) {
     [0]=>
     string(3) "AAA"
     [1]=>
     string(3) "XXX"
   }
   [3]=>
   array(2) {
     [0]=>
     string(3) "BBB"
     [1]=>
     string(3) "YYY"
   }
 } 

連想配列に新しい投稿データを追加されました。

連想配列をJSONデータに変換しJSONファイルに保存

json_encode関数が、JSONの配列データにうまく変換してくれます。JSONファイルに保存します。

ブログ記事一覧も複数投稿に対応する

JSONファイルからJSONデータを読み取り、表示するコードも変更します。

<?php

$file = "blog.json";
$json = file_get_contents($file);

$blog_contents = json_decode($json, true);

?>

<html>
<haed>
<title>ブログ記事一覧</title>
<link media="all" rel="stylesheet" href="style.css" />
</head>
<body>
<?php foreach($blog_contents as $content){ ?>
<h1><?php echo $content['title']; ?></h1>
<span><?php echo $content['category']; ?></span>
<div><?php echo $content['comment']; ?></div>
<?php } ?>
</body>
</html>

PHPは、HTML文を書けるだけではなく、<?php — ?>で囲んだPHP処理も実行できます。

foreachは繰り返し処理です。配列「$blog_contents」のはじめから終わりまで、$blog_contentsの値を$contentに代入する処理を繰り返します。$contentに1投稿記事のデーアが入り、表示させています。

配列、連想配列をイメージしやすくするコツは表を書くことです。

$blog_contentsの中身をイメージしてみましょう。foreachは、下表indexの0から2まで処理を繰り返します。$contentに値を代入していきます。

index
0{[title]=>”面白いサッカー”,[category]=>”スポーツ”,[comment]=>”サッカー楽しいスポーツです。”}
1{[title]=>”面白いバスケ”,[category]=>”スポーツ”,[comment]=>”バスケも楽しいです。”}
2{[title]=>”楽しいブログ製作!”,[category]=>”ニュース”,[comment]=>”ブログ製作は楽しい!”}

動作を試してみましょう。

ブラウザーで、localhost:8000を開いて、タイトル「楽しいブログ製作!」、カテゴリ「ニュース」、記事「ブログ製作は楽しい!」と投稿してみましょう。

localhost:8000/articles.php を開いてみてください。

複数投稿に対応できました。

ただ、新しい投稿は下に表示されていますね。表示する順を新しい投稿が上にくるように逆にしてみます。

<?php

$file = "blog.json";
$json = file_get_contents($file);

$blog_contents = json_decode($json, true);

$blog_contents = array_reverse($blog_contents);

?>

<html>
<haed>
<title>ブログ記事一覧</title>
<link media="all" rel="stylesheet" href="style.css" />
</head>
<body>
<?php foreach($blog_contents as $content){ ?>
<h1><?php echo $content['title']; ?></h1>
<span><?php echo $content['category']; ?></span>
<div><?php echo $content['comment']; ?></div>
<?php } ?>
</body>
</html>

array_reverse関数だけで、簡単に配列を順序を逆にできました。PHPは便利ですね。

PHP: array_reverse – Manual

もう一度 localhost:8000/articles.php を開いてみてください。

新しい投稿が上にくるようになりました。新しい投稿が注目されるようになりますね。

今回は以上です。

まとめ

複数の記事を読み書きできるブログになりました。投稿後、JSONファイルからデータをすべて読みこんで、連想配列にして新しい記事データを追加しました。

投稿記事一覧では、JSONファイルからデータを読み込み、PHPで扱える連想配列に変換、foreachを使い繰り返し処理をして、1記事ごとに出力しました。

配列になると少し難しく感じますが、配列を考える時は、EXCELのような表を(マトリックス図)を作って値を書いていくとわかりやすいです。

次回は、PHPの外部ファイル読み込みと投稿時間をいれます。

最後までお読みいただき、ありがとうございました!

Photo by Box vector created by pch.vector – www.freepik.com

プロフィール

プログラマー歴20年の管理人がプログラミング、ブロックチェーンなどの話題に書いていきます。>>続く

目次Toggle Table of Content