Python的Django应用程序解决AJAX跨域访问问题的方法-6ren

Python的Django应用程序解决AJAX跨域访问问题的方法

转载作者：qq735679552 更新时间：2022-09-29 22:32:09

CFSDN坚持开源创造价值，我们致力于搭建一个资源共享平台，让每一个IT人在这里找到属于你的精彩世界.

这篇CFSDN的博客文章Python的Django应用程序解决AJAX跨域访问问题的方法由作者收集整理，如果你对这篇文章有兴趣，记得点赞哟.

引子使用Django在服务器端写了一个API，返回一个JSON数据。使用Ajax调用该API:

 
    ? 
   
         <!DOCTYPE HTML> 
        
         <html> 
        
         <head> 
        
         <meta charset= 
         "utf-8" 
         > 
        
         <meta name= 
         "viewport" 
         content= 
         "maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" 
         /> 
        
         <title>test</title> 
        
         </head> 
        
         <body> 
        
         <button onclick= 
         "showPersonInfo()" 
         >点我获取数据</button> 
        
         </body> 
        
         <script src= 
         "http://libs.baidu.com/jquery/1.9.0/jquery.js" 
         ></script> 
        
         <script> 
        
         function 
         showPersonInfo(){ 
        
         $.getJSON( 
        
         'http://xxx/account/getuserinfo/' 
         , 
        
         {username:  
         "abc" 
         }, 
        
         function 
         (json) { 
        
         var 
         html= 
         '<br>' 
         + 
         '用户名：' 
         +json.username+ 
         '<br>' 
         + 
         '姓：' 
         +json.first_name+ 
         '<br>' 
         + 
         '名:' 
         +json.last_name+ 
         '<br>' 
         + 
         '邮箱' 
         +json.email;     
        
         document.write(html); 
        
         } 
        
         ) 
        
         } 
        
         </script> 
        
         </html>

但是，Chrome浏览器提示错误:

 
    ? 
   
         No 'Access-Control-Allow-Origin' header is present on the requested resource.

经过一番Google发现这个问题是——CORS导致的.

什么是CORS？ CORS（跨域资源共享，Cross-Origin Resource Sharing）是一种跨域访问的机制，可以让Ajax实现跨域访问。其实，在服务器的response header中，加入“Access-Control-Allow-Origin: *”即可支持CORS，非常的简单，apache/nginx等怎么配置，见参考文档。举个例子:

API部署在DomainA上；
Ajax文件部署在DomainB上，Ajax文件会向API发送请求，返回数据；
用户通过DomainC访问DomainB的Ajax文件，请求数据

以上过程就发生了跨域访问。如果直接使用Ajax来请求就会失败，就像Chrome提示的:

 
    ? 
   
         No 'Access-Control-Allow-Origin' header is present on the requested resource.

如何解决Ajax跨域访问问题？解决跨域问题，有两个方法：1.使用jsonp 2.使CORS生效使用jsonp方法，需要让服务器端放回jsonp格式的response，如Django可以加jsonp相关的decorator，如：https://coderwall.com/p/k8vb_a/returning-json-jsonp-from-a-django-view-with-a-little-decorator-help由于我不太喜欢这种方式，所以这里略过了，可看后面的参考资料。使用CORS：这个用起来比较方便，现在大多数浏览器都支持了，且我web服务器完全开放给别人调用，所以比较推荐CORS。 1.使用JSONP 使用Ajax获取json数据时，存在跨域的限制。不过，在Web页面上调用js的script脚本文件时却不受跨域的影响，JSONP就是利用这个来实现跨域的传输。因此，我们需要将Ajax调用中的dataType从JSON改为JSONP（相应的API也需要支持JSONP）格式。 JSONP只能用于GET请求.

2.直接修改Django中的views.py文件修改views.py中对应API的实现函数，允许其他域通过Ajax请求数据:

 
    ? 
   
         def 
         myview(_request): 
        
         response  
         = 
         HttpResponse(json.dumps({ 
         "key" 
         :  
         "value" 
         ,  
         "key2" 
         :  
         "value" 
         })) 
        
         response[ 
         "Access-Control-Allow-Origin" 
         ]  
         = 
         "*" 
        
         response[ 
         "Access-Control-Allow-Methods" 
         ]  
         = 
         "POST, GET, OPTIONS" 
        
         response[ 
         "Access-Control-Max-Age" 
         ]  
         = 
         "1000" 
        
         response[ 
         "Access-Control-Allow-Headers" 
         ]  
         = 
         "*" 
        
         return 
         response

3.安装django-cors-headers 这里还有一各发现！在Django中，有人开发了CORS-header的middleware，只在settings.py中做一些简单的配置即可，见：https://github.com/ottoyiu/django-cors-headers/现在用起来服务器端完全开放，开启CORS，没有跨域烦恼，真爽！~ 安装django-cors-headers:

 
    ? 
   
         pip  
         install 
         django-cors-headers

在settings.py中增加:

 
    ? 
   
         INSTALLED_APPS  
         = 
         ( 
        
         ... 
        
         'corsheaders' 
         , 
        
         ... 
        
         ) 
        
         ... 
        
         MIDDLEWARE_CLASSES  
         = 
         ( 
        
         ... 
        
         'corsheaders.middleware.CorsMiddleware' 
         , 
        
         'django.middleware.common.CommonMiddleware' 
         , 
        
         ... 
        
         )

可以配置允许跨域访问的白名单或者直接设置为允许所有的跨域访问，具体的配置可以看看他们的github页说明.

