<p>I want to download certain videos with a click. To do this, I created a button and attached a function that should trigger the download of the relevant video. But I can only download the link of the video, not the video. I can download the video using an external downloader or just drag the URL into the downloads section of the browser. But the activity cannot be triggered via JavaScript. please help me.</p> <p>I tried multiple ways to resolve this issue:</p> <ol> <li>Use simple blob technology without Axios: </li> </ol> <pre class="brush:js;toolbar:false;">const blob = new Blob([this.src_url], { type: 'video/mp4' }) const link = document.createElement('a') link.href = URL.createObjectURL(blob) link.download = this.src_url.replace( >! // 'https://redis-test.com/videos/', link.click() URL.revokeObjectURL(link.href) </pre> <p>Endpoint: Video URL is downloaded as a 122-byte file</p> <ol start="2"> <li>Then use the file protection package: </li> </ol> <pre class="brush:js;toolbar:false;"> var FileSaver = require('file-saver') console.log(this.src_url) var blob = new Blob([this.src_url], { type: 'video/mp4' }) FileSaver.saveAs(blob, 'hello world.mp4') </pre> <ol start="3"> <li>Then use the form method: </li> </ol> <pre class="brush:html;toolbar:false;"><form method="get" action="file.doc"> <button type="submit">Download!</button> </form> </pre> <p>Endpoint: Video starts playing in the same window</p> <ol start="4"> <li>Use the href download attribute: </li> </ol> <pre class="brush:js;toolbar:false;">function download(url) { const a = document.createElement('a') a.href = url a.download = url.split('/').pop() document.body.appendChild(a) a.click() document.body.removeChild(a) }</pre> <p>Endpoint: Video starts playing in the same window</p> <ol start="5"> <li>Use your method: </li> </ol> <pre class="brush:js;toolbar:false;">const link = document.createElement('a') link.href = url link.click() </pre> <p>Endpoint: Video starts playing in the same window</p> <ol start="6"> <li>Now uses the Axios default: </li> </ol> <pre class="brush:js;toolbar:false;"> axios.defaults.withCredentials = true window.open( 'https://cdn.pixaandom_urlrbay.com/vieo/487508532/Woman - 58142.mp4?rendition=source&expiry=1666842719&hash=7dd6d178d9dbbd8adaf68dafd80c9167e91eca21&download' ) </pre> <p>Endpoint: Video starts playing in new window</p> <ol start="7"> <li>Use AXIOS to append a one-time content type in the header: </li> </ol> <pre class="brush:js;toolbar:false;"> axios .get( String(nuxtConfig.axios.mediaURL) this.src_url.replace( 'https://redisrandom_url.com/videos/', '' ), { headers: { mode: 'no-cors', referrerPolicy: 'no-referrer', 'Content-Disposition': 'attachment; filename=Woman - 58142.mp4', Host: 'redis-nfs', 'User-Agent': 'PostmanRuntime/7.29.2', Accept: '*/*', 'Accept-Language': 'en-US,en;q=0.5', 'Accept-Encoding': 'gzip, deflate, br', Connection: 'keep-alive', Cookies: 'tk_or="https://www.google.com/"; tk_lr="https://www.google.com/"; _gcl_au=1.1.954672920.1660108804; _ga=GA1.2.1392122600.1660108808; _fbp=fb.1.1660108809200 .1970395787', 'Upgrade-Insecure-Requests': '1', 'Sec-Fetch-Dest': 'document', 'Sec-Fetch-Mode': 'navigate', 'Sec-Fetch-Site': 'none', 'Sec-Fetch-User': '?1', Pragma: 'no-cache', 'Cache-Control': 'no-cache', }, } ) .then((response) => { console.log(response) const url = window.URL.createObjectURL(new Blob([response.data])) const link = document.createElement('a') link.href = url link.setAttribute('download', 'title') document.body.appendChild(link) link.click() }) .catch((error) => { console.log('rex') }) </pre> <blockquote> <p>Endpoint: Cross-origin request blocked: The same-origin policy does not allow reading the remote resource at redis-random_url/videos/be319-72e1-2e79-8dc3-bcef1/…. (Cause: CORS header 'Access-Control-Allow-Origin' is missing). Status code: 200</p> </blockquote><p><br /></p>

const blob = new Blob([this.src_url], { type: 'video/mp4' })

let myBytes = //# update variable with data result of reading files bytes
let myBlob = new Blob(  [ Uint8Array.from( myBytes ) ] , {type: "application/octet-stream"} );