title: How to get the filename from a file downloaded using Javascript Fetch API?
body: <p>In my Javascript client, I'm using Fetch API to call the server to retrieve a server-generated file.  I'm using the following client-side code:</p>
  <pre><code>var _url = &quot;&quot;;    
  var initParms = {  
     method: &quot;GET&quot;,
     mode: 'cors'
  }
  
  fetch(_url, initParms)
  .then(response =&gt; {
     if(response.ok){
        alert(response.headers.get(&quot;content-disposition&quot;));
        return response.blob();
     }
  
     throw new Error(&quot;Network response was not OK.&quot;);
  })
  .then(blob =&gt; {
     var url = new URL.createObjectURL(blob);
  })     
  </code></pre>
  <p>This actually works just fine.  However, the server generates a <code>filename</code> for the file and includes it in the response as part of the <code>content-disposition</code> header.</p>
  <p>I need to save this file to the user's machine using the <code>filename</code> generated by the server.  In Postman, I can actually see that the <code>content-disposition</code> header of the response is set to: <code>Content-Disposition: attachment;filename=myfilename.txt</code>.</p>
  <p>I made an attempt to read the <code>content-disposition</code> from the response (see the alert in my JS code), but I always get <code>null</code> (even though the same response shows the <code>content-disposition</code> in Postman).</p>
  <p>Am I doing something wrong?  Is there a way to retrieve the <code>filename</code> using the fetch response?  Is there a better way to get the <code>filename</code> from the server along with the file?</p>
  <p>P.S.  This is my server-side code for returning the file:</p>
  <p><strong>Controller Action</strong></p>
  <pre><code>public IHttpActionResult GetFile(){
     return new FileResult(&quot;myfilename.txt&quot;,&quot;Hello World!&quot;);
  }
  </code></pre>
  <p><strong>FileResult Class</strong></p>
  <pre><code>public class FileResult : IHttpActionResult
  {
     private string _fileText = &quot;&quot;;
     private string _fileName = &quot;&quot;;
     private string _contentType = &quot;&quot;;
  
     public FileResult(string name, string text)
     {
         _fileText = text;
         _fileName = name;
         _contentType = &quot;text/plain&quot;;
     }
  
     public Task&lt;HttpResponseMessage&gt; ExecuteActionAsync(CancellationToken token)
     {
          Stream _stream = null;
          if (_contentType == &quot;text/plain&quot;)
          {
              var bytes = Encoding.Unicode.GetBytes(_fileText);
              _stream = new MemoryStream(bytes);
          }
          return Task.Run(() =&gt;
          {
              var response = new HttpResponseMessage(HttpStatusCode.OK)
              {
                  Content = new StreamContent(_stream),
              };
  
              response.Content.Headers.ContentType = 
                  new MediaTypeHeaderValue(_contentType);
              response.Content.Headers.ContentDisposition = 
                  new ContentDispositionHeaderValue(&quot;attachment&quot;)
              {
                  FileName = _fileName
              };
  
              return response;
  
          }, token);
  </code></pre>
  <p><strong>Edit</strong></p>
  <p>My question was specifically about the fetch not the ajax api.  Also, in my code, I showed that I was already reading the header from the response exactly like the accepted answer demonstrated on the suggested answer.  However, as stated in my post, this solution was not working with fetch.</p>