title: How to download zip file from PHP Laravel API using Angular in front end?
body: <p>I want to download the zip file from the server using PHP Laravel. The Laravel passes zip files through following return command:</p>
  
  <pre><code>return response()-&gt;download($file);
  </code></pre>
  
  <p>It downloads the zip file when I hit the route URL for the controller in the browser, and it also downloads the zip file when I use <code>window.open(url)</code> in the Angular but it is not secure as anyone can download the file. The user has to authenticate before downloading the file but I cannot pass header with <code>window.open(url)</code>, therefor I need a different approach to achieve this.</p>
  
  <p>I went through most of the questions here, and they suggest to use <strong>FileSaver</strong> and <strong>Blob</strong>. I tried to test with those but didn't work and it's because the API doesn't pass the zip file to the client. </p>
  
  <p>Here is the Angular http.get:</p>
  
  <pre><code>return http.get('localhost:8000/dashboard/backup')
    .subscribe(res =&gt; {
      console.log('Successfull');
    }, err =&gt; {
      console.log(err);
    });
  </code></pre>
  
  <p>I can get the file path, but the path is not public and cannot download it using Angular. The path is returned as Application/XAMP.... and when I set it as HREF and click on it, it loads in browser as localhost:4200/Application/XAMP....</p>
  
  <p>In the console log, I have an invalid character at JSON file line 1. Why is the zip file passed as JSON?</p>