Видео HTML5 не будет автоматически воспроизводиться в приложении React при первой загрузке страницы - PullRequest
0 голосов
/ 21 января 2019

Я пытался использовать HTML5-видео в своем приложении React с включенным автоматическим воспроизведением и зацикливанием. Но это никогда не работает, когда страница загружается в первый раз. Но когда я захожу на другие страницы и возвращаюсь на домашнюю страницу (где находится видео), видео начинает воспроизводиться. Я использую следующий код:

 <Section gridStart="1366px" bgColor="gradient" type="flex">
      <Block flexBasis="70">
        <video width="100%" autoPlay loop>
          <source src="/videos/ai-vid.mp4" type="video/mp4" />
        </video>
      </Block>
      <Block flexBasis="30">
        <Paragraph>
          <Fade bottom cascade>
            <H2 light>Accessibility</H2>
            <H4 light>
              Lorem ipsum dolor, sit amet consectetur adipisicing elit.
              Molestias dolores quia sit harum accusamus quaerat
              repudiandae.
            </H4>
          </Fade>
        </Paragraph>
      </Block>
    </Section>

Плз, дайте мне знать, что я здесь не так делаю. Он будет очень признателен за любые предложения по улучшению этого кода, чтобы он работал на всех браузерах и мобильных устройствах. Кстати, я попытался загрузить видео следующим образом:

import video from 'static/video/ai-vid.mp4'
...
<source src={video} type="video/mp4" />

И не повезло, тот же результат. Thanx.

1 Ответ

0 голосов
/ 22 января 2019

Оказывается, что автозапуск видео был предотвращен политикой браузера.Мне просто пришлось использовать свойство 'muted' для видео, и теперь оно отлично воспроизводится в Chrome.

...