Python Django Rest框架:无法加载XMLHttpRequesthttp://127.0.0.1:8000/xyz/api/abc

Python Django Rest框架:无法加载XMLHttpRequesthttp://127.0.0.1:8000/xyz/api/abc,python,angularjs,django,rest,cors,Python,Angularjs,Django,Rest,Cors,解决方案:在url末尾添加一个尾随斜杠 “”而不是“” 我已经成功地创建了Django Rest API,并且似乎能够在本地存储和托管数据。我单独构建了一个angularjs1.0应用程序,试图通过$http get请求提取数据,但遇到以下错误: XMLHttpRequest cannot load http://127.0.0.1:8000/xyz/api/abc. No 'Access-Control-Allow-Origin' header is present on the reque

解决方案:在url末尾添加一个尾随斜杠

“”而不是“”

我已经成功地创建了Django Rest API,并且似乎能够在本地存储和托管数据。我单独构建了一个angularjs1.0应用程序,试图通过$http get请求提取数据,但遇到以下错误:

XMLHttpRequest cannot load http://127.0.0.1:8000/xyz/api/abc. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://172.20.9.163:8080' is therefore not allowed access.
我尝试安装CORS,并将其添加到我已安装的应用程序中,但似乎没有任何效果

这是get请求:

getABC : function() {
            $http({
                method: 'GET',
                url: 'http://127.0.0.1:8000/xyz/api/abc',
                cache: false
            }).success(function(data) {
                console.log(data)
                callback(data);
            });
        },
下面是我的Django settings.py文件:

INSTALLED_APPS = (
    'xyz',
    'corsheaders',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'rest_framework',
)

MIDDLEWARE_CLASSES = (
    'django.contrib.sessions.middleware.SessionMiddleware',
    'corsheaders.middleware.CorsMiddleware',
    '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
TL;DR

向斜杠附加的URL发出AJAX请求

解释

经过我们的讨论,罪魁祸首似乎是Django的自动
APPEND\u SLASH=True
,它在启用
CommonMiddleware
时启用

这会导致Angular应用程序的AJAX请求首先命中一个永久移动的
301
重定向到斜杠附加的URL。但是,
corsheaders
中间件不会对该响应执行操作,因此浏览器会抱怨缺少
访问控制允许源文件
标题

这可以通过直接请求斜杠附加的URL并完全绕过301重定向来解决

$http({
方法:“GET”,
网址:'http://127.0.0.1:8000/xyz/api/abc/“,//此处为尾随斜杠
缓存:false
}).成功(……);
安装django收割台

在setting.py中:

设置CORS\u原点\u允许\u所有为真

在Ajax调用(前端)中添加标题:

如果未解决,则应在请求服务器()中启用核心


您能在Dev工具中打开Network选项卡并检查对AJAX请求的响应吗?它实际上是否包含
访问控制允许来源
标题?对不起,我应该在哪里看到这个?我打开了“网络”选项卡,但在任何地方都看不到ajax请求响应。@IgorRaush“远程地址:127.0.0.1:8000请求URL:请求方法:获取状态代码:301永久移动(从缓存)”,当单击“响应”选项卡时,它会显示“此请求没有可用的响应数据”。某些内容已关闭。您的API正在返回重定向响应。该响应上是否有
位置
标题?你能跑
curl--head吗http://localhost:8000/xyz/api/abc
从命令行?此外,请求可能甚至无法到达服务器,它会作为永久移动的
301缓存在浏览器中。。。
pip install django-cors-headers
MIDDLEWARE = [
             #...
                 'corsheaders.middleware.CorsMiddleware',
                 'django.middleware.common.CommonMiddleware',
             ]
INSTALLED_APPS = [

                'corsheaders',
                 #...
                ]
CORS_ORIGIN_ALLOW_ALL = True  # this allows all domains

Or to allow specific domains 

CORS_ORIGIN_WHITELIST = (
'http://example.com',
'http://127.0.0.1:8000',
'http://localhost:8000',
 )
 var get_request = $.ajax({
  type: 'GET',
  "headers": {
          "accept": "application/json",
          "Access-Control-Allow-Origin":"*"
      },
  url: 'http://example.com',
});