Question

我正在尝试使用javascript API使用视频ID嵌入视频。经过几次试验后，我找到了做到这一点的方法，我想确定这是否是正确的使用方法，还是我有什么遗漏？

此代码工作正常但需要知道我是否以错误的方式执行此操作。

 <script language="JavaScript" type="text/javascript" src="http://admin.brightcove.com/js/BrightcoveExperiences.js"></script>

    <object class="BrightcoveExperience">
        <param name="bgcolor" value="#FFFFFF" />
        <param name="width" value="480" />
        <param name="height" value="270" />
        <param name="playerID" value="4942277584001" />
        <param name="playerKey" value="AQ~~,AAAEfriyQEE~,ZL37ulQzt-toqcwK_Cwr35Bl9P3znlYu" />
        <param name="isVid" value="true" />
        <param name="isUI" value="true" />
        <param name="dynamicStreaming" value="true" />
        <param name="@videoPlayer" value="5072209967002" />   
    </object>

<!-- This script tag will cause the Brightcove Players defined above it to be created as soon
as the line is read by the browser. If you wish to have the player instantiated only after
the rest of the HTML is processed and the page load is complete, remove the line.-->
<script type="text/javascript">brightcove.createExperiences();</script>
<script type="text/JavaScript">
    var player,
    APIModules,
    videoPlayer;
    function onTemplateLoad(experienceID){
     player = brightcove.api.getExperience(experienceID);
     APIModules = brightcove.api.modules.APIModules;
    }
    function onTemplateReady(evt){
     videoPlayer = player.getModule(APIModules.VIDEO_PLAYER);
     videoPlayer.play();
    }
</script>
<!-- End of Brightcove Player -->

Answer 1

Brightcove播放器用于播放brightcove视频。您编写的代码是正确的，但它在brightcove文档中显示它使用传统播放器。使用http://docs.brightcove.com/en/video-cloud/brightcove-player/guides/embed-in-page.html中指定的嵌入代码的brightcove的推荐/当前方式是：

<video data-video-id="4784463159001"
        data-account="1507807800001"
        data-player="SkSyF9Cl"
        data-embed="default"
        class="video-js"
        controls></video>
<script src="//players.brightcove.net/1507807800001/SkSyF9Cl_default/index.min.js"></script>

其中视频ID在data-video-id属性中指定，数据帐户中的帐户ID和数据播放器属性中的播放器详细信息。

有关如何使用javascript嵌入代码的详细信息，您可以浏览指定的上述链接。

注意：还要将脚本src链接替换为您的帐户ID和播放器密钥详细信息。

希望它有所帮助。

Answer 2

Vanilla Javascript中的最新更新

<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Load Player Dynamically</title>
    <style>
        .video-js {
            width: 640px;
            height: 360px;
        }
    </style>
</head>
<body>
<div id="property-video-brightcove"></div>

<button onclick="init()">Init</button>
<button onclick="play()">Play</button>
<button onclick="pause()">Pause</button>
<button onclick="terminate()">Terminate</button>

<script type="text/JavaScript">
    var playerInstance;

    function init() {
        var container = document.getElementById('property-video-brightcove');
        var playerHTML;
        var data = {
            'accountId': '5699924528001',
            'playerId': 'default',
            'videoId': '5833639391001'
        };
        var script = document.createElement('script');
        script.src = "https://players.brightcove.net/" + data.accountId + "/" + data.playerId + "_default/index.min.js";
        script.id = "brightcoveJs";

        playerHTML = '<video-js id=\"brightcovePlayer\" ' +
            ' data-video-id=\"' + data.videoId + '\" ' +
            ' data-account=\"' + data.accountId + '\" ' +
            ' data-player=\"' + data.playerId + '\" ' +
            ' data-embed=\"default\" class=\"video-js\" ' +
            ' controls></video-js>';

        container.innerHTML = playerHTML;
        container.appendChild(script);

        script.onload = callback;
    }

    function callback() {
        playerInstance = bc('brightcovePlayer');
        playerInstance.on('loadedmetadata', function () {
            playerInstance.play();
        })
    }

    function play() {
        playerInstance.play();
    }

    function pause() {
        playerInstance.pause();
    }

    function terminate() {
        document.getElementById('brightcovePlayer').remove();
        document.getElementById('brightcoveJs').remove();

        delete playerInstance;
    }

    setTimeout(function () {
        init();
    }, 1000);

</script>
</body>
</html>

使用javascript API嵌入Brightcove视频

2 个答案: