Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
iOS6 will keep the network activity spinner around forever, with no fix, if you do a CORS ajax request at any time with preflight the network activity spinner will stay until the tab is closed.
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Forever iOS network activity spinner</title>
<style>
p {
-webkit-transition: 0.5s ease;
-moz-transition: 0.5s ease;
-ms-transition: 0.5s ease;
-o-transition: 0.5s ease;
transition: 0.5s ease;
}
p:target {
background-color: green;
color: #fff;
padding: 5px;
}
</style>
</head>
<body>
<h1>Forever iOS network activity spinner</h1>
<p>Doing a CORS request that triggers a preflight OPTIONS request will cause the network activity spinner in iOS6 to display and then never go away. This cannot be fixed like the other similar issue. It doesn't matter when the request is triggered. See <a href="http://thecssninja.com/javascript/corsspinnerbug">article</a> for more details</p>
<button id="ajax">CORS</button>
<p id="res"></p>
<script>
var xhr = new XMLHttpRequest(),
btn = document.querySelector('#ajax'),
data = document.querySelector("#res");
btn.addEventListener("click", function() {
xhr.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
data.innerHTML = xhr.responseText;
location.hash = "res";
setTimeout(function(){
location.hash = "";
data.innerHTML = "";
},2000)
}
};
xhr.open('GET', 'http://spinnerbug.thejsninja.com', true);
xhr.setRequestHeader("X-Requested-With", "bar");
xhr.send();
}, false);
</script>
</body>
</html>
var connect, corser;
connect = require("connect");
corser = require("corser");
connect.createServer(
corser.create({
origins: ['http://thecssninja.com', 'http://www.thecssninja.com'],
supportsCredentials: true,
requestHeaders: corser.simpleRequestHeaders.concat(["X-Requested-With"])
}),
function (req, res, next) {
// Finish preflight request.
if (req.method === "OPTIONS") {
res.writeHead(204);
res.end();
} else {
res.writeHead(200);
res.end("CORS with preflight request was successful!");
}
}
).listen(1337);
console.log("Server running on port 1337.");
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment