sekitakovich のすべての投稿

G.Faure “Souvenirs de Bayreuth”

フォーレ&メサジェによる4手連弾「バイロイトの思い出」。フォーレのピアノ曲全集に入っていたこれを初めて聴いた時は「ナンジャコリャ!?」と思ったが、途中からはもう大笑い。思い出とはよく言ったもので、要はバイロイトから帰ってすぐ「指輪」の聞き覚えで作った(のであろう)カドリーユである。ヒトラーがこれで踊る姿を見てみたいもんだ。これは「ワグナーが苦手」という人にこそオススメ。

ちなみに「Fantaisie en forme de quadrille」なる副題が付いているが、これでは幻想どころかパロディである。なんでこんなのを、よりによってあのガブリエル・フォーレが作ったのやら? 作品番号も付いてないし、出版されたのは死後だし、謎だ。

備忘録 – CentOS+mecab+textseach_ja+PostgreSQL

これまで新たなサーバを立てるたびにしてきた作業、その2018年1月版。

mecab

/etc/yum.repos.dにgroongaを追加すれば辞書(ipadic)までyum一発(拍手)。

textsearch_ja

https://github.com/oknj/textsearch_ja (以前の配布元からここに移動した模様)からソース一式を取得、make。

# いまやPGroonga を使うべきなのかもしれないが旧い人間なもので …

textsearch_jaのPostgreSQLへのインストール

psql xxx -f /usr/share/pgsql/contrib/textsearch_ja.sql

エラーが出たら「LANGUAGE  ‘C’  STRICT」を「LANGUAGE  ‘c’  STRICT」とする。

イマ風なファイルのアップロードを実装する

これまではフォームの中に[input type=”file”]を置いて選択できるようにしとけば良しだったファイルのアップロードだが、最近ではwordpressの影響か「ファイルのドラッグ&ドロップができなきゃイヤ!」と宣うヤカラが増えてきた(実はかくいう俺もその一人だったりする)。

またその結果「もしかしてできるかな?」とドロップした画像がそこにちょこんと表示され、慌ててbackする事態が多発。「これはやはり対応しておいた方が良かろう」と思い、まずは「ドロップ領域を用意しておき、そこにファイルがドロップされたらfileエレメントにその内容を代入もしくは置換する」を目標に着手。

# ファイルのみならず他の要素も同時にアップするという点がポイント

結論から言えば、それはできた。但し「ドロップ領域を用意し、そこにファイルがドロップされたら」までは予定どおりだったが、その先は当初の予想とはまるで異なる様相と相成った。以下がそのサンプル。

http://www.klabo.co.jp/~k-seki/HTML5/DragAndDrop/

# urlのserver.phpは$_REQUESTと$_FILESをvar_dumpしてるだけ

その仕組みをざっくり説明すると

*  目に見えるフォーム(以下formとする)は従来のそれ
*  目に見えないフォーム(以下FormData)を追加
*  ファイルが選択されたらその内容を保存
*  ドロップされたファイルも同様に保存
*  送信に先立ちformの要素(file以外)をFormDataにappend
*  送信に先立ち保存されたファイルをFormDataにappend
*  ajax/POSTで後者を送信

という感じだが、たかだかこれだけの事でそのソースたるや複雑怪奇極まりないシロモノに膨れ上がり、こうして備忘録でも残しておかないと書いた本人でも読解困難に。折角だから今回ハマった点について記しておく。

1.  dropイベントはどこへ?

最初、dragenterは拾えるのにdropが来なかった。なんでやねん? と調べていて判明したのは、dragenter以降dropに至るまでの全てのイベントをpreventDefault()しなければdropが発生しないという仕様。アホかと思ったが、仕様とあらばそれに従うしかない。

2.  <input type=”file”> は参照のみ?

当初は「ファイルのドロップをトリガーに<input type=”file”>の内容を設定もしくは置換」すればOKだろうと思ったんだが、代入ができたのはChromeだけで他はぜんぶダメ。「これができない=submitが使えない」とわかった時の失望たるや(涙)。結果これは潔く諦め、FormDataを使う事に。

3.  FormDataの実装状況

その内容をコンソールでチェックしようと思ったら、これが一切出てこない。理由など知らんが、出ないものは出ない。これだけでも「はぁ〜」だったが、どうにか動くところまで持って行ってひと安心 … と思ったら今度はこれがedgeでエラー! なんとFormDataのメソッドのうち、edgeで使えるのはappendぐらいしかないではないか。「嗚呼またコイツか!」と天を仰ぎ、最初はブラウザ判別して条件分岐させようかと思ったが、どうにかappendだけで済むよう修正した。