Я использую angularjs и django-cors-headers, а затем даю "что запрещено для запросов с разными источниками, которые требуют предварительной проверки".
У меня есть локальный сервер Django, который ссылается на номер порта 8000, и локальный nginx, который загружает страницу html номера порта 2080.
Я устанавливаю пакет django-cross-header для решения междоменной ошибки.
Конфигурация django-cross-header в файле settings.py:
CORS_ALLOW_CREDENTIALS = True
CORS_ORIGIN_ALLOW_ALL = True
CORS_ALLOW_HEADERS = (
'x-requested-with',
'content-type',
'accept',
'origin',
'authorization',
'x-csrftoken'
)
CORS_ORIGIN_WHITELIST = (
'127.0.0.1:2080',
'localhost:2080'
)
Config angularjs выглядит так:
portman.config(function ($routeProvider, $interpolateProvider, $httpProvider) {
$routeProvider.otherwise('/');
$httpProvider.defaults.headers.common['X-CSRFToken'] = csrftoken;
$interpolateProvider.startSymbol('{$').endSymbol('$}');
delete $httpProvider.defaults.headers.common['X-Requested-With'];
});
portman.constant('ip','http://127.0.0.1:8000/');
Получить код метода в angularjs:
$http({
method: 'GET',
url: ip+'api/v1/dslam/events',
}).then(function (result) {
$scope.dslam_events = result.data;
}, function (err) {
});
заголовок запроса: предварительные заголовки показаны
Accept:application/json, text/plain, */*
Origin:http://127.0.0.1:2080
Referer:http://127.0.0.1:2080/
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.99 Safari/537.36
X-CSRFToken:ztouFO8vldho97bWzY9mHQioFk3j6h5V
После загрузки страницы я вижу эту ошибку:
XMLHttpRequest cannot load http://127.0.0.1:8000/api/v1/dslam/events.The request was redirected to 'http://127.0.0.1:8000/api/v1/dslam/events/', which is disallowed for cross-origin requests that require preflight.
Но когда я отправляю запрос из консоли, это будет ответ от сервера django, мой код jquery:
$.ajax({
type: 'GET',
url: "http://5.202.129.160:8020/api/v1/dslam/events/",
success:function(data){
console.log(data);
}
});
Заголовок запроса:
Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8,fa;q=0.6,pt;q=0.4
Connection:keep-alive
Host:127.0.0.1:8000
Origin:http://127.0.0.1:2080
Referer:http://127.0.0.1:2080/
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.99 Safari/537.36
Помогите мне, пожалуйста.
3 ответа
Вам нужно добавить corsheaders
к вашим установленным приложениям.
INSTALLED_APPS = [
...,
'corsheaders',
...,
]
добавлять corsmiddleware
к классам промежуточного программного обеспечения.
MIDDLEWARE_CLASSES = [
...,
'corsheaders.middleware.CorsMiddleware',
...,
]
И, наконец, вам не хватает одной косой черты в конце URL "/". Также вы должны добавить токен csrf в ваш запрос http, чтобы он работал с небезопасными методами http, такими как POST, PATCH, PUT AND DELETE.
$http({
method: 'GET',
url: ip+'api/v1/dslam/events/',
'X-CSRFToken' : $cookies.get('csrftoken')
}).then(function (result) {
$scope.dslam_events = result.data;
}, function (err) {
});
Для того, чтобы $cookies
сервис для работы, нужно установить угловой модуль ngCookies и все.
Попробуйте это для включения перекрестного происхождения
https://github.com/ottoyiu/django-cors-headers
У меня была такая же проблема, как и у вас. Мне просто нужно было добавить следующие настройки в httpd.conf
и угловое приложение. Вот и все, просто выполните следующие шаги.
<IfModule mod_headers.c>
SetEnvIf Origin (.*) AccessControlAllowOrigin=$1
Header add Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin
Header set Access-Control-Allow-Credentials true
</IfModule>
И в угловом приложении
angular.module('app', ['ngCookies'])
.config([
'$httpProvider',
'$interpolateProvider',
function($httpProvider, $interpolateProvider, $scope, $http) {
$httpProvider.defaults.withCredentials = true;
$httpProvider.defaults.xsrfCookieName = 'csrftoken';
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
}]).
run([
'$http',
'$cookies',
function($http, $cookies) {
$http.defaults.headers.post['X-CSRFToken'] = $cookies.csrftoken;
}]);
Вот подробности о CORS.