title: Mobile Safari video upload makes site refresh
body: <p>I created a photo uploading server on a raspberry pi using Angular with Node.Js and multer. This is all hosted on an unsecured ad-hoc network created by the pi itself. The reason I am going for ad-hoc here is because I want to be able to take this on road trips and store photos on it wherever I may be. When I use any mobile browser on my iPhone to upload a video longer than 15 seconds or select a large amount of photos it stalls for a second then refreshes the page which stops the upload. As for error messages I could not see any on Desktop or mobile as the page retunrs with &quot;Something went wrong while displaying webpage&quot; Is there a way to increase multers file size limit?  <a href="https://i.stack.imgur.com/Gz9VI.gif" rel="nofollow noreferrer">Safari iOS refresh</a></p>
  <p>HTML for Upload:</p>
  <pre><code>&lt;div class=&quot;dropzone&quot;&gt;
  &lt;input type=&quot;file&quot; #fileDropRef id=&quot;fileDropRef&quot; multiple (change)=&quot;handleDrop($event)&quot;&gt;
  &lt;img src=&quot;../../assets/upload.png&quot;&gt;
  &lt;p&gt;Drag and drop here&lt;/p&gt;
  &lt;p&gt;or&lt;/p&gt;
  &lt;p&gt;browes for file&lt;/p&gt;
  &lt;/div&gt;
  &lt;div id=&quot;progressBar&quot; #progressBar&gt;&lt;/div&gt;
  &lt;div id=&quot;photoAlbum&quot; #photoAlbum&gt;&lt;/div&gt;
  &lt;div id=&quot;gallery&quot; #gallery&gt;&lt;/div&gt;
  </code></pre>
  <p>And to handle the upload</p>
  <pre><code>handleDrop(e) {
    e.preventDefault()
    e.stopPropagation()
    console.log(e)
  
    this.handleFiles(e.target.files)
  }
  
  initializeProgress(numFiles) {
    this.progressBar.nativeElement.value = 0
    this.uploadProgress = []
  
    for(let i = numFiles; i &gt; 0; i--) {
      this.uploadProgress.push(0)
    }
  }
  
  handleFiles(files) {
    files = [...files]
    this.initializeProgress(files.length)
    files.forEach(this.uploadFile)
    files.forEach(this.previewFile)
  }
  
  uploadFile(file, i) {
    var formData = new FormData();
  
    formData.append(&quot;photos&quot;, file);
    formData.append(&quot;photos&quot;, localStorage.getItem('email'));
    
    var content = '&lt;a id=&quot;a&quot;&gt;&lt;b id=&quot;b&quot;&gt;hey!&lt;/b&gt;&lt;/a&gt;'; // the body of the new file...
    var blob = new Blob([content], { type: &quot;text/xml&quot;});
  
    var request = new XMLHttpRequest();
    request.onreadystatechange = function() {
    if (request.readyState == XMLHttpRequest.DONE) {
        console.log(request.responseText);
    }
  }
    request.open(&quot;POST&quot;, 'http://localhost:port/api/mov/uploadmedia');
    request.send(formData);
  </code></pre>