Java跨域問題的處理詳解
前言
相信大家在寫前端腳本的時候經(jīng)常會遇到發(fā)送數(shù)據(jù)到后臺的情況,但是由于瀏覽器的限制,不同域名之間的數(shù)據(jù)是不能互相訪問的,那前端怎么和后端如何進行數(shù)據(jù)之間的交換呢?
JavaScript由于安全性方面的考慮,不允許頁面跨域調(diào)用其他頁面的對象,那么問題來了,什么是跨域問題?
答:這是由于瀏覽器同源策略的限制,現(xiàn)在所有支持JavaScript的瀏覽器都使用了這個策略。那么什么是同源呢?所謂的同源是指三個方面“相同”:
- 域名相同
- 協(xié)議相同
- 端口相同
下面就舉幾個例子來幫助更好的理解同源策略。
URL | 說明 | 是否允許通信 |
---|---|---|
http://www.a.com/a.js http://www.a.com/b.js |
同一域名 | 允許 |
http://www.a.com/a.js http://www.b.com/a.js |
不同域名 | 不允許 |
http://www.a.com:8000/a.js http://www.a.com/b.js |
同一域名不同端口 | 不允許 |
https://www.a.com/a.js http://www.a.com/b.js |
同一域名不同協(xié)議 | 不允許 |
在JAVA中處理跨域問題,通常有以下兩種常用的解決方法。
第一種解決方法
后臺代碼在被請求的Servlet中添加Header設置:
response.setHeader("Access-Control-Allow-Origin", "*"); PrintWriter out =null; try { out = response.getWriter(); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } out.print("{'status':'ok'}"); out.flush(); out.close();
Access-Control-Allow-Origin這個Header在W3C標準里用來檢查該跨域請求是否可以被通過,如果值為*則表明當前頁面可以跨域訪問。默認的情況下是不允許的。
在前端JS中需要向Servlet發(fā)出請求,請求代碼如下所示:
$.ajax({ url: "your url", type:"get or post", dataType:"json", data:{ .... }, success:function(data){ ... }
第二種解決方法
通過jsonp跨域請求的方式。JSONP和JSON雖然只有一個字母的區(qū)別,但是他們完全就是兩回事,很多人很容易把他們搞混。JSON是一種數(shù)據(jù)交換的格式,而JSONP則是一種非官方跨域數(shù)據(jù)交互協(xié)議。
首先來說一下前端JS是怎么發(fā)送請求。代碼如下所示:
$.ajax({ url:"your url", type:"get or post", async:false, dataType : "jsonp", //服務端用于接收callback調(diào)用的function名的參數(shù) jsonp:"callbackparam", //callback的function名稱 jsonpCallback:"success_jsonpCallback", success:function(data){ console.log(data); }, error:function(data){ console.log(data); } });
這里的callbackparam和success_jsonpCallback可以理解為發(fā)送的data數(shù)據(jù)的鍵值對,可以自定義,但是callbackparam需要和后臺約定好參數(shù)名稱,因為后臺需要獲取到這個參數(shù)里面的值(即success_jsonpCallback)。
下面,最重要的來了,后臺怎么樣獲取和返回數(shù)據(jù)呢。代碼如下所示:
PrintWriter out =null; String callback=req.getParameter("callbackparam"); String json=callback+"({'status':'ok'})"; try { out = resp.getWriter(); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } out.print(json); out.flush(); out.close();
首先需要獲取參數(shù)名為callbackparam的值,這里獲取到的值就是“success_jsonpCallback”。然后將這個值加上一對小括號。小括號里放入你需要返回的數(shù)據(jù)內(nèi)容,比如這里我返回一個JSON對象。當然你也可以返回其他對象,比如只返回一個字符串類型數(shù)據(jù)也可以。最后前端JS返回的數(shù)據(jù)就是這樣的:
success_jsonpCallback({'status':'ok'})
瀏覽器會自動解析為json對象,這時候你只需要在success回調(diào)函數(shù)中直接用data.status就可以了。
總結(jié)
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學習或者工作能帶來一定的幫助,如果有疑問大家可以留言交流,謝謝大家對腳本之家的支持。
相關文章
SpringBoot文件上傳同時接收復雜參數(shù)的過程詳解
這篇文章主要介紹了SpringBoot文件上傳同時,接收復雜參數(shù),本文通過示例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2022-12-12JavaWeb應用實例:用servlet實現(xiàn)oracle 基本增刪改查
本篇文章主要介紹了JavaWeb應用實例:用servlet實現(xiàn)oracle 基本增刪改查,非常具有實用價值,需要的朋友可以參考下。2017-01-01maven安裝、使用、配置本地倉庫、idea配置maven以及解決plugins報錯問題
本地倉庫是遠程倉庫的一個緩沖和子集,當你構(gòu)建Maven項目時首先會從本地倉庫查找資源,如果沒有那么Maven會從遠程倉庫下載到你本地倉庫,這篇文章主要給大家介紹了關于maven安裝、使用、配置本地倉庫、idea配置maven以及解決plugins報錯問題的相關資料,需要的朋友可以參考下2024-01-01java使用RandomAccessFile類基于指針讀寫文件實例代碼
這篇文章主要介紹了java使用RandomAccessFile類基于指針讀寫文件實例代碼,具有一定參考價值,需要的朋友可以了解下。2017-10-10