Video file uploading by XMLHttpRequest failed on specific Android mobile

Question

Our tester failed to upload video file(.mp4) on specific android mobile phone, but he could upload same file on iPhone and another android mobile phone.

Then I tried to test with him by connecting the android mobile phone to PC by USB to debug on chrome developer tools. But I couldn't find any errors so far.

And I tried this changing php.ini like below URL: xmlhttprequest file upload not working on mobile It was not work for me.

Does anyone have some idea to solve this situation?

Thanks in advance.

-- Server -CentOS Linux 7 -nginx 1.20.1

-- Frontend -Javascript

-- Backend -PHP 7.3 -cakephp 3.8

-- Devices / Success -PC（Windows 10 Pro） -Android 6.0.1 -Android 8.0.0 -iOS 16.2

-- Devices / Failed -Android 11 -Android 13

php.ini

memory_limit => 2G
upload_max_filesize => 2G
max_input_vars => 1000 
max_execution_time => 0
; post_max_size = 8M -- before changed
post_max_size = 64M

Javascript

var xhr = new XMLHttpRequest();
var fd = new FormData();
fd.append('upfile', upfile); // upfile is uploading video file *1

xhr.onreadystatechange = function() {
    if( (xhr.status == 200 || xhr.status == 304) && xhr.response) {
        var data = xhr.response;

        console.log( 'COMPLETE! :' );
        console.log( data );
    } else {
        console.log( 'Failed. HttpStatus: '+xhr.status );
    }
};

xhr.open('POST', '/api/video/upload', true);
xhr.responseType = 'json';

xhr.send(fd);

**Javascript Log *1 **

# upfile
lastModified: 1713564962045
lastModifiedDate: Sat Apr 20 2024 07:16:02 GMT+0900 (日本標準時)
[[Prototype]]: Object
name: "VID_2024-04-20-07-15-56-811.mp4"
size: 10950674
type: "video/mp4"
webkitRelativePath: ""

cakePHP3.8

//src\Controller\Api\VideosController.php

public function upload(){

    // this $_FILES has no data on faled request. 
    $this->appInfoLog("api.videos.upload",
        ["request"=>$this->request,
            "_FILES"=>$_FILES,
        ]
    );
    
    // uploading procedure...
 }

cakePHP Log On Success

2024-04-20 05:53:13 Info: {"request":{"trustProxy":true},"_FILES":{"upfile":{"name":"VID_20240419_155656.mp4","type":"video\/mp4","tmp_name":"\/tmp\/phpAu0ege","error":0,"size":7330740}},"action":"api.videos.upload"}

On Failed

2024-04-20 06:31:52 Info: {"request":{"trustProxy":true},"_FILES":[],"action":"api.videos.upload"}

Then I tried to test with him by connecting the android mobile phone to PC by USB to debug on chrome developer tools. But I couldn't find any errors so far.

Answer 1

Finally, I have solved to change php.ini and add 'client_max_body_size' to /etc/nginx/conf.d/*.conf.

It was just PHP and NGINX Post values problem. But it may mean that Android mobile Chrome's post data is increase of origin size.

/etc/opt/remi/php73/php.ini

memory_limit => 2G
upload_max_filesize => 2G
max_input_vars => 2000
max_execution_time => 0
post_max_size = 500MB

/etc/nginx/conf.d/*.conf --- * is service name

server {
  listen  80;
  server_name www.example.com;
  // add
  client_max_body_size 500MB;
}

restart php-fpm and nginx

systemctl restart php73-php-fpm.service
systemctl reload nginx