文档章节

Ajax请求跨端口问题的描叙及解决

思想永无止境
 思想永无止境
发布于 2016/11/04 11:58
字数 545
阅读 95
收藏 0

phfile项目结构:
这里写图片描述

view里的接口定义:
这里写图片描述

以8080启动phfile项目.
浏览器访问:http://127.0.0.1:8080/test/
可以得到正确的结果:

{"status": 0,"data": "上传的图片名错误"}

还有一个phfile2的项目,和phfile项目基本一样,phfile2里有个task.html,
task.html里有个ajax请求:

"url": "http://127.0.0.1:8080/test/",
"data": params,
"type": 'POST',
"dataType": 'json',
"success": function (data) {
    if (data.status == 1) {
        alert("上传成功");
        location.reload(true);
    } else {
        alert('上传失败:'+data.data);
    }
    $('#file_modal').modal('hide');                     
},
"error": function (xhr, status, error) {
    alert("上传错误:" + error);
    $('#file_modal').modal('hide');
}

以8000启动phfile2项目.

调用结果:
1,statua返回0,readystate也为0,responseText返回error,永远弹出”上传错误:”
2,服务器的test方法正常执行.

test>>>>>>>>>>>>>>......
[31/Oct/2016 20:22:21] "POST /test/ HTTP/1.1" 200 73

3,将test方法从phfile移动到phfile2,将调用url改成:”url”: “http://127.0.0.1:8000/test/“后,
task.html弹出”上传失败:上传的图片名错误”

原因:
1.跨端口导致跨域问题.
跨域不只是说跨不同的域,而是包括协议、主机ip、端口三个。
tomcat服务器不存在此类问题,tomcat服务器的cors设置了同ip不同port可以访问。
而我使用的django自带的开发服务器,没有设置cors。

2.ajax访问时session为null(该原因已排除)
事实上ajax请求时request.session对象并不是null,但是request.session.session_key为None,这就意味着,这个session确实是个空session,因为session_key是session的唯一标识.
反之,通过浏览器访问时,可以看到session_key是一个字符串.
在网上有找到该问题的解释(不怎么读的通,大致能看明白就好):
1、系统的中的session为null所引起的主要因素。
2、当ajax请求时遇到session的都会只进不出了(只调用未返回值),就是会出现status=0
3、当出现错误不能抛出处理时,就会进入global中,applicationEnd此时就是程序结束,ajax也将先一步退出,并调用ajax的errorCallback

解决:
1.response添加”Access-Control-Allow-Origin”

@csrf_exempt
def test(request):
    response=HttpResponse(json_encode({"status":0,"data":"上传的图片名错误"}))
    response["Access-Control-Allow-Origin"] = "http://127.0.0.1:8000"
    print "test>>>>>>>>>>>>>>......"
    return response

© 著作权归作者所有

上一篇: 摘录
下一篇: Django-Model
思想永无止境
粉丝 4
博文 257
码字总数 292814
作品 0
昌平
程序员
私信 提问
Nginx 解决浏览器 Ajax 跨域问题

跨域是指 host 为 A 页面中的 Ajax 发起指向 host B 的请求,只要 A 和 B 的协议、域名、端口、子域名其中任何一项不同,则执行的访问都会被认为是跨域的请求,几乎所有的浏览器为了安全等问...

摆码王子
2018/04/16
0
0
浏览器同源策略及 Ajax 跨域解决方案

因为在开发过程中会经常遇到因为浏览器同源策略而导致的跨域问题,而多数开发者对浏览器同源策略和跨域问题并没有很清晰的认识,所以打算在这篇文章中说下浏览器同源策略和我们最经常会遇到的...

淘淘笙悦
2018/07/13
0
0
开发中Ajax跨域访问的限制原因分析以及解决方法

在一次demo的编写中, 这里我简述一下使用的东西,spring-boot和jQuery的ajax,还有tomcat 由于spring-boot对jsp的不友好,我将后台开发与前台分开写了,在前台发起请求的时候,tomcat的888...

努力编程的小蚂蚁
2017/12/25
0
0
AJAX跨域总结

蚂蚁金服的实习即将结束,将知识总结一下。 我们这个项目前端使用antD,antD是采用React封装的一套组件库,目前开源http://ant.design/,所有组件都是拿来即用,大大缩短了开发周期,强烈推荐...

炁元
2016/08/20
97
0
asp.net—WebApi跨域

一、什么是跨域?   定义:是指浏览器不能执行其他网站的脚本,它是由浏览器的同源策略造成的,是浏览器对JavaScript实施的安全限制。   同源策略限制了以下行为:   1、Cookie、Local...

WiTeem
2018/12/11
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Jenkins系列_插件安装及报错处理

进入Jenkins之后我们可以进行插件的安装,插件管理位于以下模块: 发现上面报了一堆错误,是因为插件的依赖没有安装好,那么这一节,就先把这些错误解决掉吧。解决完成后,也就基本会使用插件...

shzwork
今天
2
0
mysql mysql的所有查询语句和聚合函数(整理一下,忘记了可以随时看看)

查询所有字段 select * from 表名; 查询自定字段 select 字段名 from 表名; 查询指定数据 select * from 表名 where 条件; 带关键字IN的查询 select * from 表名 where 条件 [not] in(元素...

edison_kwok
昨天
9
0
多线程同时加载缓存实现

import com.google.common.cache.Cache;import com.google.common.cache.CacheBuilder;import java.util.concurrent.ExecutionException;import java.util.concurrent.ExecutorServi......

暗中观察
昨天
3
0
利用VisualVM 内存查看

准备工作,建几个测试类。等下就是要查看这几个类里面的属性 package visualvm;public class MultiObject { private String str; private int i; MultiObject(String str...

冷基
昨天
2
0
组装一台工作游戏两用机

一、配置清单如下: 分类 项目 价格(元) 主板 华硕(ASUS)TUF Z370-PLUS GAMING II 电竞特工 Z370二代 支持9代CPU 1049 CPU 英特尔(Intel) i7 8700K 酷睿六核 盒装CPU处理器 2640 风扇 九...

mbzhong
昨天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部