ユーザーブロマガは2021年10月7日(予定)をもちましてサービスを終了します

Max 8 でニコニコの動画を再生してみる (基礎編)
閉じる
閉じる

新しい記事を投稿しました。シェアして読者に伝えましょう

×

Max 8 でニコニコの動画を再生してみる (基礎編)

2020-08-04 08:09

    目次

    1. Max 8 でニコニコの動画を再生してみる (基礎編)
    2. Max 8 + Node.js でニコ生コメントを取得する (練習編) comming soon
    3. Max 8 + Node.js でニコ動の動画を再生する (実践編) comming soon

    概要

    Max 8上でニコニコ動画のコンテンツを利用する方法を提供します。具体的には、シリーズ全体で次のようなことを目指します。

    • 動画IDの入力を受付け、対応するニコニコの動画をjit.movieで再生する
    • ニコ生のコメントを読んで、応答として動画を自動再生する

    本章では、どのようにすればニコニコの動画を再生できるかを説明します。技術的内容としては次章からが本番になります。

    導入

    目的

    ニコニコのコンテンツをMax 8(以下、単にMax)で利用したい人に有用な情報を提供することが目的です。想定読者は、Maxで簡単なシーケンサーが作れる程度の初心者の方で、Node.js、httpリクエスト、ニコニコAPIに初めて触れる人です。同じ状態から始めた私が悩んだ課題、はまった落とし穴について書いているので、上級者にとっては冗長かと思います。また、現時点で筆者は初心者から脱していませんので、解説や実装例が冗長、不正確あるいは危険である可能性があります。

    本章で取り扱う範囲は、Maxでニコニコの動画を再生する一番簡単な方法の紹介と、その改良方法までとします。Maxオブジェクトの解説もあります。Node.jsは次章まで登場しません。

    そもそもMaxとは?

    Maxは音と映像表現に特化したプログラミング環境です。機能のある箱(オブジェクト)を線(コード)でつなげて直感的にプログラミングするスタイルのソフトウェアで、Unityのスタイルと類似しているらしいです。

    Node.jsって何?

    Node.jsはサーバの構築、Webアプリ、スマホアプリなどの開発が得意なjavascript実行環境です。

    方法

    プレイヤーを作る

    簡単なプレイヤーこれでOK

    動画を再生するプレイヤーを作ります。上の図を参考に、オブジェクトを配置してください:

    メッセージボックス
    再生したい動画のパスを格納し、メッセージとして出力する
    prepend read
    入力されたメッセージの前に、内部メッセージ(read)前置して出力する
    ×
    メトロノームを有効にするためのトグルスイッチ
    qmetro 33
    再生状態を維持するために必要なメトロノーム。33msごとにbangというメッセージを送る
    jit.movie
    動画プレイヤー本体。read (動画へのパス)が入力されると、動画を読込む
    jit.pwindow
    動画データ(マトリクス)を受け取って、表示する。配置すると上のような黒い四角に変わる

    メッセージボックスをクリックすると、jit.movieread xxx.mp4というメッセージが渡されます。作業フォルダにxxx.mp4なる動画があれば、読込まれます。読込みに成功すると再生が始まり、jit.pwindowに動画が出力されるという、一連の仕組みができました。

    いちばん簡単な動画へのアクセス

    jit.movieread http://www.hoge~の形でURLを渡すと動画を再生できます。なお、いわゆるページURLではなく、動画ファイル本体へのURLを指定する必要があります。動画ファイルへのURLはここ(参考記事)に記載されています。URLをメッセージボックスに書いて、メッセージボックスをクリックすると、jit.moviereadつきのURLメッセージを受け取り、再生が始まります。※爆音に注意してください。サーバー側のノルマライズは無効です。

    簡単でしょう?

    改良

    再生できるようになったけれど

    残念ながら、このパッチャーはまだ実用的ではありません。なぜなら、Webブラウザがやり遂げるべき仕事に対して人力で介入して、途中から無理やりMaxにやらせているからです。また、URLをコピペした後、Webブラウザが動画ページを離れてしまうと、サーバーが通信を断ち切ってしまうため、Max側の再生が2分で止まります。他にも、問題は山積みです。

    課題と解決策

    再生をコントロールできない
    再生ボタン、停止ボタン、音量調節、シークバーを実装する⇒次項参照
    キャプチャしづらい
    jit.pwindowではなく、jit.windowを使う
    音量が動画ごとに安定しない
    jit.movieではなく、jit.movie~を使い、音量レベルに合わせてエフェクトをかける
    URLをWebブラウザからコピペするのが面倒
    (要Node.js) Maxでネットに接続して、動画URLを自動で取得できるようにする
    動画が再生中に途中で止まる
    (要Node.js) DMCサーバーにハートビートを送る
    点滅してまともに再生できない
    発生原因がわからず、解説できません……なにか心当たりあれば教えてください

    コントローラの実装

    ちょっと機能が増えました

    メトロノームは、bangのほかにgetstateを出力するようになりました。URL読込みはひとつ前の画像と全く同じフローです。start, stop, disposeボタン、getstateメッセージ、シークバー、音量調整バーが新しく追加されています。ポイントだけ解説します。

    send / receive (s / r)

    sendまたはsreceiveまたはrはフローを整理するためのオブジェクトです。s hogeへの入力は、そのままr hogeから出力されます。アプリケーションが大きくなってくると、Maxではオブジェクト間をコードでつなぐ必要があるので、どうしても多少スパゲティになります。そこで、srを要所で使って配線すると読みやすく、メンテしやすくなります。

    route

    routeはフローを制御するためのオブジェクトです。たくさんの引数を持つことができ、引数の数がn個の場合、n+1個のアウトレットを備えます。routeにメッセージが入力されると、そのメッセージの先頭の要素が、自分のもつ引数に一致するかどうかを判定し、n番目の引数に一致する場合は、n番目のアウトレットに出力します。ただし、判定に使用した先頭の要素は削られます。要素が1つしかない時はbangが出力されます。引数のどれにも一致しない場合は、最も右のアウトレットから入力したメッセージがそのまま出てきます。この例では、33ミリ秒に1回、getstateによってjit.movieから出てくるメッセージのうち、"position 値"のメッセージだけを拾って、値を127.0倍してからシークバーにsetしています。

    slider

    sliderは下限から上限までの値(デフォルトでは、0~127)を出力するオブジェクトで、マウスでドラッグ操作すると、滑らかに数値が変化します。ボリューム、シークバー、フェーダーなどなどに使えるUIオブジェクトです。sliderが値を受け取った時、その値に対応する位置にバーが移動し、そのまま値が出力されます。動画プレイヤーでは、シークバーの位置を更新する必要がありますが、上の例で値をそのまま入力してしまうと、フレームごとにループするようになります。値をそのまま渡すのではなく、"set 値"とすると、シークバーの位置を更新しつつ値は出力されなくなります。そこで、prepend setを入力の前段に置いて無限ループを回避します。

    speedlim

    speedlimは、指定した時間(ミリ秒)に何回値が入力されても最初の一回しか値を出力しないオブジェクトです。sliderは相当高頻度で値を出力するため、そのままjit.movieにつなげると、再生位置変更リクエストを何度もサーバーに送信することになります。これはサーバーの負担になると思われますので、speedlimでサーバーとの通信頻度を下げてあげましょう。

    おわりに

    おさらい

    • 動画本体のURLをjit.movieに渡せば、新サーバーの動画は再生可能
    • sliderの更新による無限ループに気を付ける
    • jit.movieが大量のhttpリクエストを送らないように気を付ける

    今回のパッチャーが欲しい人は、この文字列を*全部*コピーした状態で、MaxのツールバーでFile>New From Clipboardを選んでください。みんなもMax体験版ダウンロードして、一緒に遊びましょう!


    待てや!

    参考文献

    Max8が出たのでNode for Maxを試してみた
    MaxでAPIをたたくための情報
    ニコニコAPIリストwiki
    ニコニコが提供してくれているAPIの情報
    Nodejsでニコ生のコメビュを作る
    ログイン、ニコ生のサーバーと通信する方法
    ニコニコ動画の新仕様動画を再生する方法
    動画URLの取得方法、ハートビートについて
    ZenzaWatchのソースコード
    たぶんほとんどの疑問についての答えが書いてあると思います
    広告
    コメントを書く
    コメントをするには、
    ログインして下さい。