Поворот изображения при публикации WebRTC потока¶

Описание¶

При публикации WebRTC потока с мобильного устройства, ориентация устройства может быть изменена. Устройства на базе Android при этом самостоятельно поворачивают изображение, а устройства на базе iOS передают признак ориентации картинки в потоке

Значение признака	Угол поворота в градусах
0	0
1	90
2	180
3	270

Изображение поворачивается по часовой стрелке.

Публикация WebRTC потока с признаком ориентации картинки¶

Для публикации WebRTC потока с признаком ориентации картинки необходимо передать параметр cvoExtension в функцию createStream()

session.createStream({
    name: streamName,
    ...
    cvoExtension: true
}).publish();

Воспроизведение потока с признаком ориентации картинки как RTMP¶

Для воспроизведения потока с признаком ориентации картинки как RTMP требуется поддержка со стороны плеера. Так, в пример Flash Streaming необходимо добавить следующий код:

public function onMetaData(info:Object):void {
    Logger.info("Video orientation " + info.orientation);
    revertVideoFarEndPos();
    if (info.orientation == 0) {
        videoFarEnd.rotation = 0;
    } else if (info.orientation == 1) {
        videoFarEnd.rotation = 90;
        videoFarEnd.x = videoFarEnd.x + videoFarEnd.width;
    } else if (info.orientation == 2) {
        videoFarEnd.rotation = 180;
        videoFarEnd.x = videoFarEnd.x + videoFarEnd.width;
        videoFarEnd.y = videoFarEnd.y + videoFarEnd.height;
    } else if (info.orientation == 3) {
        videoFarEnd.rotation = 270;
        videoFarEnd.y = videoFarEnd.y + videoFarEnd.height;
    }
    videoFarEndOrientation = info.orientation;
}

public function revertVideoFarEndPos():void {
    if (videoFarEndOrientation == 1) {
        videoFarEnd.x = videoFarEnd.x - videoFarEnd.width;
    } else if (videoFarEndOrientation == 2) {
        videoFarEnd.x = videoFarEnd.x - videoFarEnd.width;
        videoFarEnd.y = videoFarEnd.y - videoFarEnd.height;
    } else if (videoFarEndOrientation == 3) {
        videoFarEnd.y = videoFarEnd.y - videoFarEnd.height;
    }
}

При использовании транскодинга, например, при публикации потока VP8+opus, для того чтобы плеер получил признак ориентации транскодированного потока, необходимо в файле flashphoner.properties установить следующую настройку

video_filter_enable_rotate=true

При использовании CDN, эту настройку необходимо установить на всех серверах CDN, с которых предполагается воспроизведение RTMP потока.

Особенности трансляции с мобильных устройств¶

Если разрешен поворот экрана мобильного устройства, то при повороте устройства будет меняться соотношение сторон картинки от портретного к ландшафтному и наоборот.

Если поворот экрана устройства запрещен (например, установлен переключатель Lock Portrait Orientation), то при повороте устройства соотношение сторон остается тем, же, что и в начале публикации, но картинка поворачивается в соответствии с ориентацией устройства.

Известные проблемы¶

iOS Safari не высылает ориентацию картинки при повороте на 180 градусов (устройство вверх ногами)
Safari в iOS 12 перестает высылать видео пакеты при повороте направо на 90 градусов (из портретной в ландшафтную ориентацию)
При публикации с Android устройств соотношение сторон картинки меняется при повороте независимо от значения параметра cvoExtension