快3网上购买

如何解决跨域问题?

电脑杂谈  发布时间:2019-09-03 06:02:13  来源:网络整理

如何解决跨域问题_怎么解决跨域问题_怎么解决跨域问题

如何解决跨域问题?首先我们必须了解哪些是跨域,跨域指的是浏览器不能执行其他网页的类库怎么解决跨域问题,它是由浏览器的同源策略造成的,是浏览器对JavaScript 施加的安全限制。

根据百度百科同源策略它是由 Netscape 提出的一个安全思路,它是浏览器最核心只是最基本的安全功能,如果缺乏同源策略,则浏览器的正常功能也许就会得到影响,现在所有支持JavaScript的浏览器都会使用这个策略。

所谓同源指的是:

协议、域名、端口号都同样,只要有一个不相似,那么都是非同源。

浏览器在执行脚本的之后,都会检查这个脚本属于什么页面,即检测能否同源,只有同源的脚本就会被执行;而非同源的脚本在请求快3网上购买数据的之后,浏览器会报一个异常,提示拒绝访问。

①、 调用 协议、域名、端口号都同样,同源。

快3网上购买②、 调用 协议不同,非同源。

③、:8080/index。html 调用 :8081/welcome。jsp 端口不同,非同源。

④、 调用 域名不同,非同源。

⑤、:8080/index。html 调用 :8080/welcom。jsp 虽然localhost等同于 127。0。0。1 但是也有非同源的。

如何解决跨域问题_怎么解决跨域问题_怎么解决跨域问题

同源策略限制的状况:

1、Cookie、LocalStorage 和 IndexDB 无法读取

2、DOM 和 Js对象能够获取

3、AJAX 请求不能发送

注意:对于像 img、iframe、script 等标签的 src 属性是特例,它们是可以访问非同源网站的资源的。

我们创建了两个 web 项目JavaWeb01 和 JavaWeb02 分别部署在tomcat1和Tomcat2上上,这两个 Tomcat 的端口号设置是不一样的,一个是 8080,一个是8081,所以这两个项目组成了非同源。那么我们从客户端(浏览器)输入访问部署在 Tomcat2 上的项目 JavaWeb2,然后在该项目中借助 ajax 去请求部署在 Tomcat1 上的项目数据,能够访问的到呢?

①、在 JavaWeb02 项目中,有一个 jsp 文件,我们通过在浏览器访问该 JSP 文件去获取 JavaWeb01 项目中的数据

 1 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2          pageEncoding="UTF-8" isELIgnored="false"%>
 3 <%
 4     String path = request.getContextPath();
 5     String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
 6             + path;
 7 %>
 8 <!DOCTYPE html>
 9 <head>
10     <title>Title</title>
11 </head>
12 <script type="text/javascript" src="<%=basePath%>/js/jquery-3.3.1.min.js"></script>
13 <script type="text/javascript">
14     $(document).ready(function(){
15         $.ajax({
16             type:"get",
17             async:false,
18             url:"http://localhost:8080/JavaWeb01/getPassWordByUserNameServlet?userName=Tom",
19             dataType:"json",
20             success:function (data) {
21                 alert(data['passWord']);
22             },
23             error:function () {
24                 alert("error");
25             }
26 
27         });
28     })
29 
30 </script>
31 <body>
32 
33 </body>
34 </html>

通过ajax 访问

url:":8080/JavaWeb01/getPassWordByUserNameServlet?userName=Tom"

怎么解决跨域问题_怎么解决跨域问题_如何解决跨域问题

去获取 JavaWeb01 项目中的数据。

②、在 JavaWeb01 项目中,创建一个getPassWordByUserNameServlet 请求的 Servlet

 1 package com.ys.servlet;
 2 
 3 import com.alibaba.fastjson.JSONObject;
 4 
 5 import javax.servlet.ServletException;
 6 import javax.servlet.annotation.WebServlet;
 7 import javax.servlet.http.HttpServlet;
 8 import javax.servlet.http.HttpServletRequest;
 9 import javax.servlet.http.HttpServletResponse;
10 import java.io.IOException;
11 
12 /**
13  * Create by YSOcean
14  */
15 @WebServlet("/getPassWordByUserNameServlet")
16 public class UserServlet extends HttpServlet{
17     @Override
18     protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
19         String userName = req.getParameter("userName");
20         String passWord = null;
21         if(userName != null){
22             passWord = "123";
23         }
24         JSONObject jsonObject = new JSONObject();
25         jsonObject.put("passWord",passWord);
26         resp.getWriter().println(jsonObject.toJSONString());
27     }
28 }

③、在浏览器中输入:8081/JavaWeb02/index.jsp 链接怎么解决跨域问题,去读取该页面的 ajax 函数

浏览器给我们返回了一个错误,这就是浏览器同源策略造成的跨域访问会报错。那么该怎么解决呢?

我们在 Servlet 请求返回时添加如下代码:

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

请求结果如下:

首先我们要更改 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         });

怎么解决跨域问题_如何解决跨域问题_怎么解决跨域问题

注意:我们修改了 dataType 的数据类型为 jsonp,并且新增了 jsop 属性值为 “backFunction”。

接着在 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 }

结果就不照片了,下面讲讲这种方法的机理。

1、在同源策略下,在某个服务器下的页面是能够获得到该服务器以外的数据的,即通常的ajax是不能进行跨域请求的。但img、iframe、script等标签是个例外,这些标签可以借助src属性请求到其它服务器上的数据。利用script标签的开放思路,我们可以推动跨域请求数据,当然这应该服务器端的配合。Jquery中ajax的核心是借助XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加<script>标签来读取服务器提供的js类库。


本文来自电脑杂谈,转载请注明本文网址:
http://www.kadakong.com/a/jisuanjixue/article-121523-1.html

发表评论  请自觉遵守互联网相关的政策法规,严禁发布、暴力、反动的言论

  • 丘丹
    丘丹

    不过美国所谓亚太盟国对此并不买帐

  • 朱欢欢
    朱欢欢

    悄悄的派遣核潜艇深入美国的12海里巡航

上海11选五 状元彩票官网 快3投注官网 状元彩票开户 快三平台 快3网上购买 江苏快3平台 快3娱乐平台 快赢彩票官网 北京赛车PK10计划