89 lines
3.2 KiB
HTML
89 lines
3.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<style>
|
|
p {
|
|
font-size: 20px;
|
|
}
|
|
|
|
.button {
|
|
border: none;
|
|
color: white;
|
|
padding: 10px 15px;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
font-size: 14px;
|
|
margin: 5px 5px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.green {
|
|
background-color: #4CAF50;
|
|
}
|
|
|
|
.red {
|
|
background-color: indianred;
|
|
}
|
|
|
|
.gray {
|
|
background-color: gray;
|
|
}
|
|
</style>
|
|
<title>CORS Sample</title>
|
|
</head>
|
|
<body>
|
|
<script type="text/javascript">
|
|
// Make the CORS request.
|
|
function makeCORSRequest(method, headerName, headerValue) {
|
|
// Destination server with CORS enabled.
|
|
var url = 'http://destination.example.com:5000/';
|
|
var request = new XMLHttpRequest();
|
|
request.open(method, url, true);
|
|
if (headerName && headerValue) {
|
|
request.setRequestHeader(headerName, headerValue);
|
|
}
|
|
|
|
if (!request) {
|
|
alert('CORS not supported');
|
|
return;
|
|
}
|
|
|
|
// Response handlers.
|
|
request.onload = function () {
|
|
var text = request.responseText;
|
|
alert('Response from CORS ' + method + ' request to ' + url + ': ' + text);
|
|
};
|
|
|
|
request.onerror = function () {
|
|
alert('There was an error making the request for method ' + method);
|
|
};
|
|
|
|
request.send();
|
|
}
|
|
</script>
|
|
|
|
<p>CORS Sample</p>
|
|
Method: <input type="text" id="methodName" /><br /><br />
|
|
Header Name: <input type="text" id="headerName" /> Header Value: <input type="text" id="headerValue" /><br /><br />
|
|
|
|
<script>
|
|
document.getElementById('headerValue')
|
|
.addEventListener("keyup", function (event) {
|
|
event.preventDefault();
|
|
if (event.keyCode == 13) {
|
|
document.getElementById("CORS").click();
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<button class="button gray" id="CORS" type="submit" onclick="makeCORSRequest(document.getElementById('methodName').value, document.getElementById('headerName').value, document.getElementById('headerValue').value);">Make a CORS Request</button><br /><br /><br /><br />
|
|
|
|
Method DELETE is not allowed:<button class="button red" id="InvalidMethodCORS" type="submit" onclick="makeCORSRequest('DELETE', 'Cache-Control', 'no-cache');">Invalid Method CORS Request</button>
|
|
Method PUT is allowed:<button class="button green" id="ValidMethodCORS" type="submit" onclick="makeCORSRequest('PUT', 'Cache-Control', 'no-cache');">Valid Method CORS Request</button><br /><br />
|
|
|
|
Header 'Max-Forwards' not supported:<button class="button red" id="InvalidHeaderCORS" type="submit" onclick="makeCORSRequest('PUT', 'Max-Forwards', '2');">Invalid Header CORS Request</button>
|
|
Header 'Cache-Control' is supported:<button class="button green" id="ValidHeaderCORS" type="submit" onclick="makeCORSRequest('PUT', 'Cache-Control', 'no-cache');">Valid Header CORS Request</button><br /><br />
|
|
</body>
|
|
</html> |