遇到的一个关于ajax跨域的问题

待我称王封你为后i 2022-01-15 15:01 202阅读 0赞

[为什么80%的码农都做不了架构师？>>> ][80_] ![hot3.png][]

首先说下几个解决方案:

1.jsonp

2.CORS

3.代理

4.iframe

这里说一下 1 2 4 我遇到的问题

1.jsonp 实际原理是加载远程js,所以返回的数据是一个可以执行的javasript代码,很明显如果你返回一段字符串 浏览器报错 .

2.cors 在服务器端 填写 (response.setHeader("**Access-Control-Allow-Origin","\*** "));

在后台中禁止使用跳转重定向 浏览器报错 302

4.iframe 加载一个的页面 需要在每个连接上加上远程服务器地址 比如 我们一般写/ 这样的话 会默认执行location的地址 就是浏览器中的地址 很明显 会出现各种问题

\*\*\*

网上有很多博客,我在这里说写自己的体会 说点不一样的

\*\*\*

jsonp 是jquery 封装的一个ajax

在定义ajax的时候 需要jsoncallback参数

很多博文里面会写到修改服务器的返回值 返回值是 callback+(返回值)

这里有两点注意

一 是一定要写上callback 这个方法名 这东西可以前台自定义 如果没有jquery自动生成一个唯一方法名称

二 是返回值是符合jsonp格式的

这两点 太让人难受了

因为很多系统是多方开发的 没谁配合你修改这 修改那里

那怎么办呢?

这里给大家说一下我的解决办法

首先 这个是jquery封装的

那么大家可以看一下jquery的源代码 进行修改

或者重写代码

// Callback for when everything is done
    		function done( status, nativeStatusText, responses, headers ) {
    			............................
    					isSuccess = ajaxConvert( s, response );// 这里对服务器的响应数据进行转换
    					statusText = isSuccess.state;
    					success = isSuccess.data;
    					error = isSuccess.error;
    					isSuccess = !error;
    
    
    
    // Chain conversions given the request and the original response
    function ajaxConvert( s, response ) {
    	....
    ...
    				if ( conv !== true ) {
    
    					// Unless errors are allowed to bubble, catch and return them
    					if ( conv && s["throws"] ) {
    						response = conv( response );
    					} else {
    						try {
    							response = conv( response );// 这里对服务器的响应数据进行转换
    						} catch ( e ) {
    							return { state: "parsererror", error: conv ? e : "No conversion from " + prev + " to " + current };
    						}
    					}
    				}
    			}
    
    这里conv( response );会执行
    // Install script dataType
    jQuery.ajaxSetup({
    	accepts: {
    		script: "text/javascript, application/javascript, application/ecmascript, application/x-ecmascript"
    	},
    	contents: {
    		script: /(?:java|ecma)script/
    	},
    	converters: {
    		"text script": function( text ) {
    			jQuery.globalEval( text );
    			return text;
    		}
    	}
    });
    converters 方法
    
    这里 的text 就是服务器响应内容  看到这里 大家是不是明白了?
    在前端得到了数据  想怎么编辑数据都可以了
    
    			jQuery.globalEval( text ); // 执行javascript代码  当然你可以不执行
    // alert(123)
    // var o =JSON.parse(text); alert(o.msg);
    so ....

后续遇到的问题

用于单点登录

关于跨域cookie的写入问题

看了好多博文都没弄明白

这里说下两个解决办法

1. 用jsonp 跨域请求 服务器 设置cookie response.addCookie

2.用iframe跨域网站 获得页面代码 设置cookie

3.a得到b站的凭证(需要保存的cookie)之后 跳转b站的时候 当做参数再传回去 b站响应的时候 在设置cookie

4.a站跳转到b站的一个中间页面 比如欢迎回来 继续跳转 这样的页面 这个页面添加b站cookie 并且重定向到b站要访问的页面 缺点很明显 就是需要中间过渡页面

我用的是第三种办法

前面两种收到大坑框架限制

坑1: ajax cookie 设置了安全访问限制 需要https