- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
当我浏览获取和应用 Youtube iFrame API 的脚本时,onYoutubeIframeAPIReady()
不会运行,请求的视频也不会加载。有没有解决的办法?我做错了什么吗?
这是我的脚本:
var Command = require('../model/command.js');
var Control = require('../model/control.js');
var User = require('../model/user.js');
var socket = io();
var executions = {};
executions[1] = function() { player.playVideo(); };
executions[2] = function() { player.pauseVideo(); };
var control = Control();
var now = function() { return new Date().getTime() / 1000; };
var user = User();
var update = function() {
control.room = $('#name').text();
if (user.last) {
if (user.command.date > user.last) {
player.seekTo(user.command.time, true);
executions[user.command.state]();
control.last = user.command.date;
}
} else {
player.seekTo(user.time, true);
executions[user.state]();
control.last = now();
}
control.time = player.getCurrentTime();
control.state = player.getPlayerState();
socket.emit('control', control);
};
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
videoId: 'M7lc1UVf-VE',
playerVars: {
'controls': 1,
'rel': 1,
},
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
$('#youtube-controls').show();
}
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.Playing) {}
}
$('#youtube-controls').hide();
// Control
$('#pause').click(function() {
player.pauseVideo();
control.command = Command(2, player.getCurrentTime());
});
$('#play').click(function() {
player.playVideo();
control.command = Command(1, player.getCurrentTime());
});
// Input
socket.on('update', function(message) { user = message; });
// Output
setInterval(update, 1000);
最佳答案
onYouTubeIframeAPIReady
函数必须位于全局范围内,因此必须在 window
对象上定义。
因此,在您使用 browserify 的情况下,您需要在 global
对象上定义它:
global.onYouTubeIframeAPIReady = function() {
player = new YT.Player('player', {
videoId: 'M7lc1UVf-VE',
playerVars: {
'controls': 1,
'rel': 1,
},
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
关于javascript - Browserify 破坏了 Youtube iFrame API,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29183142/
我有 带有插件系统的软件包。每个插件都是一个包 可以通过调用 use 方法来加载插件。并将插件导出作为参数传递: package = require('thePackage').use( requir
我知道 browserify 可以通过转换来使用 UMD 模块,但是当我想使用 browserify 构建一个库时,我该如何构建一个 UMD 模块?我可以使用任何转换吗? 最佳答案 如果您想使用 br
我有 third-party-module-b使用 third_party_module_a全局并拥有 require('third-party-module-a'); 在入口点。 问题是third-
我正在使用 Browserify 和 Grunt 来捆绑我们的 RendrJS webapp。我想分析这个包,看看它包含哪些模块,看看是否有多余的代码。这可能会发生,因为在 Rendr 中,一些 js
在 browserify 手册中,exclude part ,它给出了一个使用排除的例子: $ npm install jquery $ browserify -r jquery --standalo
在我的前端代码中,我使用 require()引入依赖于不同版本的 Underscore.js 的库。结果,当我使用 browserify 将所有内容捆绑在一起时,输出包含多个 Underscore 副
我正在使用 SpineJS(它导出一个 commonjs 模块),它需要在全局范围内可用,因为我在任何地方都使用它,但似乎我必须这样做 Spine = require('spine')在每个使用 Sp
假设我有一个模块,其源代码不是 ECMA 5(例如,它是 Coffescript 或 Typescript 或其他),并且以带有源映射的编译形式分发。如何将此源映射包含在 Browserify 包中?
我想创建一个独立的 browserify 包,它将导出的对象直接附加到 window 对象,而不是嵌套在附加到 window 的包装器对象下。 这样做,browserify 会忽略窗口: browse
当您将代码与 Browserify 捆绑在一起时,您使用的每个模 block 都内联在结果输出中,并标有其本地文件路径。因此,您可以在捆绑代码中看到文件路径字符串。 但理论上,这些字符串都可以重写为“
我需要将一些模块强制放入我的包中,因为它们是通过如下代码动态需要的: var moduleName = "someModule"; var myModule = require(moduleName)
我正在尝试通过使用 browserify-shim 将某些模块从包中填充出来来重构使用 Browserify 的库。具体来说,该库使用 require("codemirror") 但我想提供一个不包含
我在新项目中使用了 browserify。到目前为止,它运行得非常好。 不过我有一个大问题。如何分别调试每个 js 文件。它将所有文件捆绑在一起,并在发生错误时指向捆绑。 我正在使用 chrome 和
来自 watchify 的文档, 我懂了: When creating the browserify instance b you MUST set these properties in the c
使用 browserify,我试图要求一个已经浏览器化的模块,但是包无法解析已经浏览器化的模块。 例如,我有一个文件 bundle-1.js 已与命令捆绑在一起: browserify -r ./bu
关于 external requires 的 Browserify 文档部分展示如何使包中的模块可用于全局环境: browserify -r through -r duplexer -r ./my-f
现在,gulp-browserify is no longer supported我正在寻找一个简单的教程,如何现在使用带有 gulp 的 browserify。 This似乎是一种选择,但它仍然相当
我是 Nodejs 和 browserify 的新手。我从这个开始link . 我有文件 main.js,其中包含此代码 var unique = require('uniq'); var data
我最近从 Grunt 过渡到 Gulp。但是我还是个新手,谁能告诉我使用 Gulp-Browserify 和只使用 Browserify 之间的区别是什么? 我知道 Gulp-Browserify 现
描述:我有 package.json 和 bower.json 用于处理我当前架构中的依赖项。我应该在哪个文件中添加 “jquery.slider(版本 1.1.0)”以及怎么做? 目前,我已经在 b
我是一名优秀的程序员,十分优秀!