The poster image functionality in videos is experiencing issues after updating to version 1.5.0 of the Azure Media Player

I've encountered a strange issue after updating my azure media player to version 1.5.0 - it's not displaying the poster image like it did in version 1.3.0.

Below is the code I'm currently using:

<div class="marginBlock" id="mediaPlayer">
<h3>
    <asp:Label ID="lblTitle" runat="server"><%=Title.ToString()%></asp:Label>
</h3>
<video id="<%=mediaPlayerID %>" class="azuremediaplayer amp-default-skin amp-big-play-centered">
</video>
<p>
    <asp:Label ID="lblDescription" runat="server"><%=Description.ToString()%></asp:Label>
</p>

<script>
     $(document).ready(function () {
    var playOptions = {
        "nativeControlsForTouch": false,
        autoplay: false,
        controls: true,
        heuristicProfile: "High Quality",
        techOrder: ["azureHtml5JS", "html5", "flashSS", "silverlightSS"],
        logo: { enabled: false },
        poster: "<%=ImageSelector%>",
        width: '100%'
    };

    var azurePlayer = amp('<%=mediaPlayerID%>', playOptions);

    azurePlayer.src([{
        src: "<%=VideoURL%>",
        type: 'application/vnd.ms-sstr+xml'
    }]);
</script>

The values for mediaplayerID, VideoURL, Title, Description, and ImageSelector are dynamically generated from the backend and this code worked perfectly with version 1.3.0 of azure.

Answer №1

Recent updates to Azure Media Player version 1.5.0 included several security enhancements, such as now requiring the poster to be specified with an absolute URL. Make sure to switch to using the absolute URL for the poster in order for it to function properly. Rest assured, we will also be updating our documentation to reflect this change.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is e.preventDefault() failing to work in Next.js?

Hey everyone, I'm new to react.js and next.js. I attempted to copy some data from a form and display it in the console, but using e.preventDefault() is preventing me from submitting my form. Is there a more effective way to achieve what I'm aimin ...

Capture the current state of a page in Next.js

As I develop my Next.js application, I've encountered an architectural challenge. I'm looking to switch between routes while maintaining the state of each page so that I can return without losing any data. While initialProps might work for simple ...

React: Transforming mongoDB date format into a more user-friendly date display

An entry saved in MongoDB contains a property called "createdAt" with a timestamp. Take a look at the example below: createdAt: 2021-10-26T12:24:33.433+00:00 If we consider this date to be today, how can I achieve the following outcomes?: Show this date ...

New updates are not appearing in the Azure app service for a React application when using GitHub actions

I have configured the Azure app service with default settings, and there are no warnings or errors during the build process. The deployment was successful, but the changes do not reflect in the production environment; it still shows the previous build. H ...

When working with Vuejs Composition API, I noticed that the value of a Reference object seems to disappear when I

Here is the code snippet that I am working with: <template> {{posts}} </template> <script> import { computed, ref } from 'vue'; import getPosts from '../composables/getPosts.js' import {useRoute} from 'vue-router ...

How to output a string in jQuery if it includes a certain character?

I need to extract all strings that include a specific word within them, like this: <div> <div> <span> <h3>In Paris (Mark Bartels) worked for about 50 years.</h3> </span> </div> ...

Issue TS7053 occurs when trying to access any index of the target of a React.FormEvent<HTMLFormElement>

I've been working on adapting this tutorial to React and TypeScript. Here is the code snippet I have implemented for handling the onSubmit event: const handleSignUp = (event: React.FormEvent<HTMLFormElement>) => { event.preventDefault(); ...

Troubleshooting the non-functional asynchronous function

After starting to use redis with node (specifically the node_redis module), I decided to wrap my retrieval code for debugging and DRY principles. However, I encountered an issue where my new function wasn't working as expected. As someone who is stil ...

What are strategies for handling intricate state logic within my Vue.js checkbox component?

I'm facing a few challenges as I dive into learning Vue.js for just one week. Keep in mind that this example is actually nested within a parent component called <question>, but for the sake of simplicity, I've streamlined the code for this ...

The Antd Tooltip becomes unresponsive when a component is clicked and moved

Having an issue with a button that has an Antd tooltip, here is the setup: <Tooltip title="Some text"> <button onClick={openNotes}><Icon icon="notes" /></button> </Tooltip> Upon clicking the button, the ...

Is it possible to automatically play a sound clip when the page loads?

Is there a way to automatically play a sound clip when my page loads? Are there any specific JavaScript or jQuery methods I can use for this, as I am developing my page using PHP. ...

JQuery is failing to parse JSON data

I've written a script to fetch data and display it in an HTML table. Here is the script: $('#search_filter_button').click(function (e) { e.preventDefault(); // Prevent form submission var county = $('#filter_county').val() ...

What is the best method for inserting a line break into a string?

Can you please explain how I can insert a line break into a string with JavaScript? I have tried using the <br/> tag, but it's not working. What is the correct way to achieve this? JavaScript var str="Click Here" +"<br>"+ "To Set" +"< ...

How can an instance of a .NET control located in a child page be accessed from a user control in a master page?

I have a user control named "shopping cart" that I am using in the master page. I am trying to figure out how to retrieve the value from a textbox on the child page in this user control. Is it feasible to access controls from the child page within a "Cus ...

The performance of System.Web.HttpRequest.FillInFormCollection() and System.Web.HttpRequest.GetEntireRawContent() is severely lacking in speed

After monitoring the performance of my website, I noticed that over 90% of slow-executing code (>1s) is related to System.Web.HttpRequest.GetEntireRawContent() (called by System.Web.HttpRequest.FillInFormCollection()). Is it common for ASP.NET sites to ...

Enhance your AngularJS table with a custom Javascript context menu!

In the process of developing a shift planner, I have implemented a JS context menu and am attempting to display the shifts using Angular. However, upon clicking any table cell, all cells are being updated simultaneously. Is there a workaround for this issu ...

Displaying divs depending on dropdown selection - Troubleshooting script issue

When I try to display certain divs based on dropdown selection using the script below, it works fine on a simple page. However, when I implement it on my current development page, it completely messes up the layout, turning everything black and adding stra ...

How come I am unable to pass JavaScript values to my PHP5 code?

I'm struggling with this code snippet: <?php $html=file_get_contents('testmaker_html.html'); echo $html; ?> <script type="text/javascript"> document.getElementById('save_finaly_TEST').addEventLis ...

Locating the Searchbox on Google Maps with the angular-google-maps library

I am currently working on positioning the Google Maps searchbox variable in a way that allows it to stay fixed under markers as they are listed. I am utilizing the Angular Google Maps library for this purpose, which provides a directive known as <ui-g ...

Proper method for verifying line-clamp in a Vue component

I came across a question that aligns perfectly with my current task - determining if text is truncated or not. The query can be found here: How can I check whether line-clamp is enabled?. It seems like my approach may not be accurate, so any guidance on ho ...