Как использовать axios-jsonp в react?

Кусок подключаемого компонента
import React, { Component } from 'react';
import Aaxios from 'axios';
import jsonpAdapter from 'axios-jsonp'; 

export default class Vk extends React.Component {
    state = {
        persons: []
    };
//подбоный вариант всё ещё ругается на Access-Control-Allow-Origin
    componentDidMount() {
        Aaxios.get(`https://api.vk.com/method/photos.search?q=210700286&v=5.52`,{ adapter: jsonpAdapter })
            .then(res => {
                const persons = res.data;
                this.setState({ persons });
            })
    }

    render() {
        return (
            <ul>
                { this.state.persons.map(person => <li>{person.name}</li>)}
            </ul>
        )
    }
}

node
const
    express = require('express'),
    serve = require('express-static'),
    cors = require('cors'),
    app = express();

app.get('/', (req, res) => {
    res.sendfile(__dirname + '/public/index.html');
});

app.use(serve(__dirname + '/public/',{
    setHeaders: function setHeaders(res) {
        res.header('Access-Control-Allow-Origin', '*');
        res.header('Access-Control-Allow-Methods', 'GET');
        res.header('Access-Control-Allow-Headers', 'Content-Type');
    }
}));

app.listen(3000, () => {console.log(':3000')});

axios-jsonp - нужен чтобы работал Access-Control-Allow-Origin
axios - наиболее предпочтителен для JSON да довольно универсальный для JS типа не JQ
  • Вопрос задан
  • 855 просмотров
Решения вопроса 1
cimonlebedev
@cimonlebedev Автор вопроса
axios-jsonp-pro
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@Ohurmevshiy
Попробуйте eval(res.data)сделать, если уверены, что данные приходят безопасные.
.then(res => {
    const persons = eval(res.data);
    this.setState({ persons });
})
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы