Question

我想让JW Player在Meteor.js中工作。我已尝试过云托管和自托管，但未能让播放器显示。我不确定两者是否存在冲突。它似乎应该是非常直接的，但我无法让它工作。任何建议都会很棒。

由于

<head>
<title>Mysite</title>

<script src="http://jwpsrv.com/library/mytoken.js"></script>
</head>
<body>
    <div id='my-video'></div>
    <script type='text/javascript'>
    jwplayer('my-video').setup({
        file: 'http://localhost:3000/mymp3.mp3',
        width: '640',
        height: '360'
    });
    </script>

</body>

以下是我收到的错误消息：

资源解释为图像，但使用MIME类型text / html传输："http://167.206.59.228/2-2573/a348fe94-6cbf-458f-8d56-8b69e6091c42_25.152.50.88/5.2.992971814237535". 167.206.59.228/:1

Request URL:http://167.206.59.228/2-2573/ec00f5c8-61a2-493b-a2e6-943f52ac381f_25.152.26.118/5.2.5313433578703552 Request Method:GET Status Code:200 OK Request Headersview source Accept:*/* Accept-Encoding:gzip,deflate,sdch Accept-Language:en-US,en;q=0.8 Cache-Control:max-age=0 Connection:keep-alive Host:167.206.59.228 Referer:http://localhost:3000/ User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36 Response Headersview parsed HTTP/1.1 200 OK Server: PorchLight/6.0.20061.1302 Content-Type: text/html; charset=utf-8 Connection: Close Content-Length: 1

Answer 1

Meteor以不同于您期望的方式做事。有一种流星方式来构建你想要的东西。我已根据您的代码构建了一个工作演示： https://github.com/michaelbishop/so-jwplayer

让我试着逐步解释我改变了什么。

Meteor真的很喜欢模板。要以Meteor方式执行此操作，请将视频div <div id='my-video'></div>移动到模板：

<template name="video">
    <div id='my-video'></div>
</template>

这允许您在模板上操作并执行诸如设置事件或运行javascript之类的操作。

接下来，将播放器代码移动到扩展名为.js：

的文件中

jwplayer('my-video').setup({
    file: 'http://localhost:3000/mymp3.mp3',
    width: '640',
    height: '360'
});

在呈现页面并加载库之后，您将希望视频播放器代码对模板起作用：

Template.video.rendered = function () {
    jwplayer('my-video').setup({
        file: 'http://localhost:3000/mymp3.mp3',
        width: '640',
        height: '360'
    });
};

还有一个创建的方法（Template.video.created），但它不起作用，因为页面尚未加载，因此尚未加载javascript库。您需要在页面加载并且库可用后执行jwplayer设置代码。

最后，需要将mymp3.mp3等静态文件放在public文件夹中。我找到了一个开源mp3并将其用作示例。

希望有所帮助！祝你好运！

JW Player没有使用Meteor.js

1 个答案: