0

Rails 3.2アプリのベンダーアセットディレクトリにFancyBoxをインストールしています(たとえば、jquery.fancybox.pack.js、jquery.fancybox.css、およびベンダーアセットフォルダー内のそれぞれのディレクトリにある関連イメージ、追加機能はありません)。

javascriptとCSSアセットは、アセットパイプラインのapplication.jsファイルとapplication.cssファイルの両方に読み込まれます。また、クリックすると画像が正しくポップアップするため、実際に機能していることをテストして確認しました。

問題は、YouTubeビデオモーダルがロードされないことです。代わりに、1秒ごとにちらつく読み込み中のGIFが表示されます。

jQuery(CoffeeScript)コードは次のとおりです。

$(document).ready ->
  $(".videopopup").fancybox
    maxWidth: 800
    maxHeight: 600
    fitToView: false
    width: '70%'
    height: '70%'
    autoSize: false
    closeClick: false
    openEffect: 'none'
    closeEffect: 'none'
  return

そして、これがページ内のリンクコードです:

<%= link_to image_tag('thumbnail.png', alt: 'Thumbnail', class: "responsive"), 'http://www.youtube.com/embed/myvideocode?fs=1&autoplay=1', class: 'videopopup', title: 'My Video' %>

これをローカルホストで実行していますが、これが問題になる可能性があります。Chromeでコンソールを調べたところ、次のエラーが見つかりました。

XMLHttpRequestはhttp://www.youtube.com/embed/myvideocode?fs=1&autoplay=1を読み込めません。Originhttp://localhost:3000はAccess-Control-Allow-Originで許可されていません

このエラーの意味を誰かが知っていますか?このエラーについていくつかのSOの質問を見てきましたが、Railsでそれを乗り越える方法に関する具体的な解決策はありません。または、私は何かが欠けていますか?

4

1 に答える 1

1

実際、あなたが投稿したエラー メッセージは自明です。セキュリティ上の制限により、Ajax リクエストは許可されていません。

本当の問題は、iframe を作成する必要があるのに、なぜスクリプトが ajax リクエストを行うのかということです。スクリプトはコンテンツ タイプを推測できないようです。JFK が既に述べたように、クラス名「fancybox.iframe」を追加することで解決できます。

于 2012-08-31T07:31:50.940 に答える