Vuejs + openweathermap и проблема с заголовками. Заголовок «Access-Control-Allow-Origin» не работает - PullRequest
Новая
       8

Vuejs + openweathermap и проблема с заголовками. Заголовок «Access-Control-Allow-Origin» не работает

0 голосов
/ 03 февраля 2020

Я создал компонент, который получает данные из API. Ax ios уведомляет меня, что заголовок неверен. Я добавил параметр в запрос, который добавляет разрешение для этого заголовка. Но есть проблема, которую я не могу решить. 

<template>
    <div class="wrapper>">
        <h1>Search</h1>
        <div class="search">
            <label>Search</label>
            <input v-model="searchCity" type="text" placeholder="City" @input="toogleInput">
        </div>
    </div>
</template>
<script>
import axios from 'axios'

const TOKEN = `xxx`
const URL_API = `https://samples.openweathermap.org/data/2.5/find`

export default {
    name: 'Search',
    data() {
        return {
            searchCity: '',
        }
    },
    methods: {
        toogleInput(value) {
            console.log(`${URL_API}?q=${this.searchCity}&units=metric&appid=${TOKEN}`)
            axios.get(`${URL_API}?q=${this.searchCity}&units=metric&appid=${TOKEN}`, {headers: {'Access-Control-Allow-Origin': '*'}})
                .then((response) => {
                    console.log(response)
                })
                .catch((e) => {
                    console.log(e)
                })
        }
    }
}
</script>
<style scoped>
</style>
...