跨域的系統。
---01---
跨域讀寫cookie:
代碼:
域名的解析就是將域名的ip地址找到的過程。
1.先在本機找,就是host文件
ip是一樣的,但是對於瀏覽器也是跨域了。
2.在網絡DNS找
同源策略,注意一點,cookie.setDomn只能在同源之下設置的不同的子域,這個只是域得作用級別,不能隨便寫,你不能寫入百度裏面去。
---
如何跨域讀寫cookie呢?
代碼:
演示:
流程是這樣的,首先是向a域發起請求,將jsp界面加載回來,加載回來之後呢,逐行掃描,掃描到script標籤就開始向b域發起請求。
再次訪問b域就發現這個cookie了。
返回的找個cookie只能是b域纔可以訪問的。
看下controller的代碼:
驗證下:
---
第二種:p3p協議,可以突破瀏覽器的第三方的訪問協議的。
a域向b域寫入cookie,b域服務端會告訴瀏覽器,我這個第三次方的隱私訪問是不是允許的。
再次實驗這次是成功的,第一次請求:
看到這個頭就是可以寫入的。
此時在b域,因爲從a域寫b域或者讀b域是有第三方隱私的。
改進:
---
第三種策略:
也就是重定向是可以跨域的。
代碼:
我們看下前端的代碼:
通過302進行網絡的跳轉,跳到b域。
訪問:
不足:只能分享給另外的一個域名。
---
跨域的讀取cookie:
我們給b域寫入了一個111的token。
在a域上執行方法,讀取b域的值:
---02---
跨域的ajax請求:
代碼:
package demo.sso.web;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* 示例性的,以json形式返回用戶信息的servlet
*/
@WebServlet("/user_info")
public class GetUserInfoServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* 非簡單請求,如 POST類型請求,或請求中有其它自定義Header,會執行一次preflight操作,瀏覽器會發起一次OPTIONS類型請求<br>
* 要對OPTIONS請求給予正確應答
*/
@Override
protected void doOptions(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
System.out.println("OPTIONS");
response.addHeader("Access-Control-Allow-Origin", "*");
response.addHeader("Access-Control-Allow-Methods",
"GET, POST, OPTIONS, DELETE");
response.addHeader("Access-Control-Allow-Headers", "reqid, xxxx");
}
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
// 簡單請求,直接設置Access-Control-Allow-Origin就可以了
response.addHeader("Access-Control-Allow-Origin", "*");
// 要正確設置響應類型,避免IE出現下載
response.setContentType("application/json");
response.getWriter().write("{\"id\":1, \"name\":\"zhangsan\"}");
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}
我們做一個實驗:
首先在b域訪問,就是b域調用b域:
再次在a域訪問,就是a域調用b域:
---
我們做一個實驗:
我們在a域名,訪問b域:
假如沒有處理的話:
看下調試結果:
解決辦法:
1.jsonp,原理和跨域讀取cookie的本質是一樣的。
就是根據javascript腳本動態的生成代碼的。
後臺:
前臺:這個腳本執行完畢的結果
直接執行這個代碼:
這就是jsonp實現的最本質的原理。
代碼的問題:
第一個問題:硬編碼
2.
加載之後就被執行完畢了,就是解析到這一行的時候,需要的時候生成。
回調+函數名對應的真實的函數就是showResult。
--
另一個函數:
---
這就是jsonp的原理,實際上我們已經實現了jsonp。
看下過程:
這個是防止緩存的。
我們看下後臺:
---
CORS
第二個問題:jsonp要改後臺的代碼,我們這次要重新定義下
我們看下錯誤的信息:
這個是瀏覽器獲得了一個相應的結果,但是是沒有被授權的。
後臺:
結果:
改進:寫的請求是來源是被我允許的,這裏是a域過來的 往b域請求 所以允許的是a域 可以加多個域
儘量不要用*。
繼續改進:
我們複雜化一下ajax請求,比如改爲psot請求,加header等。
結果:
分析原理:
後臺:
看下結果:
看下是被請求了兩次的:
第一次是發起的OPTIONS請求:
第二次:
對比:
jsonp都支持,cros新的瀏覽器
jsonp要改後臺,cros寫在配置文件就可以了
jsonp只支持get。post都支持的。
---03---
IFrame。
1.同域的javascripe如何通過frame實現互訪
代碼:
---
2.跨子域的訪問
關於跨域:
點擊第四個按鈕之後:
看下控制檯:子頁面加載了,但是title沒有變。
跨子域的解決方式就是提升域的級別:
在一個界面修改:
在另外一個界面修改:
再次測試,可以訪問
---
3.跨全域的訪問
獲取sub3的title之後,直接向mian發起請求是跨域的是被阻止的。
實現思路:
侷限:藉助中間界面,參數傳遞的是有限的。
---
如何設置:
mian.jsp如何接收消息?
案例:
看下傳遞過來的內容是什麼?
:發送者所在域的
:數據
:發送者子窗口的window對象
---
頁面之間的通信主要是幹什麼呢?
1.調用另外一個頁面的某個方法,在子頁面調父頁面的fun方法,完成子頁面向父頁寫入title的操作
2.訪問另外一個頁面的屬性,父頁面訪問子頁面的title,顯示在自己的p標籤
3.向另外一個頁面寫入信息,改寫子頁面的title
代碼:
第一步發送:
第二步:接收
看到45:31
---04---