メインコンテンツへスキップ

検索

Hi. How can we help?

Webサイトの埋め込み

  • 更新

LiveU Studioレイヤー用の埋め込みWebページ


1. 背景の透過

HTMLページのボディの透過はアルファチャンネルやクロマキーではなくCSSで取り扱います。

以下のCSSルールのいずれかを追加します。

body {
    background-color:rgba(0,0,0,0);
}

もしくは

<body style="background-color:rgba(0,0,0,0);">


2. LiveU Studio埋め込みWebサイトのユーザー操作

LiveU Studio埋め込みWebサイトではユーザー操作は出来ません。(サーバー側のブラウザーでウェブページを開いているとお考え下さい)

  • LiveU Studio上のウェブページはクリック等、操作をすることが出来ません。
  • ローカルデータの保存による設定の変更、保存は出来ません。
    (例えばクッキーによる設定の保存は出来ません)

埋め込むページの設定はURLクエリパラメータとして指定します。
例: https://yourpagetoembed?setting1=test&setting2=option 

"X-Frame-Options"エラーに関して

"X-Frame-Options"エラーは以下のように表示されます。
"Refused to display ''https://your-website' in a frame because it set 'X-Frame-Options' to 'XXX'"
Webページのレスポンスヘッダーとメタデータの両方もしくはいずれか一方を変更することでこのエラーへ対処することが出来ます。変更出来ない場合、Webサイトポリシーにより埋め込みが無効化されているということになります。

  •  "X-Frame-Options"ヘッダー
    "ALLOWALL"もしくは"ALLOW-FROM https://www.LiveU Studio"(
    LiveU Studioへの埋め込みだけを許可したい場合)で埋め込みを許可します。
  • "Access-Control-Allow-Origin"ヘッダー
    "*", https://www.studio.liveu.tv の追加, もしくはヘッダーの削除にて埋め込みを許可します。
    Regarding the "X-Frame-Options" error

詳細情報

最新バージョンのChromeブラウザーの使用を推奨いたします。
Chromeのクッキー設定がcookies are accepted on all sites (Cookieをすべて受け入れる)になっていることをご確認ください。(設定されてない場合、LiveU Studioのコントロールパネルの表示に問題が生じます)

3. LiveU StudioがWebページをロードしていることの検出

https://developer.mozilla.org/en-US/docs/Web/API/Document/referrer

ソースページの検出にはhttps://www.whatismyreferer.com/ を使用することが出来ます。(LiveU Studioに新しいWebページ入力として追加します。) ホストネームがprogram.studio.liveu.tv であれば、LiveU Studio のprogram関連のURL、*.studio.liveu.tv であればLiveU Studioのpreview関連のURLです。

 

お探しの情報は得られましたでしょうか？
お探しの情報が得られなかった場合にはライブチャット(英語)にてLiveU Studioサポートチームにお問い合わせいただけます。