問題タブ [embedly]

質問する

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

62 問題
Newest
Active
Bountied
318
Unanswered
0 投票する
1 に答える
280 参照

embedly - Embedly カードでデータカード タイプのスタイルを強制する

Embedly Cardsの有料版を使用しています。概要では、特定の投稿に追加されたすべてのリンクを表示しています。現在、概要では投稿ごとに多くのスペース (+/- 高さ 500 ピクセル) を使用している標準カードを使用しています。

属性を持つ埋め込みカードはdata-card-type="article"、基本バージョンよりもはるかに小さくなります (+/- 高さ 200px)。この属性を使用してすべてのカードを強制的に小さくした場合にのみ、ビデオは埋め込まれず、YouTube などにリンクされるだけになります。したがって、私たちのプラットフォームで直接ビデオを見るのではなく、私たちのプラットフォームから離れてビデオを見る必要があります.

ここで、すべての標準リンクを「記事」カードに強制する必要がありますが、ビデオ カードのより大きなデザインは維持します。これは可能ですか？もしそうなら、どのように？

0 投票する
1 に答える
768 参照

iframe - 中程度のembed.ly notifyResize が Safari で機能しない

問題

私たちは、embed.ly へのoEmbed プロバイダーであり、記事にウィジェットを表示するために medium.comに統合されています。Embed.ly は、iFrame のサイズを内側から変更できる高さ制御 APIを提供します。これは機能しており、Safari を除くすべてのブラウザーで引き続き機能します。エラーがスローされるようになりました：

SecurityError: オリジンが " https://medium.com " のフレームがクロスオリジン フレームにアクセスするのをブロックしました。プロトコル、ドメイン、およびポートが一致する必要があります。

ここで例を参照してください: https://medium.com/climateaction/its-time-to-challenge-instagrams-climate-footprint-e15c67bc2b7c

2019-07-10 更新

medium.comは明らかに何かを変えました。今：

  1. 直接リンクを開いた場合は記載のバグは発生しません* yaeeehi *
  2. 概要ページから記事をクリックすると、まだ発生します* buuhhhh *
  3. 新しいバグがあり、カスタム ドメインへの埋め込みがまったく機能しなくなりました * arg *

「X-Frame-Options」が「sameorigin」に設定されているため、 「 https://medium.com/media/c31b8b0f7cb609aaf60d13f46e3777bf 」をフレームに表示することを拒否しました。

  1. Windows/Mac Mojave/... + Chrome/Safari/... に埋め込み用のダブル スクロールバーが追加されました。

詳細な説明

統合は次のとおりです。

  1. medium.comの記事には、 medium.com/media/... iFrameが統合されています。

  1. これにより、 embedly.com/widgets/... サイトを読み込む iFrameが再び統合されます。

  2. medium.com iFrame に正常に到達する window.parent.postMessage を呼び出し、notifyResize 関数が呼び出されます。

これは、parent._resizeIframe で中断します。これは、iFrame のコンテンツが https://medium.com から取得され、同じく https://medium.comである親にアクセスしようとするため、奇妙です。これについて何か考えはありますか？

シミュレーション

私の環境でエラーを複製しようとしましたが、うまくいきます：

  1. シミュレートされた medium.com の記事: https://test.posixion.com/tests/medium.html
  2. iFrame のシミュレート: https://test.posixion.com/tests/medium-embed.html
  3. 埋め込み統合をそのまま残しました

手がかり 1: コンテンツ セキュリティ ポリシー

medium.comのcontent-security-policyに関連している可能性があります。

しかし、一致する report-uri 呼び出しはありません。

手がかり 2: ソースの欠落

興味深いのは、iFrame ソース: https://medium.com/media/1389b69a290289ae20aedd68efce0d4b?postId=e15c67bc2b7c が webdeveloper のネットワーク タブに表示されないことです!? ただし、コンソールでページとして選択することはできます。


12345678910