Azure Media Player hızlı başlangıcı

  • Makale

Azure Media Player'ı ayarlamak kolaydır. Azure Media Services hesabınızdan medya içeriğinin temel kayıttan yürütülmesi yalnızca birkaç dakika sürer. Bu bölümde ayrıntılara girilmeden temel adımlar anlatılmaktadır. Aşağıdaki bölümlerde Azure Media Player'ı ayarlama ve yapılandırma hakkında ayrıntılı bilgi verebilirsiniz. Aşağıdakileri belgenizin <head> bölümüne eklemeniz yeterlidir:

    <link href="//amp.azure.net/libs/amp/latest/skins/amp-default/azuremediaplayer.min.css" rel="stylesheet">
    <script src= "//amp.azure.net/libs/amp/latest/azuremediaplayer.min.js"></script>

Önemli

İsteğe latest bağlı olarak değişemeyebilir, bu sürümü üretimde KULLANMAMALIDIR. değerini latest Azure Media Player sürümüyle değiştirin; örneğin değerini ile 1.0.0değiştirinlatest. Azure Media Player sürümleri buradan sorgulanabilir.

Video öğesini kullanma

Ardından, öğesini normalde yaptığınız gibi, ancak herhangi bir seçenek içeren ek data-setup bir öznitelikle kullanın<video>. Bu seçenekler, geçerli bir JSON nesnesindeki herhangi bir Azure Media Services seçeneğini içerebilir.

    <video id="vid1" class="azuremediaplayer amp-default-skin" autoplay controls width="640" height="400" poster="poster.jpg" data-setup='{"nativeControlsForTouch": false}'>
        <source src="http://amssamples.streaming.mediaservices.windows.net/91492735-c523-432b-ba01-faba6c2206a2/AzureMediaServicesPromo.ism/manifest" type="application/vnd.ms-sstr+xml" />
        <p class="amp-no-js">
            To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video
        </p>
    </video>

Otomatik kurulumu kullanmak istemiyorsanız, özniteliğini data-setup atlayabilir ve bir video öğesini el ile başlatabilirsiniz.

    var myPlayer = amp('vid1', { /* Options */
            "nativeControlsForTouch": false,
            autoplay: false,
            controls: true,
            width: "640",
            height: "400",
            poster: ""
        }, function() {
              console.log('Good to go!');
               // add an event listener
              this.addEventListener('ended', function() {
                console.log('Finished!');
            });
          }
    );
    myPlayer.src([{
        src: "http://amssamples.streaming.mediaservices.windows.net/91492735-c523-432b-ba01-faba6c2206a2/AzureMediaServicesPromo.ism/manifest",
        type: "application/vnd.ms-sstr+xml"
    }]);