Intro:
I have a website in IIS and it have a folder called "container/files" which needs basic authentication to access, the folder files will have some 8 to 9 files which a user will download through my website. Also I want to store username and password inside the application, so don't want to see that windows dialog for authentication.
What I have Done:
I have written a ajax request which gives me access to the folder and lists all the files using my userID and password, but when I click on a file to download, it asks me for authentication again.
What I want to Achieve:
How do I bypass this file level authentication as user is already authenticated to access this folder, why can't he just download the files.?
My code :
$(function() {
var id = "ss221",
pass = "test12",
url = "container/files/",
$s = $(".shell ul");
// Setup our method to retrieve the file list
var getFiles = function() {
$.ajax({
url: url,
type: 'GET',
headers: {
"Authorization": "Basic " + btoa(id + ":" + pass)
},
success: function(data) {
alert('ok');
var links = $(data).find("a");
// for each item in links...
links.each(function(l) {
// extract the href attr
var href = $(this).attr("href");
$s.append("<li><a target='_blank' href=\"" + href + "\">" +
$(this).text() + "</a></li>");
});
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert("error");
}
});
};
// assign my click handler to #btnGet
$("#btnGet").click(function() {
$(".shell ul").empty();
getFiles();
});
});.shell {
width: 300px;
}
.shell ul li {
list-style: none;
}
.shell a {
color: #232323;
display: block;
width: 100%;
height: 30px;
margin: .5em 0;
padding: 5px 10px;
font-weight: bold;
border: 1px solid #999;
border-radius: 3px;
text-decoration: none;
}<!doctype html>
<html>
<meta charset="utf-8">
<head>
<style type="text/css">
</style>
</head>
<body>
<div>
List All files here...
</div>
<button id="btnGet">
get</button>
<div class="shell">
<!-- This is the place we're going to build our list -->
<ul>
</ul>
</div>
</body>
<!-- Get us some jQuery goodness! -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js"></script>
<script type="text/javascript">
</script>
</html>
Solved this issue by updating above code and calling ajax promise on all files also so that whenever folder gets authenticated and displays all files, clicking on files will authenticate them with same creds and it will open the files too.