Ionic2 и Aframe в iphone

Я делаю приложение VR 360, используя Ionic2 и Aframe. Это должно быть легко, потому что Aframe - это все, что вам нужно для этого (вы устанавливаете видеоресурс и загружаете его из примитива видеосферы), но я не получаю желаемого результата. У меня проблема с iOS (отлично работает в Android и в браузере), когда я запускаю приложение на своем iphone, видео воспроизводится в плеере Iphone, а не в моем приложении, поэтому у меня нет эффекта 360. Я добавляю playsinline, как сказано в документации, я добавляю

<meta name="apple-mobile-web-app-capable" content="yes"/>

тоже, но не работает. Я использую следующий код:

<a-scene>

  <a-assets>
     <video id="video" src="assets/img/video1.mp4" loop crossorigin playsinline></video>
     <img id="cubes-thumb" crossorigin="anonymous" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/thumb-cubes.jpg">
     <img id="cubes" crossorigin="anonymous" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">

  </a-assets>

  <a-videosphere src="#video" rotation="0 180 0"></a-videosphere>
  <a-image class="link" src="#cubes" position="0 0 -1"></a-image>
   <!--<a-entity id="links" layout="type: line; margin: 1.5" position="0 -1 -4">
    <a-entity template="src: #cubes" data-src="#cubes" data-thumb="#cubes-thumb"></a-entity>
  </a-entity>-->

  <a-entity camera look-controls>
    <a-cursor id="cursor"
      animation__click="property: scale; startEvents: click; from: 0.1 0.1 0.1; to: 1 1 1; dur: 150"
      animation__fusing="property: fusing; startEvents: fusing; from: 1 1 1; to: 0.1 0.1 0.1; dur: 1500"
      event-set__1="_event: mouseenter; color: green"
      event-set__2="_event: mouseleave; color: black"
      raycaster="objects: .link"
      material="color:black">
    </a-cursor>
  </a-entity>


</a-scene>

Я думал, что проблема может быть в автовоспроизведении, и я отключил его, и я запускаю play с помощью кнопки, но у меня тот же результат.

Anyidea, что еще я могу попробовать?

Благодарю.