モバイル版のインデックスの動画を自動再生不可＆全画面表示可能にしたい

kintone カスタマイズ
1

インデックス画面に配置した動画を、自動再生しないようにしたいのですが、自動再生されてしまいます…
また、kintoneのスマホアプリ（Android）は、動画の全画面の拡大アイコンがグレーアウトして拡大できません。AndroidスマホのChromeブラウザで開くと、全画面拡大できました。

 

モバイル動作………【現状】初回読み込み時の自動再生の停止不可、全画面再生可
【希望】初回読み込み時の自動再生の停止、全画面再生可にしたいです

スマホアプリ………【現状】初回読み込み時の自動再生の停止不可、全画面再生不可
【希望】初回読み込み時の自動再生の停止、全画面再生可にしたいです

 

改善方法はありますでしょうか？
※スマホはXperia10 ii（Android 12）とXperia5 ii（Android 12）、ブラウザはChrome（106.0.5249.65）です

■javascript
(() => {
  'use strict';
      kintone.events.on('mobile.app.record.index.show', (event) => {
      kintone.mobile.app.getHeaderSpaceElement().innerHTML = '<video id="video1_m" src="【【【動画URL】】】" controls poster="【【【サムネURL】】】"></video>';
      var video = document.getElementById("video1_m");
      video.className = 'video_1_m_class';
      video.style.float = 'center';
      video.play();
      return event;
});
})();

■CSS
.video_1_m_class{
  display: inline-block;
  width: 390px;
  /* height: 50px; */
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 3px;
  border-width:5px;
  border-color: #006DD9;
  border-style: solid;    
  border-radius:10px;
}
2

自動再生については、 video.play(); してるからじゃないですかね？この行を消すと再生されない気はするのですがどうでしょうか。

また、Chromeだと全画面表示できて、アプリだとできないのはアプリ（Webview）の制約があるかもしれないですね。。
Controls属性は有効になってるようですし。。

3

Ichiro Saito さん

自動再生は上の方のコメントとおりです。モバイルアプリで検証してみましたがエラーが発生したため、アプリ側で全画面表示が無効化（もしくは未対応）されている可能性が高いです。

下記検証に使用したコードです。動画再生時に強制的にフルスクリーン再生します。

video.addEventListener('playing', (event) => {
  const requestFullscreen =
    video.requestFullscreen ||
    video.webkitRequestFullscreen ||
    video.mozRequestFullScreen ||
    video.msRequestFullscreen ||
    video.oRequestFullscreen;
  requestFullscreen
    .call(video)
  .catch((error) => alert(error));
});
4

村濱一樹さま
川村さま

ありがとうございます！！
自動再生はcontrolsで制御するものと思い込んでおりました…

アプリの全画面はできないのですね。諦めがつきました。
モバイル端末はブラウザ版を使ってもらうようにします！！

重ねてお礼申し上げます！！！

5

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。