お絵かき掲示板を設置しようとしたらエラーが出た話

先日ふと「サイトにお絵かき掲示板を設置したい!」と思い立ちました。唐突に。

以前お絵かき掲示板についてのtogetterまとめを見ていたので、「今でも使えるかも!」と思ったんですね。

最近MastodonのTLで「お一人様サーバー」の話題が上がっていて、その流れで思いついた感じです。SNSのアカウントは今現在で十分持っているので、それとは別にイラスト専用の場所が欲しいなと。

あと、現状イラストを描くハードルが自分の中で上がってしまっている部分があったので、サクッと手軽に描ける場所としてお絵かき掲示板を使おう!と思いました。昔はよく他サイトさんの掲示板で書き込みしていたので、懐かしさもあります。

そんなこんなで早速設置しようとしたのですが、ちょっとトラブルがありまして… 今回はその事を書いていこうと思います。

何が起こったか

最初に簡潔に結論を書いておきます。

「イラストを描いてもエラーで保存されない→自サイトの設定が原因でした」

そう!配布スクリプトは何も悪くないのです… 自サイトで特殊な設定をしていたのが悪さしていたんですね。

なので、今回の記事は「自サイトでこういう設定をしているとエラーが起きたよ」という記事になります。

しかも、この記事を書いている時点で、スクリプトの作者様が対策をしてくださったので、もはやエラーの心配はないのです!

…記事書く意味ないかも?とも思いましたが、今回の「お絵かき掲示板」に限らず他のスクリプトを使用しようとした時に同じトラブルに陥る可能性があるので、備忘録として書いていきます。

お絵かき掲示板PHPスクリプト「Petit Note」

今回自サイトに設置したのは「Petit Note」というスクリプトです。
※設置したときのバージョンはv0.86.5でした。

同じ作者様でもう一つ「POTI-board改」というものもあるのですが、こちらは「POTI-board」というスクリプトを改良しているものらしいです。

「Petit Note」と「POTI-board改」の違いがいまいちしっかり分かっていないのですが、「Petit Note」の方が後から開発された新しいもののようだったので、こちらを使わせていただくことにしました。

自サイトにスクリプト設置

設置方法はびっくりするほど簡単です。
※サーバーのPHPバージョンが指定値以上になっていることが前提です。(指定値は配布サイトをご確認ください)

先程のアドレスからリリースページに移動し、一番下にある「Assets」の「Source code (zip)」をダウンロード。

ファイルを展開して、中に入っている「petitnoteフォルダ」のconfig.phpを編集します。6行目に「//管理者パスワード 必ず変更してください。」という記述があるので、7行目の「$admin_pass = "●●"」の●●部分を変更します。このパスワードは管理画面に入る時に必要になります。

で、変更・保存できたら「petitnoteフォルダ」をサイトにアップロード。

サーバーの「petitnoteディレクトリ」にアクセスすればもう動いています!早い!!

こういうスクリプト設置の際、よく「パーミッションの変更」などを行うのですが、Petit Noteでは自動で設定してくれるようで特別な操作は不要です。

私もこの手順で無事お絵かき掲示板の画面が表示され、ルンルンで初カキコをしようとお絵かき開始しました。しかし…

投稿ボタンを押しても保存できていない

一通り描けたので投稿!と投稿ボタンを押してみると「画像が見当たりません」と表示されてさっきまで描いてたイラストが消えてる!😱
※ちなみにこの時ツールはPaintBBS NEOを使っていました。

慌てて他のツールでも描いてみると、ChickenPaintでは保存までできるのですが、他のPaintBBS NEO・tegaki.js・Klecksでは保存ができない…

保存できているツールはあるので、「アップロードの仕方が悪いのかな?」とか「最初からconfig.phpを弄りすぎたかな?(日記モードに設定してたりした)」など考えて色々試してみましたが、どうやってもエラーが直らず…

全く原因が分からなかったので、思い切ってサポート掲示板に状況を報告してみることにしました。

該当のスレッド↓

めちゃくちゃ親切にサポートしてもらう

サポート掲示板に書き込んですぐ、作者様から返信があり、色々と原因を探っていきました。

詳しくは該当のスレッドを読んでいただければと思うのですが、作者様にかなり親身に対応していただきました…!感謝…!!

手がかりが少ない中尽力していただき、試行錯誤するもなかなか原因が分からず… 私のプログラミングの知識がかなり浅い為思い当たる節がほぼ無く、作者様からのレスを読んで必死にぐるぐる考えていたのですが…

ふと、「(原因で)その他に考えられるのは、セキュリティ関連の設定で…」という記述に目が留まりました。

「セキュリティ… あれ?ひょっとして自サイトに色々設定してるセキュリティ(設定)が悪さしてるかも…?」

.htaccessファイルの設定が原因

私のサイトでは何回かアドレス変更をした関係で、サイト全体に影響する「.htaccessファイル」にたくさんの設定を詰め込んでいました。

その設定が悪さしているかも!と思い、すぐにファイルのバックアップをとって・サーバー上の.htaccessファイルを削除してみました。

直ったー!!!!

って…自分のサイトの設定が原因じゃんーー!!😭

そう!冒頭でも書いていた通り、自分で設定した項目がスクリプトの動作に悪さしていたんです…

慌てて「.htaccessファイル」を細かく検証し、サポートスレッドに報告させていただきました。作者様、お手数をおかけしてすみませんでした…🙇‍♀️

詳しい原因は…

「.htaccessファイル」の何が悪さをしていたかというと、「php・html拡張子付きのアドレスにアクセスした場合、拡張子なしのアドレスに301リダイレクトする記述」でした。

これは私のサイトが静的サイトであり、HTMLを手打ちで入力・作成していることが発端です。

普通にファイルをアップロードしアクセスすると、
https://miscnote.com/about.html
のように最後に「.html」の拡張子が付いてしまうんです。最近はPHPでサイトを作っているので、その場合は「.php」の拡張子が付きます。

これはものすごく…ダサく見える!(私感)

最近はWordPressでサイトを作ってる方が多く、その場合アドレスに拡張子が付かないように設定されていることが多いので、余計目立つんですよね…

というわけで、『拡張子を非表示にする・拡張子付きのアドレスにアクセスしたら301リダイレクトする』設定を「.htaccessファイル」に書いていたのです。

これにより、
https://miscnote.com/about.php
にアクセスしようとすると自動的に
https://miscnote.com/about
に移動するようになっていました。

これがPHPで作られていたお絵かき掲示板スクリプトで悪さしてしまい、エラーが出ていたのです。
/(^o^)\ナンテコッタイ

対策してみる

原因がわかったので、対策を行いました。

具体的には、サイト全体には上記設定を残しておきつつ「petitnoteディレクトリ」には設定が適用されないようにしました。

これで無事解決!!

お絵かき後投稿できちんと保存されるし、他のページでは拡張子なしのページにリダイレクトするように設定できました。よかったー!

v0.87.2で公式対策されてる…!

今回の記事を書くために改めて配布サイト・サポート掲示板を見てみると、なんとv0.87.2で今回のエラー対策をしていただけていました…!まさかの…!!

v0.87.2で、PHPの拡張子をリダイレクトして非表示にしているサーバでも動作するように修正しました。

つまり前項で行った対策は不要ということです。実際、除外設定した箇所を削除しても無事動作しました!感謝…!!

最後に

今回は「自サイトのアドレスを拡張子なしにするために、リダイレクト設定している」という特殊な条件でエラーが出ていたわけですが、設置しようとしているスクリプトがPHPの場合、今後も同じ理由でエラーが出てもおかしくないな…と思いました。

自分のPHPの知識がもう少しあれば良いのですが、まだ全然なので…
とりあえず今後PHPスクリプトを導入する際は、改めてディレクトリの除外設定をしていこうと思います。

関連記事
    新着記事
      ブログ内検索