Basic-Auth link download

download from file link with basic-auth

by Soya Natsuki

HTML

<html>
  <head>
    <title>Basic-Auth file download</title>
  </head>
  <body>
    <div id="header">
      <h1>Basic Auth File downloader</h1>
    </div>
    <br>
    <div id="subs-form">
      <label for="file_url">File URL(without "http://") :</label>
      <input type="text" name="file_url" id="file_url" placeholder="URL" value="soya.moe:443/Media/Photo/ev-homepage-wireframe.png"/>
      <label for="id">ID :</label>
      <input type="text" name="id" id="id" placeholder="id_here"/>
      <label for="pw">PW :</label>
      <input type="text" name="pw" id="pw" placeholder="pw_here"/>
      <button id="download">Download</button>
    </div>
  </body>
</html>

CSS

body {
  margin: 0;
  padding: 50px;
}

#header {
  border: 1px solid;
  text-align: center;
}

#header h1 {
  padding-left: 10px;
}

#subs-form {
  border: 1px solid;
  padding: 10px;
}

#subs-form input {
  display: block;
  margin-bottom: .5em;
  width: 70%;
}

JavaScript

let generateLink = () => {
	let fileURL = $('#file_url').val();
  let userID = $('#id').val();
  let userPW = $('#pw').val();
  
  let urlString = "http://" + userID + ":" + userPW + "@" + fileURL;
  
  return urlString;
}

$('#download').click(() => {
	let urlString = generateLink();
	window.open(urlString);
});