天天看點

七牛---以一個七牛上傳的執行個體小結下AJAX跨域【轉】

http://blog.csdn.net/netdxy/article/details/50699842

使用七牛過程中,很多使用者或多或少遇到跨域的問題,這篇文章主要介紹下跨域的概念來看什麼情況下會出現跨域以及七牛關于跨域的政策。

關于跨域的,說白點就是去别伺服器上取東西,域當然是别的伺服器,隻要協定、域名、端口有任何一個不同,都被當作是不同的域。這裡以表單上傳結合AJAX請求擷取Token上傳的Demo為切入點具體看下什麼時候會出現跨域。

以下是Demo的代碼示例,需要注意的是請求token的連結有兩個 

一個是服務端設定允許跨域的生成token的連結<code>http://115.231.183.78//ServletDemo/servlet/UploadToken</code> 

另外一個是服務端沒事設定允許跨域的生成token的連結<code>http://115.231.183.78/ServletDemo/servlet/TokenNoCross</code>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

這裡我将上面說的兩種情況分别寫入html然後放到另一台不同的IP的虛拟機裡面,連結分别為:<code>http://115.231.183.51/upnocross.html</code>和<code>http://115.231.183.51/upcancross.html</code> 

然後加載通路的情況是前者會預期出現AJAX請求Token出現跨域的情況而另一個連結請求是正常的,可以參考下面的截圖: 

前者出現跨域的截圖: 

七牛---以一個七牛上傳的執行個體小結下AJAX跨域【轉】

正常請求到Token(可以正常上傳)的截圖: 

七牛---以一個七牛上傳的執行個體小結下AJAX跨域【轉】

以下給出Servlet中生成Token并且設定<code>"Access-Control-Allow-Origin","*"</code>的代碼。

再來看下面的圖檔中關于兩個頁面預設是否允許通信的情況就很好了解了。 

七牛---以一個七牛上傳的執行個體小結下AJAX跨域【轉】

對于七牛JS跨域情況來說,總結如下: 

1.上傳,預設支援,在發起上傳請求的時候,七牛的服務會傳回相應的支援跨域的 Header,可以參考以下成功上傳的截圖中響應頭資訊: 

七牛---以一個七牛上傳的執行個體小結下AJAX跨域【轉】

2.下載下傳,預設不支援,可以通過配置支援。在你自己的空間中上傳 crossdomain.xml 就可以了,其crossdomain.xml裡面的内容如下

3.管理(比如檔案删除複制移動),不支援,管理伺服器不支援js跨域請求(主要是為了資料安全), 如果需要隻能從服務端發送管理操作請求。

需要注意的是七牛點播平台空間域名預設有302跳轉,AJAX請求會出現跨域,需要取消域名的302跳轉才可以。

另外,也可以參考下這篇文章中的表述: 

<a href="https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS">HTTP通路控制(CORS)</a>

如何聯系我:【萬裡虎】www.bravetiger.cn

【QQ】3396726884 (咨詢問題100元起,幫助解決問題500元起)

【部落格】http://www.cnblogs.com/kenshinobiy/

繼續閱讀