YouTube vs Vimeo 動画埋め込み幅

トピックを作成する際に動画リンクを貼り付けるだけで、どの動画でも埋め込むことができます。
しかし、YouTube動画を埋め込むと(下記参照)、端から端まで引き伸ばされるのはなぜでしょうか?Vimeoの動画を埋め込むと、端から端まで引き伸ばされません。

これは修正できますか?

VIMEOの埋め込みコードで動画サイズを指定しても、違いは見られませんでした。動画は動画リンクを貼り付けた場合と同じように表示されます。

どちらの場合も、動画のURLを貼り付けるだけです。

YouTube

Vimeo

https://vimeo.com/300660748

ここでは動画を埋め込めないようです。コミュニティからのスクリーンショットを以下に示します。Vimeo動画の幅はYouTube動画の幅よりも短いです。Vimeo動画も最大許容幅まで拡張するようにできますか?

「いいね!」 4

フル幅のVimeoワンボックス用のPRです

「いいね!」 6

テスト

YT

Vimeo

「いいね!」 5

Falcoさん、こんにちは。

Discourseは初めてで、あなたが言及した「フル幅のVimeo onebox用のPR」が何を意味するのか全く分かりません。

テストが機能するようになったことを示してくれましたが、それを機能させるにはどうすればよいのでしょうか?私のコミュニティでは、Vimeo動画はまだフル幅に拡大しません。

あなたが上記の投稿で行ったことをまだ理解しようとしています。コミュニティでこれを修正するために何をする必要があるか教えていただけると、本当に感謝します。よろしくお願いします。

「いいね!」 1

アンバーさん、

PRとは「プルリクエスト」のことで、GitHubを指します。基本的に、FalcoがDiscourseのコードに変更を加え、その変更をDiscourseにマージする前にレビューを求めていることを意味します。

この特定のDiscourseサイト、meta.discourse.orgは、エンジニアのいずれかが変更を加えるたびに自動的に更新されます。あなたのサイトは自動的にデプロイされるわけではありません。お客様のサイトは定期的ですが、それほど頻繁ではない頻度でデプロイしています。サイトのデプロイ(更新)を開始しました。デプロイは約30分で完了するはずです。

デプロイが完了したら、投稿を再構築する必要があります。これを行うには、投稿の下にある「さらに表示」ボタンをクリックし、管理者のレンチをクリックします。最後に、「HTMLの再構築」をクリックします。



「いいね!」 4

ファルコ様、
本当にありがとうございます。

ジョシュア様、すべてを明確にしていただき、本当にありがとうございます。感謝いたします。

「いいね!」 3

Falco様

この変更は、プライベートVimeo埋め込み(つまり、?h=<some identifier>が付加されたプレーヤーリンク)でも機能しますか?

コミットのコード変更を見ると、以前は機能していたので、この変更でも機能するはずです。 :slight_smile:

「いいね!」 2

埋め込みサイズに奇妙な点があります。このコミットの後でも、プライベート動画のサイズは小さいままです。それらもフル幅にできる方法があればいいのですが?

「いいね!」 1

Vimeoアカウントを持っていないため、プライベートビデオを作成できません :person_shrugging:

「いいね!」 1

私も同じ問題が発生しています。Discourse 2.9.0.beta9 (56832adf17) を実行しています。

これは特に小さい画面で問題になります(この画面をリサイズすると、2番目のOneBoxedされたものがどれほど小さくなるか確認できます)。


こちらがプレイヤーがURLに含まれているリンクです…(これは小さい画面で縮小しませんが、中央に配置する方法がわかりません。)

https://player.vimeo.com/video/743344591


そして、ここにある下のものはOneBoxedされています…(これは小さい画面サイズで縮小し、非常に小さくなります。)

https://vimeo.com/743344591

それで大丈夫ですか? merge が私たちのインスタンスに影響を与えないということは、どうすれば可能なのでしょうか?

何か見落としているのかもしれません :slight_smile:

それはどのように投稿されましたか?投稿をそのまま共有してもらえますか?

「いいね!」 1

Vimeo から Discourse コミュニティに動画を共有するテストを行っています。以下は生のデータです。

テスト

https://vimeo.com/channels/staffpicks/353070045

VS

https://vimeo.com/353070045

使用されたURLの形式が認識されないため、Vimeoの特別なコードではなく、汎用的なoneboxコードが使用されています。

「いいね!」 2

ジェフが数年前に共有したリンクを使用しました。おかげで、今は良くなりました!

(しかし) なぜフル幅ではないのですか? まだ固定されています :cry:

アスペクト比が4:3のビデオだからです。

「いいね!」 2

iframe経由で埋め込まれる際に、明示的に高さと幅を指定している他のOneBoxソースにも、このロジックを適用できないのはなぜでしょうか?


考察とアプローチ
理論的には、すでに明示的な高さ/幅があり、それがiframeで指定されている場合、アスペクト比を設定する一般的なアプローチを使用して、汎用的にスケーラブルにすることができます。

例えば、コミュニティに動画デモをますます多く埋め込むようになり、CDNで知られるBunny.netと、動画のアップロードと埋め込みのためのBunny Streamサービスに切り替えました。

video.bunnycdn.comiframe.mediadelivery.netを許可iframe設定に追加した後、Bunny StreamのURLを簡単に貼り付けることができ、汎用的なフォールバックを使用してOneBox化されます… しかし、モバイルデバイスで表示するとアスペクト比が非常に奇妙になります。:confused:

簡単な回避策として、Plugin APIとdecorateCookedElementを使用してiframeにアスペクト比情報を更新するシンプルなテーマコンポーネントを作成しました。

これに関して何かアップデートはありますか?

Bunny.netは、サービスの質とスピードのおかげでますます人気が高まっています。

Discourseにbunnyストリーミング動画を埋め込むことはもうできますか?