使用阿里雲物件儲存oos遇到跨域訪問的問題

使用阿里雲物件儲存oos遇到跨域訪問的問題,因為第一次使用雲儲存,初級碼渣查了好久文件,終於找到了解決方法.

大概就說了這麼多,我的操作是來到oos概覽一欄 ,找到跨域訪問

做了乙個最簡單的配置,這樣相對來說是不安全的,可以按所需設定更多

最近做了乙個小專案練習,也遇到了很多跨域的問題,找了乙份總結.

什麼是跨域？

瀏覽器從乙個網域名稱的網頁去請求另乙個網域名稱的資源時，網域名稱、埠、協議任一不同，都是跨域

網域名稱：

主網域名稱不同 -->

子網域名稱不同 -->

網域名稱和網域名稱ip -->

埠：

協議：

備註：1、埠和協議的不同，只能通過後台來解決

2、localhost和127.0.0.1雖然都指向本機，但也屬於跨域

如何解決跨域問題？

跨域實踐：fiddle 處理前端本地開發跨域問題

1、jsonp跨域

jsonp（json with padding：填充式json)，應用json的一種新方法，

json、jsonp的區別：

1、json返回的是一串資料、jsonp返回的是指令碼**(包含乙個函式呼叫)

2、jsonp 只支援get請求、不支援post請求

(類似往頁面新增乙個script標籤，通過src屬性去觸發對指定位址的請求,故只能是get請求)

2、nginx反向**：

www.baidu.com/index.html需要呼叫www.sina.com/server.php，可以寫乙個介面www.baidu.com/server.php，由這個介面在後端去呼叫www.sina.com/server.php並拿到返回值，然後再返回給index.html

3、php端修改header

header(『access-control-allow-origin:*』);//允許所有**訪問

header(『access-control-allow-method:post,get』);//允許訪問的方式

４、document.domain

跨域分為兩種，一種xhr不能訪問不同源的文件，另一種是不同window之間不能進行互動操作;

document.domain主要是解決第二種情況，且只能適用於主域相同子域不同的情況；

document.domain的設定是有限制的，我們只能把document.domain設定成自身或更高一級的父域，且主域必須相同。例如：a.b.example.com中某個文件的document.domain可以設成a.b.example.com、b.example.com 、example.com中的任意乙個，但是不可以設成c.a.b.example.com，因為這是當前域的子域，也不可以設成baidu.com，因為主域已經不相同了。

相容性：所有瀏覽器都支援；

優點：可以實現不同window之間的相互訪問和操作；

缺點：只適用於父子window之間的通訊，不能用於xhr；

只能在主域相同且子域不同的情況下使用；

使用方式：

不同的框架之間是可以獲取window物件的，但卻無法獲取相應的屬性和方法。比如，有乙個頁面，它的位址是，在這個頁面裡面有乙個iframe，它的src是很顯然，這個頁面與它裡面的iframe框架是不同域的，所以我們是無法通過在頁面中書寫js**來獲取iframe中的東西的

５、window.name

關鍵點：window.name在頁面的生命週期裡共享乙個window.name;

相容性：所有瀏覽器都支援；

優點：最簡單的利用了瀏覽器的特性來做到不同域之間的資料傳遞；

不需要前端和後端的特殊配製；

缺點：大小限制：window.name最大size是2m左右，不同瀏覽器中會有不同約定；

安全性：當前頁面所有window都可以修改，很不安全；

資料型別：傳遞資料只能限於字串，如果是物件或者其他會自動被轉化為字串

６、postmessage

關鍵點：

postmessage是h5引入的乙個新概念，現在也在進一步的推廣和發展中，他進行了一系列的封裝，我們可以通過window.postmessage的方式進行使用，並可以監聽其傳送的訊息；

相容性：移動端可以放心用，但是pc端需要做降級處理

優點不需要後端介入就可以做到跨域，乙個函式外加兩個引數（請求url，傳送資料）就可以搞定；

移動端相容性好；

缺點無法做到一對一的傳遞方式：監聽中需要做很多訊息的識別，由於postmessage發出的訊息對於同乙個頁面的不同功能相當於乙個廣播的過程，該頁面的所有onmessage都會收到，所以需要做訊息的判斷；

安全性問題：三方可以通過截獲，注入html或者指令碼的形式監聽到訊息，從而能夠做到篡改的效果，所以在postmessage和onmessage中一定要做好這方面的限制；

傳送的資料會通過結構化轉殖演算法進行序列化，所以只有滿足該演算法要求的引數才能夠被解析，否則會報錯，如function就不能當作引數進行傳遞；

使用方式：通訊的函式，sendmessage負責傳送訊息，bindevent負責訊息的監聽並處理

使用阿里雲物件儲存oos遇到跨域訪問的問題

快速將阿里雲物件儲存OOS掛載到伺服器

Laravel 使用阿里雲 oss 儲存物件

阿里雲OSS物件儲存

使用阿里雲物件儲存oos遇到跨域訪問的問題

快速將阿里雲物件儲存OOS掛載到伺服器

Laravel 使用阿里雲 oss 儲存物件

阿里雲OSS物件儲存

相關推薦