Question

我花了大部分时间阅读文档并观看有关如何在我的网站上嵌入YouTube的各种视频，并取得了一些进展。但我现在有点卡住了。

我正在开设一个网站，其中包括查看我的用户个人资料，获取他们最喜爱的团队，然后将该团队上传的视频显示到其官方YouTube频道。

我正在使用Data APi v3并使用HTTParty。我能够获取视频ID，这是我需要的，以便检索每个视频资源。这很好。这是代码。（y_user是频道名称，y_key是我的API密钥）

__

获取频道信息....

response = HTTParty.get("https://www.googleapis.com/youtube/v3/channels?part=id%2C+snippet&forUsername=#{y_user}&key=#{y_key}")

channel_id = response["items"][0]["id"]

新来电，这次使用频道ID并从频道请求六个视频记录。

channel_info = HTTParty.get("https://www.googleapis.com/youtube/v3/search?part=id%2C+snippet&channelId=#{channel_id}&maxResults=6&order=date&key=#{y_key}")

现在从每个视频记录中获取视频ID ..

@video_ids = []
channel_info["items"].each do |item|
  @video_ids.push(item["id"]["videoId"])
end

为每个视频ID获取视频资源...并检索播放器的嵌入代码。

@videos = []
@video_ids.each do |video_id|
  source = HTTParty.get("https://www.googleapis.com/youtube/v3/videos?part=id,snippet,player&id=#{video_id}&key=#{y_key}")
  single_video  = source["items"][0]["player"]["embedHtml"]
  @videos.push(single_video)
end

和我的HTML ....

<% @videos.each do |v| %>
    <div class="video-slide"><%= v %></div>
<% end %>

这对我来说是一个六个iframe，对应于我要求的六个视频，这就是我想要的。您可以看到每个视频ID都是唯一的....

<iframe type='text/html' src='http://www.youtube.com/embed/fNyKJjARuj4' width='640' height='360' frameborder='0' allowfullscreen='true'/>

<iframe type='text/html' src='http://www.youtube.com/embed/6HxJG60kZCI' width='640' height='360' frameborder='0' allowfullscreen='true'/>

等...

我现在不清楚的是如何为每个玩家渲染一个玩家（每个玩家都会生活在幻灯片中）。如果我按原样保留代码，我可以看到如图所示的iframe HTML，但没有播放器。

但是如果我添加.html_safe ....

<div class="video-slide"><%= v.html_safe %></div>

它呈现一个玩家 - 但仅限于其中一个iframe。即使在检查代码时，其他人也完全消失了。

我不确定此时该怎么做。我怀疑我不应该使用html_safe，而是使用iframe api信息页面（下面）中的信息手动为每个iframe创建播放器，但此时我有点不知所措。任何帮助都会非常感激。

https://developers.google.com/youtube/iframe_api_reference#Examples

Answer 1

好吧，所以我最终删除了这个：

@videos = []
@video_ids.each do |video_id|
  source = HTTParty.get("https://www.googleapis.com/youtube/v3/videos?part=id,snippet,player&id=#{video_id}&key=#{y_key}")
  single_video  = source["items"][0]["player"]["embedHtml"]
  @videos.push(single_video)
end

而只是将原始的video_ids数组返回到DOM，然后通过迭代来获取每个视频ID，然后将iframe包裹起来就像这样....

<% @video_ids.each do |v| %>
<iframe id="player" class="video-slide" type="text/html" width="600" height="375"
src="http://www.youtube.com/embed/<%= v %>?enablejsapi=1&origin=http://localhost:3000.com"
frameborder="0"></iframe>
<% end %>

它的工作原理......或多或少：）

为使用Data API V3检索的多个视频资源创建YT播放器

1 个答案: