React-360: использовать внешнее изображение в качестве фона сцены - PullRequest
Новая
       30

React-360: использовать внешнее изображение в качестве фона сцены

0 голосов
/ 07 сентября 2018

Я некоторое время пытался установить внешнее изображение поверх окружающей среды. Это мой index.js: 

import React from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    asset,
    View,
    VrButton,
} from 'react-360';

import {Environment} from 'react-360';

// Set the background to a 360 or 180 image
Environment.setBackgroundImage(
    {uri: 'https://devcdn.player360.de/dev/media-768-raw.jpg'}
    // asset('media-768-raw.jpg')
);

export default class Hello360 extends React.Component {
    // Our component will keep track of this state
    state = {
    };


    componentDidMount(){
    }


    render() {
        return (
            <View style={styles.panel}>
                <Text>
                    <Text>Hey</Text>
                </Text>
            </View>
        );
    }
};


const styles = StyleSheet.create({
    panel: {
        // Fill the entire surface
        width: 1000,
        height: 600,
        backgroundColor: 'rgba(255, 255, 255, 0.4)',
        justifyContent: 'center',
        alignItems: 'center',
    }
});

AppRegistry.registerComponent('Hello360', () => Hello360);

Кажется, что React пытается загрузить изображение, но по какой-то причине оно просто отменено.

Инструменты разработчика: снимок экрана сети

Кроме того, вывод консоли не указывает на CORS или любое другое исключение:

Снимок экрана консольного вывода

Фон моей сцены все еще черный. Как правильно включить динамически внешние изображения в Reaction-360?

1 Ответ

0 голосов
/ 21 сентября 2018

Это был правильный способ загрузки внешних изображений.

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

Это была проблема CORS на сервере devcdn.player360.de. Мы исправили заголовки CORS и теперь можем загружать внешние изображения.

...