title: how to download a file with php and angular
body: <p>I already uploaded a file and saved the path into my database, but the problem now is that I can't download it. I have already tested the PHP code and it works, but when I try to download it from the Angular side it doesn't. Instead I get this error in the console:</p>
  <pre class="lang-none prettyprint-override"><code>httpErrorResponse error: SyntaxError: Unexpected token p in JSON at position 0
    at JSON.parse (&lt;anonymous&gt;)
    at XMLHttpRequest.onLoad (localhost:4200/vendor.js:164415:51)
    at ZoneDelegate.invokeTask (localhost:4200/polyfills.js:9799:31)
    .........
  </code></pre>
  <p>ANGULAR SERVICE:</p>
  <pre class="lang-js prettyprint-override"><code>public getjointes(filepath:string){
    const params = new HttpParams()
      .set('filepath', filepath);
    return this.http.get(url+'/download.php', {params: params });
  }
  </code></pre>
  <p>TYPESCRIPT / function</p>
  <pre class="lang-js prettyprint-override"><code>telecharger(path:string) {
      console.log(path);
      this.stream.getjointes(path).subscribe(response =&gt; {
          console.log(response);
      });
  }
  </code></pre>
  <p>PHP CODE:</p>
  <pre class="lang-php prettyprint-override"><code>$rest = $_GET['filepath'] ;
  
  echo($rest);
  $filepath = 'upload/' . $rest;
  
  if (file_exists($filepath)) {
      header('Content-Description: File Transfer');
      header('Content-Type: application/octet-stream');
      header('Content-Disposition: attachment; filename=' . basename($filepath));
      header('Expires: 0');
      header('Cache-Control: must-revalidate');
      header('Pragma: public');
      header('Content-Length: ' . filesize('upload/' . $rest));
      readfile('upload/' . $rest);
      header(&quot;Access-Control-Expose-Headers: Content-Disposition&quot;);   
  }
  else{
      echo ('noo');
  }
  </code></pre>