【WordPress + Contact Form7 + Android】AndroidのLINEのブラウザ（Webview）で「添付ファイル」ボタンが動かない（input type= “file”）

LINEでURLを送った時に、
そのURLをタップすると、LINEのアプリ内でWebが閲覧できますよね。

このLINEアプリ内でWebを開いたときに、 WordPressとContact Form7を使って作ったメールフォームの、

「ファイル添付ボタン」がクリックしても反応しない、動かないという現象がありました。

調べるのに時間を使ってしまったので、メモしておきます。

※LINEアプリ内でWebを閲覧する事を、以下「LINEアプリ内ブラウザを使う」と表現します。

原因：accept属性の設定が拡張子の場合、動作しない。MIMEで設定すること。

LINEアプリ内ブラウザではaccept属性の指定はMIMEで設定をしてあげる事で、動作するようになりました。

他メールフォームを調べた所、
LINEアプリ内ブラウザを使ってもinput type=”file”自体は正しく動作しておりましたので、
Contact Form7で吐き出したhtmlと見比べてみました。

Contact Form7では「拡張子」で設定しています。

accept=".jpg, .png"

しかし、LINEアプリ内ブラウザで動作したinput type=”file”は「MIME」で設定していました。

accept="image/jpeg, image/png, image/gif"

プラグインContact Form7の改修内容

今回、代替プラグインを探すかなど、いろいろ検討したのですが、
急ぎという事もあり直接プラグインに手を入れています。

プラグインはご存知の通りアップデートが必要なので、この方法は推奨しません。

改修ファイル：plugins/contact-form-7/modules/file.php

バージョン：5.1.3

/* コメントアウト
$atts['accept'] = wpcf7_acceptable_filetypes(
$tag->get_option( 'filetypes' ), 'attr' );
*/

//これを追加
$atts['accept'] = 'image/jpeg,image/png,image/gif';


また、コードを読んで頂いた通り、管理画面でaccept属性を設定できる機能を壊しています。柔軟性が低下中です。

ですので、あくまでも何がどうなって（今回は）解決したかという事だけを覚えておけたらよいかと思います。