另一个CORS问题？

Question

我有主机http://myhost.dev的rails应用程序，它使用vk.com（俄罗斯facebook）的API搜索音乐，所以它提供了搜索方法audio.search。这是我的 search.js.erb，它通过远程链接调用某些控制器的搜索操作：

VK.api('audio.search',{q: "<%= j params[:query] %>", auto_complete: "1", sort: "2", count: "200"},function(data){
  if(data.response) {
    $(function() {
      var audio = $('audio');
      // Setup the audio.js player
      var a = audiojs.create(audio);
      });
      // Load in the first track
      var audio = a[0];
          first = $('ol a').attr('data-src');

      console.log(first);
      $(".song-title").text($('ol a').first().text());
      $('ol li').first().addClass('playing');

      // load resource to player
      audio.load(first);
      });
    });

  }

  else {
    /* handle error */
  }
});

我的 application.js：

  // initiate vk application
  VK.init({
    apiId: '3650724'
  });

没关系，一切正常，但是，它不在另一条路线上！例如，在http://myhost.dev/foo 的路线上，我还有另一个音频标签，代码如下：

:javascript
  var artist = '#{ @artist.name }';
  // Setup the player to autoplay the next track

  // Setup the player to autoplay the next track

  // Load in the first track
  var track_name = $('ol a').first().attr('data-src');
  VK.api('audio.search',{q: artist + " - " + track_name, auto_complete: "1", sort: "0", count: "1"},function(data){
    if(data.response) {
      $(function() { 
        alert("lol");
        var audio = $('audio');
        var a = audiojs.create(audio);
        var first_track = data.response[1];
        $(".song-title").text(first_track.title);
        $('ol li').first().addClass('playing');

        console.log(first_track.url);
        audio.load(first_track.url);
      });
    }
    else {
      alert("fail!");
    }
  });

它返回有效的 json 响应，但是在将资源 url 加载到播放器时它给了我

XMLHttpRequest cannot load http://cs4967.vk.me/u5366455/audios/some.mp3. Origin http://myhost.dev is not allowed by Access-Control-Allow-Origin.

Answer 1

这不是您的 API 请求的问题，但对于 <audio /> 元素（以及与此相关的 <video />）仅请求 on the same domain。

VK 不会为您列出的 URL 发出 CORS 标头（尽管它是 404）。如果是这种情况，您可能必须使用自己的服务器作为代理，将 mp3 检索到您的服务器上，然后从那里进行流式传输。