问题：（由下描述可知，针对JS/AJAX的操作会存在跨域限制，而对FORM没限制）
跨域是我在日常面试中经常会问到的问题，这词在前端界出现的频率不低，主要原因还是由于安全限制(同源策略， 即JavaScript或Cookie只能访问同域下的内容)，因为我们在日常的项目开发时会不可避免的需要进行跨域操作，所以跨域能力也算是前端工程师的基本功之一。
我接触的项目中使用到的跨域解决方案如下：
一、使用剪切板（由于操作起来不友好，所以这种方案不建议）
alert(window.clipboardData.getData("text"));
window.clipboardData.setData("text","txt");
二、JSONP（适合于前后端交互，如帐管侧的JSP访问CRM侧的WEB层）FORM+POST没问题，AJAX+POST有问题(需要用该方案)
CRM侧WEB代码为：
public void getPrintButtonForJsonp(HttpServletRequest request, HttpServletResponse response) throws Exception {
String callback = request.getParameter("callback");
...;
response.setCharacterEncoding("GBK");
response.setContentType("text/html;charset=GBK");
response.getWriter().print(callback+"({returnInvoice:{status:'0',message:'findNoInvoice'}});");
}
帐管侧 前台调用方法为：getPrintButtonForJsonp
$.ajax({
url: 'http://localhost:8080/....ReportAction?action=getPrintButtonForJsonp&callback=?',
dataType: 'jsonp',
global: false,
success: function(json) {
var invoiceInfo=json.returnInvoice;
if(invoiceInfo.status==1){
//成功
}else{
alert('调用失败！'+invoiceInfo.message);
}
},
error: function(json) {
}
});
三、使用IFRAME，这种方法使用的非常频繁【用于查询头，前前交互】
应用场景：
WEB应用1通过弹出窗口形式调用WEB应用2的页面，WEB应用2通过window.returnValue返回值给WEB应用1
准备工作：WEB应用1（调用方）
test.jsp（功能使用页面）
<input type="button" onclick="selectInsAddress()" name="" value="点击">
<script type="text/javascript">
function selectInsAddress(){
var result = window.showModalDialog("http://localhost:8080/tt/KuaYuFrame.jsp","org","scroll:yes;resizable:no;status:no;dialogHeight:695px;dialogWidth:800px");
alert("拿到"+result);
}
</script>
KuaYuFrame.jsp（跨域页面，此页面可供该应用其它功能共享）
<script type="text/javascript">
function init(){
var url="http://10.1.21.88:8080/crm/boss/customer/cust/queryCommonCustForCallBack.jsp?callBackUrl=query_boss_customer_callback.jsp";
pbossIframe.location=url;
}
function callBack(param){
window.returnValue=param;
window.self.close();
}
</script>
</head>
<body onload="init()">
<iframe id="pbossIframe" src="" height="620px" width="959px" marginheight="0" marginwidth="0" ></iframe>
</body>
KuaYucallback.jsp（供目标应用回调）
<%
String custId = request.getParameter("returnValue");
%>
<script type="text/javascript">
function comeBack(){
parent.parent.callBack("<%=custId%>");
}
</script>
</head>
<body onload="comeBack()">
</body>
准备工作：WEB应用2（被调用方）
queryCommonCust.jsp
<iframe id="wangtlIframe" src="" height="" width="" marginheight="0" marginwidth="0" style="visibility: hidden;"></iframe>
function submit_callBackUrl(val)
{ //val为待返回值
wangtlIframe.location="http://localhost:8080/tt/<%=callBackUrl%>?returnValue="+val;
}
原理解析：
其中调用方的test.jsp为功能页面，通过弹出窗口打开自己域下KuaYuFrame.jsp，其内嵌目标域下的目标功能页面queryCommonCust.jsp，其待事成后会内嵌自己域下的KuaYucallback.jsp，
其会通过parent.parent调到自己域的方法。
相关推荐
1. **JSONP(JSON with Padding)**：JSONP是一种早期的跨域解决方案，它依赖于`<script>`标签不受同源策略限制的特点。通过动态创建`<script>`标签，设置其`src`属性为提供服务的服务器接口，并由服务器返回一个包裹...
另一种常见的跨域解决方案是使用动态插入`<script>`标签的方法。这种方法的原理是利用了浏览器允许动态加载JavaScript文件的特点，从而绕过同源策略的限制。 具体步骤如下： 1. 在前端页面中动态创建一个`<script>...
面对这样的问题，我们可以采用以下几种跨域解决方案： 1. **CORS（Cross-Origin Resource Sharing）**：服务器可以通过设置响应头`Access-Control-Allow-Origin`来允许特定的源进行跨域请求。例如，服务器端可以在...
JQuery的跨域解决方案主要依赖于JSONP（JSON with Padding）技术。JSONP是一种绕过同源策略的方式，它利用HTML中的`<script>`标签没有同源策略限制的特点。当jQuery使用`dataType: 'jsonp'`时，它实际上是在做以下几...
JSONP是一种较早的跨域解决方案，它利用了浏览器允许`<script>`标签跨域加载资源的特性。通过动态创建`<script>`标签，并指定其`src`属性为一个返回JSON数据的函数调用，服务器将数据包裹在函数调用中返回，客户端...
本文将深入探讨JavaScript跨域问题及其解决方案，以帮助开发者理解和应对这一问题。 首先，了解同源策略是解决问题的关键。同源策略是浏览器为了保障用户数据安全而实施的一种机制，它禁止了一个源的文档或脚本获取...
JavaScript跨域和Ajax跨域是Web开发中常见的问题，尤其在进行前后端分离或API调用时，由于浏览器的同源策略限制，不同域名、协议或端口的资源请求会被阻止，这就是所谓的“跨域”。本文将深入探讨JavaScript和Ajax...
4. JSONP（JSON with Padding）：这是一种早期的跨域解决方案，适用于只支持GET请求的API。它通过动态创建`<script>`标签来实现跨域请求。然而，JSONP不提供安全性，只适用于简单请求，且不支持HTTP的其他方法和头。...
JavaScript跨域问题，是Web开发中常见的一个挑战，由于浏览器的同源策略限制，JavaScript无法直接访问不同源的资源，这在实现某些功能时会带来不便。本文将深入探讨JavaScript跨域问题的原因、影响以及多种解决方案...
除了资源代理，还可以使用其他跨域解决方案： - CORS（跨源资源共享）：服务器端可以设置CORS头（如`Access-Control-Allow-Origin`），允许特定的源进行跨域请求。这种方法需要服务器端的支持，可能不适用于所有...
在现代Web开发中，跨域资源共享（CORS）是一个重要的概念，它允许...总之，Spring提供的CORS解决方案让开发者能够轻松处理跨域请求，同时保持应用的安全性。理解并熟练运用这些知识，对于构建现代化的Web应用至关重要。
这个文件可能包含了创建XMLHttpRequest对象、设置请求头、处理响应等内容的JavaScript代码，用于演示如何在实际项目中应用这些跨域解决方案。开发者可以通过查看和运行这些代码来加深对JSONP和CORS的理解，并在自己...
### 跨域访问解决方案与Cookie处理 在现代Web开发中，跨域问题一直是困扰开发者的一大难题。当浏览器出于安全考虑阻止不同源之间的数据交互时，跨域问题便产生了。为了解决这一问题，并确保在跨域场景下可以正确地...
为了解决这一问题，我们可以采用多种跨域解决方案，其中一种是通过设置代理服务器。 **一、什么是同源策略** 同源策略是浏览器为了保护用户安全而实施的一种安全策略，它规定浏览器只允许加载来自相同协议、域名和...
JSONP是一种早期的跨域解决方案，它是通过动态创建`<script>`标签来加载数据的。因为`<script>`标签不受同源策略限制，可以通过`src`属性指向提供JSON数据的外部服务。服务端返回的数据是一个JavaScript函数调用，...
### js跨域解决方案 #### 一、问题描述与背景 在网页开发中，经常会遇到需要一个主页面通过`iframe`动态加载子页面的情况，并且希望根据子页面的内容自动调整`iframe`的高度，以达到视觉上的无缝对接。然而，当...
前端跨域解决方案，jsonp和cros两种解决方式。我们发现，Web页面上调用js文件时不受是否跨域的影响，凡是拥有"src"这个属性的标签都拥有跨域的能力，比如[removed]、、<iframe>。那就是说如果要跨域访问数据，...
JavaScript跨域访问解决方案 在Web开发中，由于浏览器的安全策略——同源策略（Same Origin Policy），不同源的脚本之间无法直接通信或访问彼此的资源。同源策略规定，只有当两个URL的协议、域名和端口都相同时，...
在GIS（地理信息系统）开发中，ArcGIS JavaScript API（arcgis js）是Esri公司提供的一款...不过，需要注意的是，跨域问题的解决方案应根据项目需求和安全性考虑进行选择，确保既能满足功能需求，又能保障数据安全。
标题《JS跨域访问解决方案总结.pdf》指明文档的核心内容是关于JavaScript跨域访问问题的解决方法。跨域访问问题是指由于浏览器的同源策略限制，网页中JavaScript代码出于安全原因不能访问另一个源（域名、协议或端口...