Magento 2 Product video is not displaying in front end with TypeError: window[this.configSource] is undefined

Question

I have successfully uploaded/configured Youtube video for a particular product but the video is not showing on the front-end, even though I marked the video as the 'base,' 'small' and 'thumbnail'.

I removed the cache, deployed the static content but the video is still not visible in front end.

I am getting below error in my console:

TypeError: window[this.configSource] is undefined 

Any help would be appreciated.

Answer 1

$product = $this->getProduct();
$images = json_decode($block->getGalleryImagesJson(),true);
?>
 
<div id="gallery-slider done" class="gallery-slider" data-mage-init='{"gallery":{}}'>
    <div class="viewport desktop owl-carousel" style="">
        <?php foreach ($images as $i => $image): ?>
            <?php if(isset($image['videoUrl'])) :?>
                <?php $altText = $image['caption'] ? $image['caption'] : $product->getName();
                $vimeo = $image['videoUrl'];
                $vid = (int) substr(parse_url($vimeo, PHP_URL_PATH), 1);;
                ?>
                <iframe src="https://player.vimeo.com/video/<?php echo $vid ?>"
                        frameborder="0" title="<?php echo $altText ?>" webkitallowfullscreen mozallowfullscreen allowfullscreen style="width: 100%"></iframe>
            <?php else: ?>
                <?php $altText = $image['caption'] ? $image['caption'] : $product->getName(); ?>
                <img src="<?php echo $image['img']?>" alt="<?php echo $altText ?>">
            <?php endif; ?>
 
        <?php endforeach ?>
    </div>
</div>

Answer 2

I had a similar problem. In my case was related to the way the video was on youtube. After trying a general one and confirming that the magento was running fine, I uploaded the video again and worked fine.