1.同源策略

由Netscape提出的一个安全策略，是浏览器最核心的安全功能。缺少同源策略可能会使浏览器正常功能受到影响。目前所有支持javaScript的浏览器都会使用这个策略。

所谓同源指的是: 协议、域名、端口号都相同。只要有一个不相同那就是非同源的。

浏览器在执行脚本的时候，都会检查这个脚本属于哪个页面，即检查是否同源，只有同源的脚本才会被执行；而非同源的脚本在请求数据的时候，浏览器会报一个异常，提示拒绝访问。

①、http://www.123.com/index.html 调用 http://www.123.com/welcome.jsp 协议、域名、端口号都相同，同源。

②、https://www.123.com/index.html 调用 http://www.123.com/welcome.jsp 协议不同，非同源。

③、http://www.123.com:8080/index.html 调用 http://www.123.com:8081/welcome.jsp 端口不同，非同源。

④、http://www.123.com/index.html 调用 http://www.456.com/welcome.jsp 域名不同，非同源。

⑤、http://localhost:8080/index.html 调用 http://127.0.0.1:8080/welcom.jsp 虽然localhost等同于 127.0.0.1 但也是非同源的。
　　　同源策略限制的情况：
1.Cookie、LocalStorage 和 IndexDB 无法读取
2.DOM 和 Js对象无法获得
3.AJAX 请求不能发送

跨域解决办法

response 添加 header

1  //*表示支持所有网站访问，也可以额外配置相应网站
2  resp.setHeader("Access-Control-Allow-Origin", "*");

JSONP 方式
1.首先要修改 index.jsp 页面的 ajax 请求：

 1         $.ajax({
 2             type:"get",
 3             async:false,
 4             url:"http://localhost:8080/JavaWeb01/getPassWordByUserNameServlet?userName=Tom",
 5             dataType:"jsonp",//数据类型为jsonp
 6             jsonp:"backFunction",//服务端用于接收callBack调用的function名的参数
 7             success:function (data) {
 8                 alert(data["passWord"]);
 9             },
10             error:function () {
11                 alert("error");
12             }
13 
14         });

修改了 ataType 的数据类型为 jsonp，并新增 jsop 属性值为 “backFunction”。

2.接着在 JavaWeb01 项目的 Servlet 中进行如下修改：

 1 @WebServlet("/getPassWordByUserNameServlet")
 2 public class UserServlet extends HttpServlet{
 3     @Override
 4     protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
 5         String userName = req.getParameter("userName");
 6         String passWord = null;
 7         if(userName != null){
 8             passWord = "123";
 9         }
10         JSONObject jsonObject = new JSONObject();
11         jsonObject.put("passWord",passWord);
12         //1、第一种方法：*表示支持所有网站访问，也可以额外配置相应网站
13         //resp.setHeader("Access-Control-Allow-Origin", "*");
14 
15         //2、第二种方法：jsonp
16         String backFunction = req.getParameter("backFunction");
17         resp.getWriter().println(backFunction+"("+jsonObject.toJSONString()+")");
18         
19         //resp.getWriter().println(jsonObject.toJSONString());
20     }
21 }

原理：

同源策略下，一般的ajax是不能进行跨域请求的。但 img、iframe 、script这些标签可通过src属性请求到其他服务器上的数据。利用 script标签的开放策略，可实现跨域请求数据，这需要服务器端的配合。 Jquery中ajax 的核心是通过 XmlHttpRequest获取非本页内容，而jsonp的核心则是动态添加

来源：CSDN

作者：芝士奶酪海底捞

链接：https://blog.csdn.net/cxr1233/article/details/103913787

标签

jsonobject

ajax