Download length header added, fast download back!

This commit is contained in:
Violet 2023-10-25 17:32:46 +00:00
parent 66ac5c3a29
commit 23f9cc6e3a
3 changed files with 163 additions and 124 deletions

View file

@ -50,7 +50,19 @@ app.get("/getLink", async (req, res) => {
res.write(`<p>Invalid URL! Check the url for any errors! <br> ${url}</p>`) res.write(`<p>Invalid URL! Check the url for any errors! <br> ${url}</p>`)
return return
} }
if (["mp4", "webm"].includes(format)) {
var ytvid = ytdl(url, { 'quality': quality, 'format': format })
var debounce = false
ytvid.on("progress", (chunk, cd, td) => {
if (!debounce) {
res.setHeader('Content-Disposition', `attachment; filename="${filename}.${format}";`);
res.setHeader("Content-Length", td)
ytvid.pipe(res)
// console.log(td)
debounce = true
}
})
} else {
if (redir != "redirect") { if (redir != "redirect") {
res.setHeader("Content-Type", "text/html"); res.setHeader("Content-Type", "text/html");
@ -166,6 +178,7 @@ app.get("/getLink", async (req, res) => {
} }
update() update()
}) })
}
}); });
app.get('/download', (req, res) => { app.get('/download', (req, res) => {
@ -174,7 +187,8 @@ app.get('/download', (req, res) => {
var dest = path.join(__dirname, 'cached/', file) var dest = path.join(__dirname, 'cached/', file)
if (fs.existsSync(dest)) { if (fs.existsSync(dest)) {
res.header('Content-Disposition', `attachment; filename="${filename}"`); res.setHeader('Content-Disposition', `attachment; filename="${filename}"`);
res.setHeader('Content-Length', fs.readFileSync(dest).length)
fs.createReadStream(dest).pipe(res) fs.createReadStream(dest).pipe(res)
} else { } else {
res.header("Content-Type", "text/html") res.header("Content-Type", "text/html")

View file

@ -12,25 +12,33 @@
</head> </head>
<body> <body>
<h1>Youtube Downloader <p>v2.1</p> <h1>Youtube Downloader <p>v2.2</p>
<hr> <hr>
</h1> </h1>
<form action="/getLink" method="get" target="_blank"> <form action="/getLink" method="get" target="_blank">
<div class="setting">
<p style="margin-bottom: 1px;">Video URL:</p> <p style="margin-bottom: 1px;">Video URL:</p>
<input required id="url" placeholder="Enter url" name="url"> <input required id="url" placeholder="Enter url" name="url">
</div>
<div class="setting">
<p>Quality:</p> <p>Quality:</p>
<select required id="quality" name="quality"> <select required id="quality" name="quality">
<option value="highest">Highest</option> <option value="highest">Highest</option>
<option value="lowest">Lowest</option> <option value="lowest">Lowest</option>
</select> </select>
</div>
<div class="setting">
<p>Filename:</p> <p>Filename:</p>
<input required id="filename" placeholder="Enter filename" name="filename"><br> <input required id="filename" placeholder="Enter filename" name="filename">
</div>
<div class="setting">
<p>Format:</p> <p>Format:</p>
<select required id="format" name="format"> <select required id="format" name="format">
<option disabled>Video Options</option> <option disabled>Video Options</option>
<option value="mp4">.mp4</option> <option value="mp4" class="tooltip1">.mp4 (fastest)</option>
<option value="webm">.webm</option> <option value="webm" class="tooltip1">.webm (fastest)</option>
<option value="flv">.flv</option> <option value="flv">.flv</option>
<option value="avi">.avi</option> <option value="avi">.avi</option>
<option value="mpeg">.mpeg</option> <option value="mpeg">.mpeg</option>
@ -40,20 +48,22 @@
<option value="ogg">.ogg</option> <option value="ogg">.ogg</option>
<option value="wav">.wav</option> <option value="wav">.wav</option>
</select> </select>
</div>
<!-- <p class="note">* When using mp4 and webm, progress updates and redirect options are disabled, as it is directly downloaded to the browser.</p> -->
<div class="setting">
<p>Redirect:</p> <p>Redirect:</p>
<select required id="redirect" name="redirect"> <select required id="redirect" name="redirect">
<option value="false">Don't redirect</option> <option value="redirectjs">Redirect (JS, reccomended)</option>
<option value="redirectjs">Redirect (JS) *1</option> <option value="false">Don't auto redirect</option>
<option value="redirect">Redirect (disable progress) *2</option> <option value="redirect">Redirect (disables progress, not reccomended)</option>
</select> </select>
</div>
<br> <br>
<input type="submit" placeholder="test"> <input type="submit">
</form> </form>
<hr> <br>
<p>*1: The "Redirect JS" Option is the same as the "Don't redirect" option, except it sends javascript to the browser letting you redirect. BOTH OPTIONS WORK FINE WITHOUT JAVASCRIPT!</p> <p><a href="https://ko-fi.com/bingus_violet">Please consider donating</a> or host the website yourself! Anything
<p>*2: The "Redirect (disable progress)" option doesn't use any javascript and automatically redirects to the download, but you are not given download progress updates!</p> helps! (Check <a href="https://github.com/Violets-puragtory/NoJS-YTConverter">github</a> for more info)</p>
<hr>
<p><a href="https://ko-fi.com/bingus_violet">Please consider donating</a> or host the website yourself! Anything helps! (Check <a href="https://github.com/Violets-puragtory/NoJS-YTConverter">github</a> for more info)</p><br>
</body> </body>
</html> </html>

View file

@ -24,6 +24,7 @@ input {
p { p {
margin: 5px; margin: 5px;
display: inline-block
} }
body, body,
@ -31,6 +32,10 @@ html {
background-color: var(--background-color); background-color: var(--background-color);
} }
/* body {
padding: 20px;
} */
.grid-container { .grid-container {
width: 100%; width: 100%;
margin: auto; margin: auto;
@ -38,7 +43,7 @@ html {
select, select,
input { input {
display: inline-grid; display: inline-block;
background-color: var(--second-bg-color); background-color: var(--second-bg-color);
color: var(--text-color); color: var(--text-color);
margin: 5px auto; margin: 5px auto;
@ -64,3 +69,13 @@ label {
hr { hr {
opacity: 0.3; opacity: 0.3;
} }
.note {
font-size: 1.1rem;
color: white;
}
.setting {
display: block;
margin: 5px;
}