Воспроизведение Wistia в реакции-проигрывателе вызывает ошибку «Конструктор XMLHttpRequeset был подделан» - PullRequest
Новая
       22

Воспроизведение Wistia в реакции-проигрывателе вызывает ошибку «Конструктор XMLHttpRequeset был подделан»

0 голосов
/ 07 мая 2018

У меня есть ReactPlayer, вставленный так: 

<ReactPlayer
          ref={this.ref}
          className="storyPlayer__reactPlayer"
          width="100%"
          height="100%"
          url="https://getleda.wistia.com/medias/bjz07hdxqx"
          playing
          onReady={() => {
            this.setState({ ready: true });
          }}
          onProgress={this.onProgress}
        />

Если URL явно указывает на wistia, я получаю следующую ошибку в консоли, и плеер не работает:

judy Конструктор XMLHttpRequest был подделан. Так как это влияет на запросы CORS / Range XHR, воспроизведение HLS было отключено. Чтобы включить воспроизведение HLS и другие важные функции, удалите код, который изменяет определение window.XMLHttpRequest.

Есть идеи, что это вызывает и как это исправить?

Ответы [ 2 ]

0 голосов
/ 11 мая 2018

Похоже, проблема HLS была новой, но если кому-то интересно, почему я ее получил, то это из-за конфигурации маршрутов. По какой-то причине ему не понравилось, когда реактивный проигрыватель был настроен на маршрут, такой как / videoplayer, из корня он работал нормально.

После дальнейшего изучения проблема была на самом деле довольно простой, по какой-то причине ReactPlayer не знает, что такое «100%» ширина и высота для видеороликов Wistia, изменив ее на что-то вроде этого: 

  <ReactPlayer
          ref={this.ref}
          className="storyPlayer__reactPlayer"
          controls={true}
          **width="600px"
          height="600px"**
          url="https://getleda.wistia.com/medias/bjz07hdxqx"
          playing
          onReady={() => {
            this.setState({ ready: true });
          }}
          onProgress={this.onProgress}
        />

Исправлено.

0 голосов
/ 10 мая 2018

URL вашего видео https://nanocorp.wistia.com/medias/dczbohg06v не доступен для общественности.

Переключение на общедоступный URL-адрес видео будет работать: 

<ReactPlayer url="https://youtu.be/nLF0n9SACd4" />

Edit v0kl4mv9rl

...