Pixiv Sketch Live でWebカメラを用いて配信したい

前書き

「Pixiv Sketch Live でWebカメラを使って配信したい」という前提で、どうにもうまくいかない・・?という方向けのトラブル解決に向けた記事です。

本記事では以下の流れで確認作業を行い、それを解説していくものとします

  1. PC上でWebカメラが認識されているか
  2. ブラウザ上でWebカメラが認識されているか
  3. ブラウザ上のプログラムでWebカメラが動作するか

1. WebカメラがPCに正しく認識されているか確認する

全てのケースに当てはまるとは限りませんが、昨今のPCにWebカメラを接続すると、一番最初に「ドライバ」と呼ばれる特別なソフトが自動でインストールされます。
ドライバとは、接続した機器( ここで言うWebカメラ )がPCに正しく認識されるようにしてくれるソフトのような物だと思って下さい。

ドライバが(自動で)インストールされたら、一度PCを再起動しておくと良いでしょう。
正しくドライバがインストールされれば、二回目からはその機器を接続しても、(前回PCに入れた)ドライバが用いられ、「差し込んだらすぐ使えるようになった!」という手軽さが味わえます。

※ 自動で、適切なドライバがインストールされない可能性もあります。 そのような場合は、付属のCD-ROMや、メーカーのWebサイトからダウンロードした適切なドライバをインストールさせる必要が出てくるかと思いますが、この記事では触れません。

1-1. WebカメラがPCに認識されているか確認する

「ドライバが正しくインストールされて、接続したWebカメラが認識したかな?」と思ったら、再起動ののち、一度PC上で確認してみましょう。

Windows10なら、ウィンドウズボタン 上で 「右クリック」 → 「デバイスマネージャー」 を選択します。

その他のOS(Windows7など)では、検索して「デバイスマネージャー」の開き方を調べてみてください
リンク:Googleで「デバイスマネージャー」を検索してみる

デバイスマネージャーを開くと、お使いのWebカメラの型番などが記された項目が見つかる筈です。
おそらく、カテゴリが「Webカメラ」や「イメージングデバイス」になっていると思います。
探してもそれっぽい項目が存在しない場合は、正しくWebカメラが認識されていない可能性があります。
( 余程のケースでなければ、別途、適切なドライバをインストールする事で認識されます )

型番などが記載されている、Webカメラを示す項目を右クリックし、「プロパティ」を選択すると、別ウィンドウで詳細項目が表示されます。「全般」タブの中に "このデバイスは正常に動作しています" と出れば、問題なくPCに認識されているはずです。

( 自分はLogicoolというメーカーのWebカメラを使っており、以下のような状態になっています )

2. Webカメラが、ブラウザに認識されているか確認する

Webカメラが正しくPC上で認識されていると確認出来たら、
次は 「ブラウザ側でどのように扱われて(認識されて)いるか」 を確認します

2-1. GoogleChromeの場合

chrome://settings/content/camera
のURLにアクセスすることで確認できます。
(また、Chromeのメニューから「設定」→「(一番下)詳細設定」→「コンテンツの設定」→「カメラ」の順でも、同じページに飛べます)

このページでは、「どのカメラをブラウザで使う?」というのと
「どのサイトでカメラの使用を許可する?」といった情報が 確認/設定 できます

PCによっては、このメニューから複数のWebカメラを選べたりするかもしれません。
実際に配信で利用できるWebカメラは1つだけなので、その場合は、使いたいWebカメラを選択しておきましょう。
( ※ Pixiv Sketch live の配信画面上でも、使いたいWebカメラを選択して選ぶことができます )

上記の画像だと、「許可」の項目に pixiv sketch live のドメイン(サイトのURL的なもの)が表示されています。
実際にWebカメラを用いて配信する時に、ブラウザ側から「このサイトでWebカメラを使っても良いか?」的な事を聞かれるので、一度でも「許可」すると、この項目に "許可済み" として登録されます。
この機能により、二回目からはブラウザから許可を求められる事は無くなります。

※ まだ許可してしない場合は、ページ上に項目が記載されませんが、PixivSketchLiveの配信時に訊かれるので、一度も配信(および許可)していない場合は気にする必要は無いでしょう

2-2. その他のブラウザ

すみません、つかっていないのでわかりません orz

ただ、FireFox でも、Microsoft Edge であっても、使うWebカメラを選択したり、どのサイトで使うかを許可する設定・管理ページのようなものはどこかからアクセスできるようになっていると思います...多分。

3. Webカメラがブラウザのプログラム上で使えるかをテスト

https://ss1.xrea.com/packetroom.net/webrtc.html

自作の簡易テスト用ページです。
「ブラウザ上で使えるかどうか」という自己完結型の処理なので、外部のサーバーなどに映像は一切送っていません。

上記サイトにアクセス後、左上にあるボタンを押します。
( 最初にWebカメラなどの使用許可を尋ねられると思うので、OKを押してください )

許可後、そのページでWebカメラから取り込んだ映像が映れば成功です


時雨堂 - Sora
https://sora.shiguredo.jp/#demo-box

上記URLの「リアルタイム配信デモ」という所から、機能のテストが行えます。

ピクシブ株式会社と実際に契約し、PixivSketchLive運用に関する技術・サービスを実際に提供している企業のサイト でもあります。


4. Sketch Live で配信

上記の流れが全て問題なく進めば、 Pixiv Sketch Live でWebカメラを使う準備が整っているはずです

あとは実際に配信枠を取り、配信直前の画面で「カメラで配信」を選ぶと、
視聴者側にWebカメラの映像が送られるのではないかなと思います。

※ WebカメラがPC・ブラウザに複数認識されている場合は、↓のスクリーンショットに「利用するWebカメラを選択するメニュー」が表示されている筈です。 利用したいカメラを正しく選んでください。

配信直後、以下のメッセージで再び確認。
有効にすると、Webカメラを通じてPixiv側に映像が送られます。