Как через js запустить видео iframe?

Как можно при нажатии на кнопку запустить видео на iframe через js? У меня видео в iframe загружено с гугл диска, пожалуйста подскажите, как нибудь можно реализовать запуск? Пытался попробовать через Youtube API, но очень плохо работает, подставлял автозапуск при загрузке страницы, видео было запущено, но оно просто не загружалось, может я что-то не так делаю, пытался так же реализовать через имитирование клика по iframe, но тоже безуспешно.

Код:

<style>
        body,
        html {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }

        #img-videos {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: all 0.5s;
        }

        .video_main {
            position: relative;
            width: 100%;
            height: 100%;
        }

        .video_main iframe {
            width: 99.5%;
            height: 99.5%;
            object-fit: cover;
        }

        .hidden {
            position: absolute;
            top: 50%;
            left: 50%;
        }

        #playBtn {
            fill: #fff;
            position: absolute;
            z-index: 5;
            left: calc(50% - 40px);
            top: calc(50% - 65px);
            width: 80px;
            transition: all 0.5s;
        }

        #showreel {
            z-index: 1;
            color: #fff;
            font-size: 50px;
            position: absolute;
            top: calc(50% + 50px);
            left: calc(50% - 135px);
            font-family: 'CirceRounded';
            transition: all 0.5s;
        }
    </style>
    <div class="video_main">
        <iframe id="videos" src="https://drive.google.com/file/d/1mFGz-J6jOk-PgQgSmPIK4ERnNjR9uUa5/preview?autoplay=1"
            allow="autoplay" allowfullscreen="true" webkitallowfullscreen="true"></iframe>
        <svg id="playBtn" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
            x="0px" y="0px" viewBox="0 0 477.867 477.867" style="enable-background:new 0 0 477.867 477.867;"
            xml:space="preserve">
            <path d="M238.933,0C106.974,0,0,106.974,0,238.933s106.974,238.933,238.933,238.933s238.933-106.974,238.933-238.933
                C477.726,107.033,370.834,0.141,238.933,0z M339.557,246.546c-1.654,3.318-4.343,6.008-7.662,7.662v0.085L195.362,322.56
                c-8.432,4.213-18.682,0.794-22.896-7.638c-1.198-2.397-1.815-5.043-1.8-7.722V170.667c-0.004-9.426,7.633-17.07,17.059-17.075
                c2.651-0.001,5.266,0.615,7.637,1.8l136.533,68.267C340.331,227.863,343.762,238.11,339.557,246.546z" />
        </svg>
        <span id="showreel">SHOWREEL</span>
        <img id="img-videos"
            src="https://www.googleapis.com/drive/v3/files/10K6nFNHIoEh0oQZeBREKCGSKYcte7w6l?alt=media&key=AIzaSyCF8KBOrjXy_nQZIgoRtfANy2jOZ955VZI"
            alt="">
    </div>
    <script>
        // получаем все элементы
        var videoEl = document.getElementById('videos'),
            playBtn = document.getElementById('playBtn'),
            img_videos = document.getElementById('img-videos'),
            showreel = document.getElementById('showreel');
        // запускам или останавливаем воспроизведение
        playBtn.addEventListener('click', function () {
            playBtn.style.opacity = 0;
            showreel.style.opacity = 0;
            setTimeout(() => { img_videos.style.opacity = 0; }, 500);
            setTimeout(() => { img_videos.style.display = 'none'; }, 1000);
            setTimeout(() => { playBtn.style.display = 'none'; showreel.style.display = 'none'; }, 1000);        
        });
    </script>