Запрос от Rest API с использованием axios - PullRequest
Новая
       8

Запрос от Rest API с использованием axios

0 голосов
/ 20 ноября 2018

Я создал Rest API с помощью Express, который подключается к mongodb.

Он отлично работает с почтальоном.

Затем я создал простое веб-приложение с vue и попытался получить ответ отAPI, использующий Axios, но я получаю сообщение об ошибке:

Доступ к XMLHttpRequest на ... был заблокирован политикой CORS: Запросы перекрестного происхождения поддерживаются только для схем протокола: http, data, chrome,chrome-extension, https.

Я попытался использовать несколько решений, включая cors и настройку res.header.

index.js 

const app = express()

app.use(function (req, res, next) {
    res.header('Access-Control-Allow-Origin', '*')
    res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept')
    next()
})

app.use(bodyParser.json())

app.use('/api', require('./routes/api'))

app.use((err, req, res, next) => {
    console.log(err)
    res.status(422).send({error: err.message + req.params})
})

app.listen(process.env.port || 4000, () => {
    console.log('listening...')
})

VUE компонента 

import axios from 'axios'
    export default {
        data: () => ({
            info: 'omg',
        }),
        mounted() {
            axios.get('localhost:4000')
                 .then(response => (this.info = response))
                 .catch(error => console.log(error))
        },
    }

Как я могуполучить данные из API?

1 Ответ

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

Вы должны указать схему протокола: http://, ваши настройки cors не являются проблемой. 

axios.get('http://localhost:4000')

Также вы запрашиваете только localhost:4000, и, как я вижу, ваш сервер не имеет / маршрута- вы получите ошибку 404.

...