对于我的Rails应用程序,我有一些项目,用户可以在其中通过Redactor Rails发布更新。我为每个项目制作了BLOGPOSTS
的 Controller 和模型。现在,他们可以使用这种富文本编辑器来嵌入视频。但是,我正在探索添加选项的选项,该选项允许用户直接在我的网站上与youtube进行网络摄像头录制,并将其上传到youtube并作为该项目的BLOGPOST发布。目前,博客文章以t.text "content"
的形式保存在blogupdates表中。
我在这里引用了文档:https://developers.google.com/youtube/youtube_upload_widget
* *问题:当我添加youtube上传小部件时,它显示了摄像头。然后录制,然后生成上传的视频进行播放。但是,是否有一种方法可以获取视频ID,并在记录视频后自动将其保存为带有设置的html的“BLOGPOST” content
?
因此,我在每个项目页面中添加了以下内容:
view / projects / show.html.erb
<script>
// 2. Asynchronously load the Upload Widget and Player API code.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. Define global variables for the widget and the player.
// The function loads the widget after the JavaScript code
// has downloaded and defines event handlers for callback
// notifications related to the widget.
var widget;
var player;
function onYouTubeIframeAPIReady() {
widget = new YT.UploadWidget('widget', {
width: 500,
events: {
'onUploadSuccess': onUploadSuccess,
'onProcessingComplete': onProcessingComplete
}
});
}
// 4. This function is called when a video has been successfully uploaded.
function onUploadSuccess(event) {
alert('Video ID ' + event.data.videoId + ' was uploaded and is currently being processed.');
}
// 5. This function is called when a video has been successfully
// processed.
function onProcessingComplete(event) {
player = new YT.Player('player', {
height: 390,
width: 640,
videoId: event.data.videoId,
events: {}
});
}
</script>
<div class = "container">
<div id="widget"></div>
<div id="player"></div>
</div>
此外,每个页面还显示“编辑器Rails”表单:
<%= form_for([@project, @project.blogposts.build]) do |f| %>
<div class="field">
<%= f.text_area :content, label: "Blog Posts", :class => "redactor", %>
</div>
<%= f.hidden_field :user_id, :value => current_user.id %>
<div class="actions">
<%= f.submit "Add Blog Post", :class => "btn btn-header" %>
</div>
<% end %>
blogposts_controller.rb
def create
@project = Project.find(params[:project_id])
params[:blogpost][:content] = sanitize_redactor(params[:blogpost][:content])
@blogpost = @project.blogposts.create!(params[:blogpost])
if @blogpost.save
redirect_to blogs_project_path(@project), notice: "Blog entry created."
end
end
schema.rb
create_table "blogposts", :force => true do |t|
t.integer "user_id"
t.integer "project_id"
t.text "content"
t.datetime "created_at", :null => false
t.datetime "updated_at", :null => false
end
最佳答案
我对该博客平台不熟悉,因此我的答案将不特定于此。
通常,有两种使用YouTube iframe播放器嵌入视频的方法。一种方法是使用YT.Player
构造函数以编程方式添加嵌入,以替换页面DOM中的现有元素。这就是您在提供的代码中所做的。
另一种方法是在页面的DOM中显式包括<iframe>
和相应的属性。很有可能这将遵循标准模板,而另一件事需要更改的是视频ID。要在嵌入式播放器中加载<iframe>
的示例VIDEO_ID
标签是
<iframe type="text/html" width="640" height="390"
src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0"></iframe>
因此,如果您想保存一些包含YouTube嵌入内容的HTML(到数据存储区或任何地方),最好的方法是在HTML中包含
<iframe>
标签,并使用与新上传的视频相对应的正确VIDEO_ID
值。