ドラえもんの道具がエロい件について

今開発中のウェブアプリのダミーデータをご覧ください(ぁ

特に話題がないので、今開発しているウェブアプリについて。PHP + HTML5 + Javascript + MySQL で開発してるんだけど、会社でやってる仕事も、構成は同じでしかもボクが個人的に作っている方のウェブアプリの機能を一部移植するだけで済むので、自分のと会社のと同時開発している。

でね、あらかた組み上がったので、データーベースのとりあえずのデータを登録して動作を確認しようとしたんだけど、ハテ、どんなデータを入れようかと思って思いついたのが、ツイートの通りである(ぁ

ドラえもんの道具ってエロいことにも使えていいよね!
っていうかさ、このままのび太が思春期を迎えた時のドラえもんの対応がすごい気になる。
周囲のみんなが童貞を捨てていく中、のび太もドラえもんの力で何とかしようとすると思うんだけど……やはり初めての相手はしずかなんだろうか? まぁそんなことは考えてもしようがないことではあるが。

そんなどうでもいい話。
さらにどうでもいいが、しずかって確かのび太が情けなくてこのままだと可哀想だからとかいう理由で結婚してくれるんだよね。まぁ別にそれはいいんだけど、そんな女の子で見てくれもそこそこ良かったら、たぶん中高大のどこかでチャラ男に騙されてサセ子になっちゃって、20 代の頃にはかなりスレてそう……とか思ったんだけどどうだろう?<偏見
エロ漫画の見過ぎ??(そこかよ

ウェブアプリ開発、色々

正式にはまだ発表出来ないんだけど、ウェブアプリをまた作り始めている。今度のはかなり規模が大きいので、言うだけ詐欺になりかねないのだが、まぁとりあえず(ぉ

HTML と Javascript で画面を作っていたんだけど、縦で使ったときと横で使った時を%だけで表現出来るかなと思ったら無理だった……orz あと上のツイートの立ち絵あるじゃない? この立ち絵をタップできるようにしたんだけど、抜けはタップしても反応しないようにできるかなーと思って調べたら、それをやるには canvas を使わないといけないらしい……。めんどくさい。最近 canvas 使わなくてもイロイロ出来るようになったので、canvas 使うことを考えてなかった(汗)。

ところで、前回当てた大型アップデートから Egde の挙動が変わった。何度更新押しても、CSS と Javascript が更新されない。くそー。仕方ないので、デバッグ画面から常にサーバを読むようにして使ってるけど、これ、普段使いにもどるときにはいちいち OFF にしないとダメだよね? もー……。

最後に、今日は三軒茶屋にある音楽団の PC を診てきたんだけど、その帰り、浅草橋に戻るのに首都高を使ったんだけど、至る所(ジャンクションとか出入り口とか)で検問やってた。検問と言っても、たぶんだけどカメラで撮ってるだけなのかな? 警官と移動交番らしき車両がところどころに配置されていた。ああいう検問の方法もあるんだなぁ。

クラウドに頼らずに iPad を使う with オレオレ証明書との戦い

 

さて、iPad をいかにノート PC の様にして使うか、それが iPad を初めて手に入れたボクの最初の使命である。iOS はバカ素人でも使えるように、様々な PC 的概念が見た目上排除されている。例えば撮った写真は写真アプリでしかアクセス出来ない。他の写真加工ソフトとかで見ることができないのだ。
これはアプリとデータをセットで隔離することによって、セキュリティを高めることが出来るからだ。別のソフトが勝手に他のアプリのデータを読んだり、また他の場所にコピーしたり出来ないようにしているわけだ。

この制限はあくまでも見た目上であり、中身は PC と同じなので、フォルダ(ディレクトリ)があり、ファイルがある。そして上記の制限を完全に守ると使いにくいので、他のアプリが写真にアクセス出来るように許可を出す設定が出来たり、他の場所にコピーをする許可を出す設定ができたりする。

さて、ボクの場合は amatsukami.jp サーバに開発に関わるあらゆるデータが置いてある。これは iPad からするといわゆるクラウドに相当する。要するにボクは 2000 年頃からすでにクラウドみないなことをやっているわけだが、iOS 上のアプリはこの独自クラウドには対応していない。Google DriveiCloudDropbox などの有名なサービスには対応しているが、ボクが個人的に立ち上げたクラウドにはアクセスする手段を用意していないのだ。

じゃぁ Google Drive などのサービスを使えばいいじゃないかというと、そう簡単にはいかない。まず容量が足りない。ボクのサーバはプロジェクト用だけでも 8TB 用意してある。Google Drive で無料に使えるのはその 1/1000 以下の 5GB である。そしてもう一つ重要なのが、エロゲのデータが置いてあることだ。
エロゲの画像データは海外からしたら児童ポルノに認定されてしまうことがよくある。Google などが勝手にボクのデータをのぞき見て、エロゲのデータを児童ポルノだと認定したら垢バンどころかそれ以上の面倒なことになりかねない。

そう言った理由で、自宅サーバにデータを置いているのである。

でね、Googe Drive とかも別に特殊なことをやっているわけではなくて、内部ではインターネットで規定された汎用の技術(WebDAV など)を使って実現されている。と言うことはつまり iOS のアプリ側も汎用的な技術を使って Google Drive とかにアクセスしている。
そこで汎用的な技術を使って iOS とその他のサーバとをやりとりできるアプリを間に挟むことによって、自宅のサーバのデータを iPad で読み書きするように設定できた。FileExplorer というアプリだ。このアプリは、様々なアプリがファイルを開くとき、この FileExplorer が選択できるように設計されているようだ。そのため、アプリからファイルを開くとき、FileExplorer を選べば FileExplorer がアクセス出来るファイルを読み書きできるという具合だ。

ところが iPad 側でいろいろとファイルをいじれるようになったものの、問題が起きた。それはフォント(笑)。ボクの開発用 PC には相当数のフォントが入っているのだが、iPad にはないし、そもそもそんなにたくさんのフォントを入れることは出来ない。
結局印刷物を作ったり、バナーを作ったりするのには全く使えなかった(汗)。

ただ、よくわかんないんだけど、PC で作ったファイルを読み込むと、Adobe や Office はどこからかフォントを読み込んでくれるようだ(アプリ起動時に、本体にないファイルを読み込んでいますみたいなことが表示される)。

さて、ここまではまずまずの結果と言ってもイイだろう。
問題はその次である。それはオレオレ証明書だ。amatsukami.jp の通信を暗号化するための証明書は公的なものではなく、ボクが勝手に発行したものだ(笑)。別にボクだけが使うものだし、暗号化さえされていればいいのでちゃんとした証明書はいらない。それにこのオレオレ証明書を iPad に登録すれば、ボクの iPad だけ公式な証明書となるのだ。
ところが、これが何度登録しても実際に使おうとするとオレオレ証明書になってしまう。コレは困った。iPhone ではすでに同じことをしてあって、そっちではちゃんとエラーも出ずに公式な証明書として使えているのに、なぜか iPad ではダメなのだ……。そのためボクの仕事で使っているサイト(redmine とかグループウェアとか)までエラー表示されてしまう。

困ったなぁ……いったい何が原因なんだろうか? っていうかもう公式な証明書をとるしかないんだろうか??

与太話。ボクは今、趣味でも仕事でも PHP でプログラムを組んでいるんだけど PHP で扱う日付は UNIX 時間という 1970 年 1 月 1 日から何秒経過したかっていうデータなのね。でもそれだと何が何だか解らんので、この秒数を「○年○月○日 XX時XX分XX秒」に変換して使ってる。

ところが、この年月日を計算するとなると(例えば今日は 2017 年 7 月 11 日から何日が経過しているかとか、2018 年 12 月 13 日引く2001 年 10 月 9 日は何年何ヶ月何日間なのかとか)、UNIX 時間のままの方が楽だ。ただの秒数だから、秒数同士を足したり引いたりするだけで OK だからだ。

しかし一度貰ったデータは「○年○月○日 XX:XX:XX」っていう形式のデータに変換してしまっている。

上の strtotime という関数はこの「○年○月○日 XX:XX:XX」っていうデータから UNIX 時間に戻してくれる関数なのだ。コレのおかげで時間計算が凄く楽になって助かったーっていう意味が上のツイートには込められているのであった。

WB-BT300 とか PHP とか VPN とか

Twitter から拾った、コンピュータ関係の話。

iPhone の音を PC の音とミックスして出したくて、使っていなかった Bluetooth レシーバを引っ張り出してきた。Onkyo の WB-BT300 という機械だ。コイツはなにをする機械かというと、iPhone など Bluetooth 対応機からは音響装置に見え、WB-BT300 に対して音声を飛ばしてくれる。WB-BT300 は iPhone からきた音声を、デジタル信号かアナログ音声信号に変換して出力してくれるのだ。

で、会社の開発機には TEAC の US-366 というミキサー兼 USB 音源があるのでそいつと接続すると、PC からの音と iPhone からの音をミキシング(混ぜて)出せるようになるのですな。ちなみに US-366 と WB-BT300 は光デジタルケーブルで接続。

ところが、iPhone からの音しか出ない!! なんだこれ??

原因は WB-BT300 のデジタル フォーマットがサンプリング周波数 192kHz、量子化ビット数が 24bit のせい。このフォーマットは統一しておかなければならないのだが、たかが Bluetooth の音声受信装置でなんでこんな高い設定なんだwww
ちなみに CD はサンプリング周波数が 44.1kHz、量子化ビット数が 16 ビットだ。CD よりも音が悪いクセにデータ量は CD の 6.5 倍もあるwww

仕方がないので PC 側の出力も 192kHz の 24bit に設定した。こうすることによって無事 PC と iPhone の音が同時に出るようになった。

某絵描きから、イベントの福引きみたいなクジをデジタル化できないかという依頼があり、ごりごりと PHP と HTML と Javascript で作った。今流行の HTML5 というヤツだ(ぁ
中身はすぐに出来た。そりゃまぁ、そうか。クジ振るだけだから、出た乱数が何等賞なのかに変換して表示するだけである。

問題は管理画面である。単純にクジ、と言っても誰でも彼でもアクセスしてクジが引けるというワケにはいかない。以下の様な機能が入っている。

  • ユーザ登録して、ユーザ登録した人がクジを作れる
  • クジはいくつでも作れる
  • それぞれのクジには 1 ~ 10 等賞まで設定でき、さらに残念賞、参加賞が設定できる。そしてそれぞれの賞及びはずれがいくつあるのか設定するようになっている。
  • QR コードの表示
  • クジを引く画面を Javascript でアニメーションさせる。
  • 何等賞が出て、残り何の賞がどれくらい残っているかリアルタイムで監視する、モニター

使い方はユーザ(主催者)がクジを作ったら、そのクジを iPad などの端末で表示し、お客さんがそれをタップしてクジを引くというものだ。
さらに QR コードを吐いて、それをお客さんが撮影してクジを引くという機能もつけた。この場合、ちゃんと一回しかクジは引けないようになってるのだが、残念ながら Javascript では機種固有の識別番号を取得できないので、cookie になってしまった。そのため、cookie を消去すれば何度でもクジは引けてしまう。

ツイートでの愚痴は、HTML というかサーバのプログラムは一回一回が初めてのアクセスになるというか、仕組み上、同じ人が何度アクセスしようが、サーバ側は初めての人が初めてアクセスしたことにしかならない。
今アクセスしに来た人が前の○○という場所にアクセスしに来て、今のアクセスはそれの続きであるということは実は認識できないのだ。それを実現するために、cookie やらセッションやらっていう仕組みがあるのだが、とにかく一回一回のアクセスがすべて関連を持たせられないので、渡す数値だのなんだのも全部もらい直さないといけないので、プログラミングがすげーめんどくさいっていう話。

これが普通のプログラムだったら、さっききたアクセスは変数に残ってるし、その変数を参照して関数を呼び出せば済むんだけど、PHP だとアクセスが来るたびにプログラムは先頭から実行されてしまうのだ。

あと処理は PHP なんだけど、それを表示するのは HTML なのね。組み方としては PHP が処理の結果に応じて HTML を吐き出してるワケなんだけど、そうなるとプログラム ソースの中に PHP と HTML が混在してけっこう美しくない結果に……。今回は仕様書も何もないままテキトーに作り始めてしまったので分離されてないのだけど、予定してたより大きなプログラム(PHP 部分で 2000 行程度、Javascript が 500 行程度)になってしまったので、今後は気をつけたい(汗


(MP4 / 750×1334 / 25fps / 1’05” / 126MB / iPhone)

amatsukami.jp サーバの様々なサービスは、色々がんばって外に出してるんだけど、それでもやっぱり一部の機能は VPN を張らないと使えない。そのたびに端末(iPhone など)から VPN を張ってるんだけど、けっこうめんどくさい。
モバイル WiFi ルータに VPN を張る機能があれば、端末でいちいち張らなくても済むのになぁ……。

GD ライブラリに、しばし苦戦する

 

萌え時計というボクがテキトーに作ったウェブアプリ(?)があるのだが、それにキャラクタの大きさを変えられるようにしようと思いついたので、ちょっと組んでみることにした。萌え時計の仕組みはとても簡単で、背景画像とキャラ画像が別々になっていて、建物の外か中・時間帯・場所・表示するキャラの種類が決まったら、それに適した背景にキャラクタを合成して表示しているだけだ。

だから、キャラクタを拡縮して背景に貼り付ければそれで終了である。

って思ってたんだけど、そもそも読み込んだ画像を単純に拡縮する命令は、PHP5.5 以上じゃないと使えない(amatsukami.jp はPHP5.3)。ちょwww
では拡縮はどうするのかというと、背景と合成する時にキャラのどこからどこまでを、どこからどこまでとして貼り付けるなんて方法でやるのである。たちえば (0.0) – (99,99) という 100 x 100 ドット四方の画像を、貼り付け先の (0,0) – (199, 199) にってやると倍の大きさで貼り付けられるわけだ。
%指定ですらない!

そしてこの仕様では問題が起きる。背景の画像は 512×512 ドットあるのだが拡大率によっては立ち絵がこの大きさを超えてしまうこともあるのだ。そうなると貼り付け先の領域が存在しないことになって合成がうまく行かないのだ。
そこでどうしたかというと簡単に%指定できるように、立ち絵を読み込んだら、それに%分拡縮した何もない画像を作成し、そこに元の立ち絵を目一杯貼り付けて拡縮するようにした。そしてあらためて、背景にこの拡縮済みの立ち絵を貼り付けるのである。

まぁそんなわけで、キャラの大きさが指定できるようになった。

気温とか 4K とかカレーのシミとかミルクとか

またまた Twitter から拾った、いろいろくだらない&どうでもいいネタ。

暑い! ってただそれだけである。残暑は長し。

まぁメモ程度に。1080p と較べるとファイルサイズはほぼ倍。電池は 10 ポイント多く使用した。さすがに 4K クラスとなると HEVC で録画したいんだけど、Premiere で読み込めないので未だに互換フォーマット。というか、PhotoshopHEIF に対応してくれないと移行でできない……orz
すぐ対応すると思ったのになかなか対応しないなぁ……。

そう!こういうのないの? ボクは白が好きなので、割と白を着るんだけど……時々食事の時失敗しちゃうんだよねぇ。そしたらもうそれは選択肢なくちゃいけなくなる。上のようなウェットティッシュがあれば、ちょいちょいってその部分に薬品(?)を浸透させて、そのあとウェットティッシュ側に吸い取るみたいな……そういうのないのかなぁ。

先日 TAMA Networks の旧コンテンツを別サーバに移した。そしたら、訪問者カウンタがおかしくなった。理由は簡単で、リバースプロキシ(Application Request Routing)経由でアクセスするため、旧コンテンツから見たらリバースプロキシしかアクセスしてこないためだ(笑)。
旧コンテンツに何千人、何万人来ようが、全部リバースプロキシが間に入るので、旧コンテンツからしたら一人がすげー勢いでアクセスしてくるな、って事にしかならないのだw

と言うわけで、リバースプロキシ側で HTTP ヘッダに HTTP_X_FORWARDED_FOR という名前で、アクセスしてきた人の IP アドレスを入れて、それを旧コンテンツに渡し、また旧コンテンツでは REMOTE_ADDR でカウントするのではなく、先ほどの HTTP_X_FORWARDED_FOR でカウントするように書き換えた。これで解決。

シティハンターだったっけなぁ? キャッツアイだったかなぁ。女子高生とかを「ミルク臭い」と呼んでいたのを思い出した。確かに 10 代の女の子って代謝が早いせいなのか、ミルクのような臭いがしてた。でも最近、JC も JK も大人びちゃって化粧やら香水やらするから、あの臭いはしなくなったよなぁなんてことをふと思う(ぁ
脱いだら解るけど。

そしてエロゲを作ってるからかもしれないけど、アレだよね、すっかりミルク臭いなんて表現は使わなくなったって言うか、もう女子高校生や女子中学生くらいが恋愛のターゲットになっても驚かれなくなったよなぁ……。エロゲだと容姿的にそれくらいが普通だもんなぁ。

リバースプロキシって便利!

TAMA Networks の急コンテンツは Pukiwiki Plus ! というシステムで動いている。コイツは PHP 5.2 じゃないと動かない。5.3 以降では動かないのだ(どうも動くらしいのだが、IIS ではセキュリティ関連の機能がまったく働かない)。そのおかげで、amatsukami.jp サーバはずっと PHP を更新できないでいる。そうこうしているうちに PHP は 7 になってしまった。

一方、現在の TAMA Networks は WordPress というシステムで動いていて、これは現役のシステムであり、バージョンアップもされている。
そしていつかは WordPress が PHP5.2 では動かなくなるはずだ。現に WordPress のプラグインなどは 5.2 で動かないものもチラホラ出始めている。
しかし、先の Pukiwiki Plus ! のおかげで、こちらは PHP のバージョンを上げられない。
何かいい方法はないものか? と、色々考えたあげく、二つの方法を思いついた。

  1. amatsukami.jp サーバで複数のバージョンの PHP が動くようにする
  2. リバースプロキシを使って、Pukiwiki Plus ! を amatsukami.jp サーバから追い出す

と言うわけで①を試そうとしたんだが、IIS7.5 ではこれがどうもうまくいかない。
いや、7.5 でもできると思うんだけどなぁ……。結果的に旧コンテンツが動かなくなるw
そこでやる気を失って放置してたら、ウェブサーバが落ちたwww
どうやら旧コンテンツの実行にものすごく時間がかかるようになってしまったためで、旧コンテンツそのものにアクセス出来ないようにしたら、復活した。

これが 9/11 頃である。

その後も①に色々挑戦するも、何故かうまく動かない。まぁ amatsukami.jp サーバは 6 年も稼働し続けているし、その間、いろんな設定ミスだのなんだのをしてきたから内部がけっこうヤバいことになっているのかもしれない。
さっさと新しいサーバに移行しなければ……という結論には達するものの、技術的な勉強も兼ねて仮想サーバ(こちらは IIS8.0)に PHP を 2 バージョン(5.2 と 7)をセットアップした。するとすんなり両バージョンで PHP が動くではないか。なのでこの設定をそっくりそのまま amatsukami.jp サーバに持ってくると……やっぱり動かないorz
う~む、やはり amatsukami.jp サーバが怪しいんだなぁ……。

そこで amatsukami.jp サーバにリバースプロキシを設定する。そして http://amatsukami.jp/scripts/pukiwiki/ 及び http://amatsukami.jp/pukiwiki/ にアクセスしに来たら、それは仮想サーバの Pukiwiki を呼び出すように設定した。
と言うわけで上のメニューにある「今は昔」のリンク先は amatsukami.jp サーバではなく、仮想サーバで動いているコンテンツだったりする。

将来的にサーバを新調したら、どっちの方法でやるかは悩むな。サーバを新しくしたら当然そっちでは複数のバージョンの PHP が動かせるはずだ。となれば別にリバース プロキシに頼らなくてもよい。
ただ将来的な設計で、ロードバランサなどを置く場合は、そもそも全てのサイトがリバース プロキシでの運用になるだろうし……。まぁそれはその時になったら考えよう。

下の写真はシャンブラとボクが勝手に呼んでいる『上海ブラッセリー』の塩やきそばと半チャーハン。ここのチャーハンは紅生姜が入っているのが特徴だ。半チャーハンの写真がフタルあるのは、ここ、半チャーハンはお代わり自由だったんだけど、それがなくなり、「普通」「大盛り」「特盛り」が選べるようになった。その大盛りと特盛りの比較写真が、チャーハンが二つ並んでる写真だw
あくまでも半チャーハンの大盛りと特盛りなので、大盛りが普通のチャーハンくらいの量だと思ってもらえれば間違いないと思われる。ただし、残っているチャーハンの量に影響されるのか解らないが、けっこう日によって量は違ったりするw