Героку и Аксиос - PullRequest
Новая
       5

Героку и Аксиос

0 голосов
/ 10 января 2020

У меня есть приложение: Django / python бэкэнд и реагирующий фронтенд. Обе части были развернуты отдельно с помощью heroku: myapp-backend.herokuapp.com и myapp-frontend.herokuapp.com. Я пытаюсь получить данные из myapp-backend: 

axios
        .get("https://myapp-backend.herokuapp.com/api/spots/1")

, но получаю две ошибки: 

Access to XMLHttpRequest at 'https://myapp-backend.herokuapp.com/api/spots/1' from origin 'https://myapp-frontend.herokuapp.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

и 

Error: Network Error
    at createError (createError.js:17)
    at XMLHttpRequest.handleError (xhr.js:80)

Если я запускаю myapp- Локальный интерфейс и попробуйте получить данные от myapp-backend.herokuapp.com - все в порядке. Также часть настроек внутри бэкэнда: 

INSTALLED_APPS = [
    ...
    'corsheaders',
    'rest_framework',
    ...
]

MIDDLEWARE = [
    'corsheaders.middleware.CorsMiddleware',
    'django.middleware.security.SecurityMiddleware',
    'whitenoise.middleware.WhiteNoiseMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ALLOWED_HOSTS = ['myapp-backend.herokuapp.com','myapp-frontend.herokuapp.com','127.0.0.1','localhost']

CORS_ORIGIN_ALLOW_ALL = True
CORS_ALLOW_CREDENTIALS = True

CORS_ORIGIN_WHITELIST = (
    'https://myapp-frontend.herokuapp.com',
    'http://localhost:3000',
)

CORS_ALLOW_METHODS = [
    'DELETE',
    'GET',
    'OPTIONS',
    'PATCH',
    'POST',
    'PUT',
]

CORS_ALLOW_HEADERS = [
    'accept',
    'accept-encoding',
    'authorization',
    'content-type',
    'dnt',
    'origin',
    'user-agent',
    'x-csrftoken',
    'x-requested-with',
]

Я немного застрял на этом, помогите! ))

...