最后此篇关于Python的Django应用程序解决AJAX跨域访问问题的方法的文章就讲到这里了,如果你想了解更多关于Python的Django应用程序解决AJAX跨域访问问题的方法的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！。

文章推荐： Python中Collections模块的Counter容器类使用教程

文章推荐： Axios 如何实现请求重试？

文章推荐：一篇文章带你搞懂非关系型数据库MongoDB

文章推荐： python语言使用技巧分享

django - 在 Django+Django REST 中创建具有外键关系的嵌套资源
我对 Python-Django 和 web 开发还很陌生，我被困在这个使用 POST 创建新资源的特殊问题上。我正在为 REST API 使用 Django REST 框架，我正在尝试创建一个新资
django - 如何下载使用 Django 存储上传的 Django 媒体文件？
我已经使用 Django-storages 成功地将 Word 文档存储到 S3。 class Document(TitleSlugDescriptionModel, TimeStampedModel
django - 如何在给定 Django 模型对象或查询集的情况下使用 Django 代理模型
我有 2 个关于模型代理的问题，如何从模型对象创建代理对象？如何从模型查询集创建代理查询集？例如，假设我们定义了: from django.contrib.auth.models import
django - 从 Django 测试访问 Django 测试服务器
我想编写一个直接执行 HTTP 请求的单元测试(而不是使用 django.test.client.Client)。如果您好奇为什么 - 那是因为我想测试我从 Django 应用程序公开的 Thrif
django - 如何开始构建 django 网站以及 django 如何构建页面？
我为我的个人网站启动了一个 django 项目来学习 django。到目前为止，我已经将我的开发环境设置为我需要的一切，并遵循 this很棒的教程来创建一些基本的数据结构和模板。现在我想开始使用我之前
django - Python/Django django-registration 添加一个额外的字段
我已经阅读了很多关于如何在使用 Django 注册时添加额外字段的信息，例如 here 、 here 和 here 。代码片段是: forms.py(来自注册应用程序) class Registrat
django - Django:如何从每个 View 写入当前用户名(django)
我正在编写小型社交应用程序。功能之一是在网站标题中写入用户名。因此，例如，如果我登录并且我的名字是Oleg(用户名)，那么我应该看到: Hello, Oleg | Click to edit prof
django - 如何将 django-reversion 添加到使用 django 和 django-rest 框架开发的应用程序中
我有一个使用 Django 和 Django Rest 框架开发的应用程序。我想将 django-reversion 功能添加到我的应用程序中。我已经尝试过http://django-reversi
django - 可以在没有 Django 表单的情况下呈现 Django 表单字段吗？
我有一个简单的 HTML 表单，我没有使用 Django 表单，但现在我想添加一个选择。选择最容易创建为 Django ChoiceField (与通过循环等手动创建选择相反)，但是，如果没有在 D
django - 字符串中的 Django 外键和不带字符串的 Django 外键有什么区别？
我不明白为什么人们以两种方式编写外键，这样做的目的是什么？它们是相同还是不同？我注意到有些人这样写: author = models.ForeignKey(Author, on_delete=mod
django - 使用 Django 评论获取 Django 中评论最多的帖子
我想在我的 Django 应用程序中获取评论最多的十个帖子，但我做不到，因为我想不出合适的方法。我目前正在使用 django 评论框架，并且我已经看到使用 aggregate or annotate
django - Django 管理中日期字段的自定义过滤器，Django 1.2
这对于 Django 1.2 仍然有效吗？ Custom Filter in Django Admin on Django 1.3 or below 我已经尝试过，但管理类中的 list_filter
django - 在 Django 中使用模板变量和 django-compressor
问题在于，当 django-compressor 编译为 .js 文件的 CoffeeScript 文件中引用 {{ STATIC_URL }} 时，它无法正确加载。在我的 django 模板中，我
django - 在事件应用程序上将数据从一个 django 模型移动到另一个(django+south)
我正在尝试将一些字段从一个 django 模型移动到一个新模型。假设我有一个书籍模型: class Book(models.Model): title = models.CharField(max
django - 使用 Django 评论获取 Django 中评论最多的帖子
我想在我的 Django 应用程序中获取评论最多的十个帖子，但我做不到，因为我想不出合适的方法。我目前正在使用 django 评论框架，并且我已经看到使用 aggregate or annotate
django - 比较 django 权限并使用 django 规则
目前我正在寻找在 Django 中实现访问控制。我已经阅读了有关内置权限的内容，但它并不关心每个对象的基础。例如，我想要“只有创建者可以删除自己的项目”之类的权限。所以我读到了 django-guar
django - 如何将 Django 模型的一个字段的值设置为等于其他 Django 模型的其他字段
嗨，我正在将我的 Django 模型的一个字段的值设置为其他模型的另一个字段的值。这个值应该是动态变化的。这是我的第一个模型 class MainModel(AbstractBaseUser, Pe
django - 来自模型的初始表单数据 - Django
我正在尝试为我的模型创建一个编辑表单。我没有使用模型表单，因为根据模型类型，用户可以使用不同的表单。 (例如，其中一个表单有 Tinymce 小部件，而另一个没有。) 有没有什么方法可以使用模型设置表
django - Django 模板中的搜索字段
Django 模板中的搜索字段如何在类似于此图像的 Django 模板中创建搜索字段 http://asciicasts.com/system/photos/1204/original/E354I0
django - Django 如何知道用户是谁？
根据 Django documentation ，如果 Django 安装激活了 AuthenticationMiddleware，HttpRequest 对象有一个“user”属性代表当前登录的用户

qq735679552

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

Python的Django应用程序解决AJAX跨域访问问题的方法