Search code examples
phpajaxxmlhttprequest

Problem with files renaming (specials chars) and XHR upload


To make it simple, I upload files to a website with XHR. These files are renamed and "cleaned" (special chars, etc) before saving their names in database and store it in my folder.

When I upload any kind of documents, with any kind of weird chars in it, from a Mac it goes very smoothly and nobody get hurts. When i try the same thing with the exact same files on a PC running on Windows, my file are not renamed. Worst, the special chars are replace by question marks and it's impossible to delete them from my FTP then.

I just tried to do some changes on my regex, but I'm confused because it works from Mac but not from Windows. So I guess it's maybe related on how the OS transmit the file encoding before upload or something like this.

Here is my JS :

$("#assist-form").submit(function() {
    var str      = $(this).serialize(),
        progress = document.getElementById("progress"),
        bar      = document.getElementById("progress-bar"),
        percent  = document.getElementById("percent");

    $.ajax({
        xhr: function() {
            var xhr = new window.XMLHttpRequest();
            progress.style.display="block";

            xhr.upload.addEventListener("progress", function(evt) {
                if (evt.lengthComputable) {
                    var percentComplete = evt.loaded / evt.total;
                    percentComplete = parseInt(percentComplete * 100);

                    var percentVal = percentComplete + "%";
                    bar.style.width=percentVal;
                    //console.log(percentVal);
                    percent.innerHTML = percentVal;
                }
            }, false);

            return xhr;
        },              
        type: "POST",
        url: "'.CONTROLLERS.'assistManage.php",
        data: new FormData( this ),
        processData: false,
        contentType: false,
        dataType: "json",
        success: function(msg) {
            if (msg.result == 0 || msg.result == 1 || msg.result == 2) {
                window.location.href="'.ASSISTS.'&resu="+msg.result+"";
            } else {
                $.bootstrapGrowl(msg.result, {
                    type: "danger",
                    width: "350"
                });
            }
        }
    });
    return false;
});

And the part of my PHP where I handle the files :

if ( isset($_FILES['files']) && $_FILES["files"]["error"][0] == 0 )
{
    $allowed = array('png', 'jpg', 'gif', 'xls', 'xlsx', 'doc', 'docx', 'pdf', 'eml', 'msg', 'rtf');
    $docs = $_FILES['files'];

    foreach ( $docs['tmp_name'] as $key => $tmp_name )
    {
        $file_ext   = pathinfo($docs['name'][$key], PATHINFO_EXTENSION);
        $file_name  = Engine::cleanStr($docs['name'][$key], true);
        $file_size  = $docs['size'][$key];
        $file_name_final = 'assist_'.$id.'-'.$file_name;

        if ( !in_array(strtolower($file_ext), $allowed) )
            $error .= $file_name.' : format de fichier non autorisé<br />';
        elseif ( $file_size > 5000000 ) // 5 Mb
            $error .= $file_name.' : fichier trop lourd<br />';
        else
        {
            if ( move_uploaded_file($tmp_name, '../'.UPLOADS.$file_name_final) )
                $req .= "INSERT INTO ".PREFIX."files VALUES ('0', '$id', '$file_name_final');";
            else
                $error .= $file_name.' : Erreur à l\'upload du fichier';
        }
    }

}

And my function to "clean" the files names :

static function cleanStr ( $txt, $punctuation = false )
{
    $txt = trim($txt);
    $txt = str_replace('œ', 'oe', $txt);
    $txt = str_replace('Œ', 'Oe', $txt);
    $txt = str_replace('æ', 'ae', $txt);
    $txt = str_replace('Æ', 'Ae', $txt);
    $txt = str_replace('²', '2', $txt);
    $txt = str_replace('³', '3', $txt);
    $txt = str_replace('°', '', $txt);  
    $txt = iconv("UTF-8", "ISO-8859-1//IGNORE", $txt);  
    if ( $punctuation ) 
    {
        $punct_array = array(',', ':', ';', '?', '!', '(', ')', '[', ']', '#', '&');
        $punct_array2 = array(' ', "'", '---', '--');

        $txt = str_replace($punct_array, '' , $txt);
        $txt = str_replace($punct_array2, '-' , $txt);
    }

    return strtolower($txt);
}

To sum up, a filename like this "Reçu-de-billet-électronique.txt", become "recu-de-billet-electronique.txt" when uploaded from Mac and "re?u-de-billet-?lectronique.txt" when uploaded from Windows.

The exact same file, on the exact same site, with the exact same script but a totally different result. I don't know anymore where to look.


Solution

  • Try replacing

    $txt = iconv("UTF-8", "ISO-8859-1//IGNORE", $txt); 
    

    with this one

    setlocale(LC_CTYPE, 'cs_CZ');
    $txt = iconv('UTF-8', 'ASCII//IGNORE', $txt);
    

    source - https://www.php.net/manual/en/function.iconv.php