浏览器跨域测试

  • Post author:
  • Post category:其他


一:前端浏览器禁用安全设置

chrome的话可以通过在命令行,输入chrome.exe –allow-file-access-from-files –user-data-dir=”C:/Chrome dev session” –disable-web-security

二:http服务器设置:

nginx的设置:

location /api {

add_header Access-Control-Allow-Origin $http_origin;

# add_header Access-Control-Allow-Origin *;

add_header Access-Control-Allow-Credentials true;

add_header Access-Control-Allow-Methods *;

add_header Access-Control-Allow-Headers $http_access_control_request_headers;

add_header Access-Control-Max-Age 3600;

proxy_set_header Host $host;

proxy_set_header X-Real-IP $remote_addr;

proxy_set_header REMOTE-HOST $remote_addr;

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

proxy_pass http://masConsole;

if ($request_method = OPTIONS){

return 200;

}

}

例子:编写html跨域的ajax页面:

<html>

<head>

<title>tab标签页</title>

<style>

* {

padding: 0;

margin: 0;

}

ul {

list-style-type: none;

}

body {

margin: 50px;

}

#ul {

height: 30px;

margin-bottom: 10px;

}

#ul li {

height: 30px;

line-height: 30px;

padding: 0 15px;

border: 1px solid #abcdef;

float: left;

margin-right: 3px;

cursor: pointer;

}

#ul li.current {

background: #abcdef;

}

#content div {

width: 300px;

height: 200px;

border: 1px solid #abcdef;

display: none;

}

#content div.show {

display: block;

}

</style>

<script src=”http://libs.baidu.com/jquery/2.0.0/jquery.js”></script>

<script>

$(function () {

$(“#ul li”).click(function () {

/*//1.点击li的时候切换样式

$(this).addClass(“current”).siblings().removeClass(“current”);

//2.根据li的索引值,来确定哪个div显示,其他div隐藏

$(“#content>div”).eq($(this).index()).show().siblings().hide();*/

//$(this).addClass(“current”).siblings().removeClass(“current”).parent().next().children().eq($(this).index()).show().siblings().hide();

$(this).addClass(“current”).siblings().removeClass(“current”).parent().next().find(“div”).eq($(this).index()).show().siblings().hide();



$.ajax({



url: ‘https://mp.sda.cn:9999/api/customer/uaa/nologin/login?Session_businessId=1’,



type: ‘post’,



data:{“nameLogin”:”000044″,”passwordLogin”:”000000″},



dataType: ‘json’,



success: function(data){



alert(JSON.stringify(data));



console.log(JSON.stringify(data));



},



error: function(err){



alert(JSON.stringify(err));



console.log(JSON.stringify(err));



}



});



});

});

</script>

</head>

<body>

<ul id=”ul”>

<li class=”current”>php</li>

<li>ruby</li>

<li>python</li>

</ul>

<div id=”content”>

<div class=”show”>php…介绍</div>

<div>ruby…介绍</div>

<div>python…介绍</div>



chrome的话可以通过在命令行,输入chrome.exe –allow-file-access-from-files –user-data-dir=”C:/Chrome dev session” –disable-web-security

</div>

</body>

</html>

转载于:https://blog.51cto.com/17099933344/2112239


关闭菜单