ブイキューブトップ
03-6845-0775平日10:00〜18:00受付
無料ガイド お問い合わせ

2022年05月19日

Agora.io Chromeで画面（アプリケーション）共有

Agora.ioのWebRTC SDKで画面（アプリケーション）共有を実装する際の流れを紹介します。


Githubに公開しています

お役立ち資料ダウンロード

オンライン体験におけるブイキューブの技術サポートのご案内

【図解】システム開発のお手伝い

ブイキューブのソリューションアーキテクトが、寄り添います！
各種ライブ配信システムのアーキテクチャについて わかりやすい構成図にてご紹介！

無料ダウンロード

開発環境

Chrome 85.0.4183.83
AgoraVideoSDK for Web 3.1.2

使用するAPI

    createStream(spec: StreamSpec): Stream

実装内容

CreateStreamのscreenをtrueするだけです。

rtc.localStream = AgoraRTC.createStream({
     streamID: rtc.params.uid,
     audio: true,
     video: true,
     screen: true,　 ←ここ
     screenAudio: true
    })

画面

（APPID、Channelを入力してJoinをクリック

画面共有のダイアログ表示時

画面共有時

補足

・Web SDK v3.0以降、Windows Chrome74以降より音声共有もできます。詳細はこちら
・Web SDK v2.6またはChrome72以下の場合はプラグインが必要です。

関連リンク

・画面共有のドキュメントはありますか？
・画面共有のサンプルはありますか？
・画面共有で、ブラウザ(Chrome)標準の中止ボタンを押した場合、そのイベントをリッスンする方法はありますか？

そのほか、最新の実装例・サンプルコード記事はこちら
ガイドブックダウンロード
ビデオ通話・ライブ配信API/SDK「Agora」

超低遅延API/SDK「Agora」ガイドブック

通話・配信遅延30-200ms！100万人の視聴対応！未経験者から専門家まで、誰でも読みやすいAgoraのガイドブックをダウンロードしませんか。

無料ダウンロード
ブイキューブ

執筆者ブイキューブ

Agoraの日本総代理店として、配信/通話SDKの提供だけでなく、導入支援から行い幅広いコミュニケーションサービスに携わっている。

関連記事

2022年05月13日

Agora.io VideoSDKの画面共有(ScreenSharing)実装例（その1）

  • 実装例・サンプルコード
  • Agora
  • WebRTC
※2020年の記事です。 現在、Agora.io VideoSDK 画面共有（ScreenSharing）については、サンプルが用意されています。 上記サンプルは、Joinボタンクリック時に画面共有（ScreenSharing）ダイアログが表示され、キャンセルするとleaveします。 今回は、(Joinしたまま)leaveせずに画面共有ダイアログを何度も表示できるサンプルに改造します。 Githubに公開しています　

2022年05月13日

実装例｜ビデオ通話アプリ（WebRTC版）

  • 実装例・サンプルコード
  • Agora
  • WebRTC
※2019年の記事です。 Agora SDKのビデオ通話アプリ（Web RTC版）の実装例・サンプルコードについてご紹介します。

2022年05月13日

WebRTCでスマホのカメラ切り替え(前面-背面)

  • 実装例・サンプルコード
  • Agora
  • WebRTC
Agora.io WebSDKを利用したスマホのカメラ切り替えの説明です。 サンプルコードはこちらにあります。 基本的に映像Trackを切り替える事で実現可能ですが、一部Android(HUAWEIやSamsung）で正常に動作しない場合があるので2種類記載します。

2022年05月13日

Agora.ioでコラボレーション配信の実装

  • 実装例・サンプルコード
  • Agora
  • iOS
  • Android
instagram等でコラボ配信（複数拠点からの配信）をよくみかけるようになりました。 Agora.ioのSDKを用いたコラボ配信については実績が多数あります。

2022年05月13日

Agora.io VideoSDKの画面共有(ScreenSharing)実装例（その2）

  • 実装例・サンプルコード
  • Agora
  • WebRTC
※2020年の記事です。 現在、Agora.io VideoSDK 画面共有（ScreenSharing）については、サンプルが用意されています。 上記サンプルには、画面共有（ScreenSharing）と映像を両方表示するように実装されていないため、今回は、両方を表示できるサンプルに改造します。 Githubに公開しています。
Agora 勉強会 好評実施中！ご参加はこちら

    タグ一覧

    人気記事

    2024年08月22日

    【入門】WebRTCとは？一般的な仕組み・サーバー構成を解説（シグナリング/TURN/SFU）

    2023年02月07日

    ジッター（ジッタ）とレイテンシー（レイテンシ）：違い・原因・解決方法

    2022年07月08日

    レイテンシー（レイテンシ）とは？ ネットワークの役割と低遅延の手法

    2024年08月19日

    HLS（HTTP Live Streaming）とは？概要・仕組み・課題など

    2024年08月22日

    WebRTCの商用サービスまとめ｜Amazon Chime, Agora, twilio, SkyWay など

    新着記事

    2024年12月11日

    遠隔授業やオンライン会議に最適な Flexible Classroomソリューション —豊富な機能をパッケージ化—

    2024年12月04日

    Agoraで独自のオンラインレッスンアプリを作る

    2024年11月25日

    Astroを用いたクラウドレコーディングの実装

    2024年11月07日

    AgoraとOpenAI : リアルタイムで自然な会話型AIを可能にする

    2024年11月06日

    Why Agora ~ Agoraの優位性 ~

    先頭へ戻る