一:故事背景 以前在寫WebApi2的時候,一直是用作前後端分離(WebApi2 +angularjs),可是最近自己在給WebApp寫介面的時候遇到了很多坑,總結一下就是跨域問題。而跨域問題在WebApi2中配置也是有點麻煩,不知道在2中是否有對jsonp跨域問題更好解決方案,如果有,跪求各位博....
一:故事背景 以前在寫WebApi2的時候,一直是用作前後端分離(WebApi2 +angularjs),可是最近自己在給WebApp寫介面的時候遇到了很多坑,總結一下就是跨域問題。而跨域問題在WebApi2中配置也是有點麻煩,不知道在2中是否有對jsonp跨域問題更好解決方案,如果有,跪求各位博友在分享自己的想法。 閑話少說,快速進入正題。二:使用Jsonp跨域 我們現在的客戶端和伺服器端都是寫在同一個站點上面,那麼當我們使用Jsonp進行傳輸數據的時候,格式應為如下:
JSON is a subset of the object literal notation of JavaScript. Since JSON is a subset of JavaScript, it can be used in the language with no muss or fuss.
JSONP(JSON with Padding)是一個非官方的協議,它允許在伺服器端集成Script tags返回至客戶端,通過javascript callback的形式實現跨域訪問(這僅僅是JSONP簡單的實現形式)。
3.2 jsonp為什麼能跨域 由於同源策略的限制,XmlHttpRequest (ajax 調用)只允許調用當前站點的資源(功能變數名稱、協議、埠)的資源,而我們知道,link 和script標簽中的src是可以指向外網資源的,也就是我們通過這個我們是可以訪問 ” 外面資源 “ 的,所以利用這一點,我們可以實現簡單的跨域。 3.3 jsonp 跨域原理說明 當我們客戶端向伺服器發送請求的時候,客戶端會註冊一個回調參數(預設為callback),這個回調參數就是客戶端和伺服器進行認證的安全策略,伺服器端獲取到callback的值後,將返回的數據包裹(假如callback的註冊值為jQuery21409887892813421786_1451718790536 ,那麼返回的值就為:jQuery21409887892813421786_1451718790536({}))起來,然後發送給客戶端,客戶端首先解析script標簽,並執行裡面的值,通過註冊的回掉參數,把返回的值給取出來,最後傳入到客戶端預先定義好的callback函數裡面去(如果使用ajax jsonp 的話,那就是success了)。註意返回的要是可執行的js代碼。如果你使用MVCController寫Api的話很簡單,只需要返回JavaScriptResult就可以了 3.4 額外說明 一旦使用jsonp,那麼它和ajax 就不是同一種協議了,可是你可以在ajax中使用jsonp,可能在這一點上有點誤導,大家一定要明白清楚。四:MVC Jsonp伺服器端的簡單配置