magicly/cros.html

## cros.html
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>CORS</title>

    <style>
        button {
            font-size: 5rem;
            margin-bottom: 1rem;
        }
    </style>
</head>
<body>

<div>
    <h1>Hello CORS</h1>
    <button id="getCors">GET CORS</button>
    <button id="getCorsWithCookie">GET CORS With Cookie</button>
    <button id="postCors">POST CORS</button>
    <button id="postCorsJson">POST CORS Json</button>
</div>


<script src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script>
<script>
    var URL = "http://localhost:1337";
    jQuery("#getCors").click(function () {
        $.ajax({
            url: URL,
            method: 'GET',
            success: function (data) {
                console.log(data);
            },
            error: function (err) {
                console.log(err);
            }
        });
    });
    jQuery("#getCorsWithCookie").click(function () {
        $.ajax({
            url: URL,
            method: 'GET',
            xhrFields: {
                withCredentials: true
            },
            success: function (data) {
                console.log(data);
            },
            error: function (err) {
                console.log(err);
            }
        });
    });
    jQuery("#postCors").click(function () {
        $.ajax({
            url: URL,
            method: 'POST',
            xhrFields: {
                withCredentials: true
            },
            data: {name: "name", age: 10},
            success: function (data) {
                console.log(data);
            },
            error: function (err) {
                console.log(err);
            }
        });
//        jQuery.post("http://localhost:1337", {name: "name", age: 10}, function (data) {
//            console.log(data);
//        });
    });
    jQuery("#postCorsJson").click(function () {
        $.ajax({
            url: URL,
            method: 'POST',
            xhrFields: {
                withCredentials: true
            },
            data: {name: "name", age: 10},
            contentType: 'json',
            success: function (data) {
                console.log(data);
            },
            error: function (err) {
                console.log(err);
            }
        });
    });
</script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head lang="en">
	<meta charset="UTF-8">
	<title>CORS</title>

	<style>
	button {
	font-size: 5rem;
	margin-bottom: 1rem;
	}
	</style>
	</head>
	<body>

	<div>
	<h1>Hello CORS</h1>
	<button id="getCors">GET CORS</button>
	<button id="getCorsWithCookie">GET CORS With Cookie</button>
	<button id="postCors">POST CORS</button>
	<button id="postCorsJson">POST CORS Json</button>
	</div>


	<script src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script>
	<script>
	var URL = "http://localhost:1337";
	jQuery("#getCors").click(function () {
	$.ajax({
	url: URL,
	method: 'GET',
	success: function (data) {
	console.log(data);
	},
	error: function (err) {
	console.log(err);
	}
	});
	});
	jQuery("#getCorsWithCookie").click(function () {
	$.ajax({
	url: URL,
	method: 'GET',
	xhrFields: {
	withCredentials: true
	},
	success: function (data) {
	console.log(data);
	},
	error: function (err) {
	console.log(err);
	}
	});
	});
	jQuery("#postCors").click(function () {
	$.ajax({
	url: URL,
	method: 'POST',
	xhrFields: {
	withCredentials: true
	},
	data: {name: "name", age: 10},
	success: function (data) {
	console.log(data);
	},
	error: function (err) {
	console.log(err);
	}
	});
	// jQuery.post("http://localhost:1337", {name: "name", age: 10}, function (data) {
	// console.log(data);
	// });
	});
	jQuery("#postCorsJson").click(function () {
	$.ajax({
	url: URL,
	method: 'POST',
	xhrFields: {
	withCredentials: true
	},
	data: {name: "name", age: 10},
	contentType: 'json',
	success: function (data) {
	console.log(data);
	},
	error: function (err) {
	console.log(err);
	}
	});
	});
	</script>
	</body>
	</html>