Как визуализировать данные EXIF ​​изображения и отображать в реагирующих Js с помощью axios - PullRequest
Новая
       30

Как визуализировать данные EXIF ​​изображения и отображать в реагирующих Js с помощью axios

1 голос
/ 15 июня 2019

Я пытаюсь получить изображения с Google Drive, используя путь к папке, Я получаю ответ изображения, как показано ниже enter image description here

и код для чтения и установки изображения в компоненте, как показано ниже 

class FileList extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            error: null,
            isLoaded: false,
            img: '',
            items: []
        };
    }

    componentDidMount() {
        let path;
        console.log(this);
        var that = this;
        axios.get(Constants.API + Constants.FOLDER_CONTENTS, {
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
                "Authorization": Constants.AUTH_Element + ',' + Constants.AUTH_ORG + ',' + Constants.AUTH_USER
            },
            params: {
                path: "/Photos"
            }
        })
            .then(function (response) {
                console.log(response);
                let data = response.data;
                data.forEach((dataInFolder) => {
                    path = dataInFolder.path;
                    that.getImageFromDrive(path)
                });
            })
            .catch(function (error) {
                console.log(error);
            })

    }

    getImageFromDrive = (path) => {
        let that = this;
        let data;

        axios.get(Constants.API + Constants.Files, {
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
                "Authorization": Constants.AUTH_Element + ',' + Constants.AUTH_ORG + ',' + Constants.AUTH_USER
            },
            params: {
                path: path
            }
        }).then(function (response) {
            var myThat = that;
            console.log(response);
            let data = response.data;
            var b64Response = btoa(data);
            var sr_Srava = 'data:image/jpeg;base64,' + btoa(unescape(encodeURIComponent(data)));
            that.setState({img: sr_Srava});
        })
            .catch(function (error) {
                console.log(error);
            })
    }


    render() {
        const {img} = this.state;

        return (

            <img className="myImg" alt="" width="300"
                 height="300" src={img}/>


        );

        }
     }
     export default FileList;

Я пытался преобразовать данные буфера в строку и пробовал другие способы. Я не могу отобразить изображение. Может ли кто-нибудь предложить, как проанализировать эти данные изображения для получения изображения

...