このサイトとは別に家庭内の日記帳としてWordpressを運用している。HTTPサーバーはApacheでクライアントはChrome。
先日のとある行事をアップロードしたところ、Chromeで動画のシークができない。
やること。
原因
動画の問題なのかと調べたけれども見つからない。ブラウザの問題なのかと調べたけれども見つからない。原因が分からない…
で、こんなやりとりを見つけた。
stackoverflow / Seeking in HTML5 video with Chrome
そうか、HTTPサーバー側でも当たり前にできているはずと高をくくっていたが、Byte servingとかRange Requestへの応答とかそんなサービスへの対応の確認が必要なのか。
ここで言われているチェックをしてみた。
$ curl -H Range:bytes=16- -I https://hogeserver.hogeddns.jp/diary/files/2019/10/movie.mp4
HTTP/1.1 200 OK
Date: Sat, 19 Oct 2019 03:19:41 GMT
Server: Apache
Content-Length: 457915588
Last-Modified: Sat, 19 Oct 2019 01:26:25 GMT
ETag: "nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn"
Expires: Mon, 19 Dec 2022 13:06:21 GMT
Content-Type: video/mp4
200(OK)が返ってきているとき、メディアを途中から読み出すことは許されていないからChromeではシークできない模様。Firefoxはバッファするから読み取れるとかなんとかでも、バッファさせるとかって無駄な転送が必要になるからいやだな。
206(Partial Content)が返ってくるようにすべきだ。
どうやらApacheはRange Requestについて明示的に無効化しない限り応答する模様。
serverfault / How can i enable byte range request?
Qiita / HTTP Status 206(Partial Content)を抑制する
/etc/apache2/sites-enabled/～.conf
RequestHeader unset Range
確認したけどこんな記述は入っていない。これはおかしい。
問題はWordpressにありそうだ。
対策
ここに解決策がかかれていた。
TERRESTRIAL NAVIGATION / WordPress and partial content
過去の対策(今は上手くいかない)
過去にはAccept-Rangesを付けてあげれば良かったようだけれど、今は駄目になったよ、今はXSendFileを使えばいいよ、と。
実際に今となっては失敗するというAccept-Rangesを付けてみたけれども、確かに矛盾する結果が返ってくる。
$ curl -H Range:bytes=16- -I https://hogeserver.hogeddns.jp/diary/files/2019/10/movie.mp4
HTTP/1.1 200 OK
Date: Sat, 19 Oct 2019 08:00:43 GMT
Server: Apache
Content-Length: 457915588
Last-Modified: Sat, 19 Oct 2019 01:26:25 GMT
ETag: "nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn"
Expires: Mon, 19 Dec 2022 17:47:23 GMT
Accept-Ranges: bytes
Content-Type: video/mp4
対策
XSendFileを有効にするためには以下を実施。
stackoverflow / Install xSendFile in Apache Ubuntu 16.04
まず、XSendFileモジュールをインストールする。
$ sudo apt install libapache2-mod-xsendfile
…
apache2_invoke: Enable module xsendfile
# 既に有効化していた
$ sudo a2enmod xsendfile
Module xsendfile already enabled
設定を変更。
/etc/apache2/sites-enabled/～.conf
…
# 動画シーク
XSendFile on
XSendFilePath /usr/share/wordpress/wp-content/blogs.dir
…
※XSendFilePathにはwordpressのインストールパスを設定する。この環境はUbuntuパッケージをインストールするやり方だったのでここ。日本語版Wordpressからダウンロードしたパッケージを解凍したなら、/var/www配下とかににあるかもしれない。
モジュールは有効化していると書かれていたからreloadでも大丈夫かもしれないが、念のためApacheを再起動する。
$ sudo systemctl restart apache2
そして、Wordpressの設定を変更。
/usr/share/wordpress/wp-config.php
…
//動画シーク
define( 'WPMU_SENDFILE', true );
…
※これもインストール先によって場所が変わるかもしれない。
確認
これで確認してみると…取れてる。
$ curl -H Range:bytes=16- -I https://hogeserver.hogeddns.jp/diary/files/2019/10/movie.mp4
HTTP/1.1 206 Partial Content
Date: Sat, 19 Oct 2019 08:21:47 GMT
Server: Apache
Last-Modified: Sat, 19 Oct 2019 01:26:25 GMT
ETag: "nnnnnnnn-nnnnnnnnnnnnn;nnnnnnnnnnnnn"
Content-Length: 457915572
Content-Range: bytes 16-457915587/457915588
Content-Type: video/mp4
ブラウザでアクセスしてみる…おぉ、シークできたぜ！
やったこと
curlがSSLエラーとなった(1)
都合上、サーバーへの接続はApacheをProxyとして動作させて通過している。別のエラーが発生していると切り分けが難しくなるので、Application Serverでcurlコマンドを試すことにした。
そしたら…
$ curl -H Range:bytes=16- -I https://hogeserver.hogeddns.jp/diary/files/2019/10/movie.mp4
curl: (60) server certificate verification failed. CAfile: /etc/ssl/certs/ca-certificates.crt CRLfile: none
More details here: http://curl.haxx.se/docs/sslcerts.html
curl performs SSL certificate verification by default, using a "bundle"
of Certificate Authority (CA) public keys (CA certs). If the default
bundle file isn't adequate, you can specify an alternate file
using the --cacert option.
If this HTTPS server uses a certificate signed by a CA represented in
the bundle, the certificate verification probably failed due to a
problem with the certificate (it might be expired, or the name might
not match the domain name in the URL).
If you'd like to turn off curl's verification of the certificate, use
the -k (or --insecure) option.
このサーバーは独自CAによる自己署名されたサーバー証明書を利用しており、でも、このサーバー自身は独自CAを登録しておらず、これが原因で接続できなくなっていた。
検証しないオプションを付ける方法が書かれているのでやってみた。
$ curl -k -H Range:bytes=16- -I https://hogeserver.hogeddns.jp/diary/files/2019/10/movie.mp4
HTTP/1.1 200 OK
Date: Sat, 19 Oct 2019 05:54:42 GMT
Server: Apache
Content-Length: 457915588
Last-Modified: Sat, 19 Oct 2019 01:26:25 GMT
ETag: "nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn"
Expires: Mon, 19 Dec 2022 13:06:21 GMT
Content-Type: video/mp4
状態を見ることができた。
curlがSSLエラーとなった(2)
発生しているこの問題…
curl: (60) server certificate verification failed. CAfile: /etc/ssl/certs/ca-certificates.crt CRLfile: none
この問題を解消するためには独自CAを登録する方法もある。こちらの方が正統派のような気がする。
/etc/ca-certificates.conf
…
hogeserver.hogeddns.jp.crt
※最後の行に独自CAの証明書を追記
で、この証明書を以下に配置。
$ ll /usr/share/ca-certificates/
合計 64
drwxr-xr-x 3 root root 4096 10月 19 14:37 ./
drwxr-xr-x 427 root root 16384 5月 1 16:27 ../
drwxr-xr-x 2 root root 40960 1月 12 2019 mozilla/
-rw-r--r-- 1 root root 1375 10月 19 14:37 hogeserver.hogeddns.jp.crt
準備ができたら、以下のコマンドで反映させる。
$ sudo update-ca-certificates
これで問題なく接続できるようになった。
さいごに
以前はシークできたときもあったと思う。でも、気が付くとできなくなっている。なんでかなーと思いながらついつい後回しにしてきた。
動画に関する情報はとにかくたくさんある。Wordpressについても同じ。でも、この問題について語られているページを見つけることができないまま実は1年近くたっているんじゃないかな。今回も散々探して見つかったのは1つだけで、似たようなことが語られているところも見当たらなかった。partial content という言葉がキーだった。
他の人気ジャンルでもそうなんだけど、検索結果にバリエーションがないんだよな、動画 シークできない、みたいな検索ワードだと、動画が壊れているとか、コーデックが間違っているとかそんなのばっか。
別の検索エンジンを使わせてもらえばいいのか、検索キーワードを増やせばいいのか…なかなか難しいですね。
コメントはこちらから お気軽にどうぞ ～ 投稿に関するご意見・感想・他