Question

我开发了一个带有django后端的站点，并且还包含了一个django rest framework API和django-cors。接下来的挑战是使用angularJS使用API。但是浏览器继续返回我的请求是Forbidden Error 403.

这是我的settings.py

INSTALLED_APPS = [
'bootstrap3',
'Users.apps.UsersConfig',
'projects.apps.ProjectsConfig',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'rest_framework',
'corsheaders',]

MIDDLEWARE_CLASSES = [
'corsheaders.middleware.CorsMiddleware',
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.auth.middleware.SessionAuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',]
CORS_ORIGIN_ALLOW_ALL = True
CORS_ALLOW_CREDENTIALS = True
CORS_ALLOW_HEADERS = (
    'x-requested-with',
    'content-type',
    'accept',
    'origin',
    'authorization',
    'x-csrftoken',
    'Access-Control-Allow-Origin',
    'Access-Control-Allow-Credentials',
    'Access-Control-Allow-Headers',
    'Access-Control-Allow-Methods')

这是html代码。

<!DOCTYPE html>
<html lang="en-US">
<script type="text/javascript" src='angular.js'></script>
<head>
<title>Test 1</title>
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
{{results}}
</div>

<script type="text/javascript">
var app = angular.module('myApp',[]);
app.controller('myCtrl',function($scope,$http){
    $http.get("http://127.0.0.1:8000/api/projects/")
    .then(function(response){
        $scope.results=response.data;
    });
});

app.config(['$httpProvider',function($httpProvider) {
  $httpProvider.defaults.useXDomain = true;
  delete $httpProvider.defaults.headers.common["X-Requested-With"];
  $httpProvider.defaults.headers.common["Accept"] = "application/json";
  $httpProvider.defaults.headers.common["Content-Type"] ="application/json";
  $httpProvider.defaults.headers.common['Access-Control-Allow-Origin'] ='*';
  $httpProvider.defaults.headers.common['Access-Control-Allow-   Headers']='Origin, X-Requested-With, Content-Type, Accept';
  $httpProvider.defaults.headers.common['Access-Control-Allow-Methods'] = 'GET, OPTIONS';
  $httpProvider.defaults.headers.common['Access-Control-Allow-Credentials']= true;}])
</script>
</body>
</html>

AngularJS，Django Cors Django Rest Framework Intergration

0 个答案: