Nginx作為靜態資源web服務_跨站訪問場景配置
Nginx作為靜態資源web服務_跨站訪問場景配置
跨域訪問場景演示
設施準備：兩臺雲伺服器 or 建立兩臺虛擬伺服器（VMWare、VirtureBox等）
（1）騰訊雲伺服器上新增CSRF.html檔案
使用JQuery Ajax請求模擬跨域訪問：
CSRF.html程式碼：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSRF 測試</title>
<meta name="keywords" content="" />
<meta name="discription" content="" />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$.ajax({
type:"GET",
url:"http://120.78.153.144:80/cross_domain.html",
success:
function(result){
$("#div1").html(result);
},
error:
function(result){
alert("跨域失敗failed！");
}
}
);
});
});
</script>
</head>
<body>
<h1>CSRF跨站訪問測試</h1>
<div id="div1"><h2>click the button to validate crossing domain</h2></div>
<button>獲取其他內容</button>
</body>
</html>
（2）阿里雲伺服器上建立cross_domain.html檔案
編輯cross_domain.html檔案：
cross_domain.html程式碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSRF ????</title>
<meta name="keywords" content="" />
<meta name="discription" content="" />
</script>
</head>
<body>
<h1>Cross Domain Invoke Success!!!!!!!!</h1>
</body>
</html>
（3）阿里雲伺服器上增加跨域設定
（5）驗證跨域訪問是否生效
首先訪問http://dragonbrother.1.com/CSRF.html
然後點選“check cross domain button”按鈕，校驗是否支援跨域
（6）如果此時關閉跨域設定，會出現跨域問題
關閉阿里雲伺服器nginx跨域設定都會出現跨域問題
首先訪問http://dragonbrother.1.com/CSRF.html
然後點選“check cross domain button”按鈕，校驗是否支援跨域
