170 votes

Lecture du contenu du fichier côté client dans javascript dans divers navigateurs

Je suis d'essayer de fournir un script seule solution pour la lecture du contenu d'un fichier sur un ordinateur client à l'aide d'un navigateur.

J'ai une solution qui fonctionne avec Firefox et Internet Explorer. C'est pas joli, mais je suis le seul à essayer des choses pour le moment:

function getFileContents() {
    var fileForUpload = document.forms[0].fileForUpload;
    var fileName = fileForUpload.value;

    if (fileForUpload.files) {
        var fileContents = fileForUpload.files.item(0).getAsBinary();
        document.forms[0].fileContents.innerHTML = fileContents;
    } else {
        // try the IE method
        var fileContents = ieReadFile(fileName);
        document.forms[0].fileContents.innerHTML = fileContents;
    }
}   	

function ieReadFile(filename) 
{
    try
    {
        var fso  = new ActiveXObject("Scripting.FileSystemObject"); 
        var fh = fso.OpenTextFile(filename, 1); 
        var contents = fh.ReadAll(); 
        fh.Close();
        return contents;
    }
    catch (Exception)
    {
        return "Cannot open file :(";
    }
}

Je peux appeler getFileContents() et qu'il va écrire le contenu dans l' fileContents zone de texte.

Est-il un moyen de le faire dans d'autres navigateurs?

Je suis plus intéressé avec Safari et Chrome pour le moment, mais je suis ouvert aux suggestions pour n'importe quel autre navigateur.

Edit: En réponse à la question, "Pourquoi voulez-vous faire cela?":

Fondamentalement, je veux de hachage le contenu du fichier avec un mot de passe sur le côté client pour que je puisse envoyer cette information comme une vérification.

232voto

Brian Campbell Points 101107

Édité pour ajouter des informations sur le Fichier API

Depuis l'origine, j'avais écrit cette réponse, le Fichier API a été proposée comme un standard et implémenté dans Firefox, Google Chrome, Opera 11, et les nightly builds de Safari 6 (Safari 6 n'a pas encore été dévoilé, mais une fois qu'elle est, elle doit prendre en charge cette API). IE ne prend pas encore en charge, de sorte que vous aurez à utiliser votre application pour IE. L'API est un peu plus compliqué que les plus âgés Mozilla API, comme il est conçu pour soutenir asynchrone de la lecture de fichiers, un meilleur support pour les fichiers binaires et le décodage des différents encodages de texte. Il y a peu de documentation disponible sur le Mozilla Developer Network ainsi que divers exemples en ligne. Vous pouvez l'utiliser comme suit:

var file = document.getElementById("fileForUpload").files[0];
if (file) {
    var reader = new FileReader();
    reader.readAsText(file, "UTF-8");
    reader.onload = function (evt) {
        document.getElementById("fileContents").innerHTML = evt.target.result;
    }
    reader.onerror = function (evt) {
        document.getElementById("fileContents").innerHTML = "error reading file";
    }
}

Réponse originale à cette question

Il ne semble pas être un moyen de le faire dans WebKit (donc, Safari et Chrome). Les seules touches qui un Fichier objet a sont fileName et fileSize. Selon le message de commit pour le Fichier et les Fichiers de support, ceux-ci sont inspirés par Mozilla de Fichier de l'objet, mais ils apparaissent à l'appui de seulement un sous-ensemble des fonctionnalités.

Si vous voulez le changer, vous pouvez toujours envoyer un patch pour le projet WebKit. Une autre possibilité serait de proposer les Mozilla API pour intégration en HTML 5; le WHATWG liste de diffusion est probablement le meilleur endroit pour le faire. Si vous le faites, alors il est plus que probable qu'il y aura une manière de croix-navigateur pour ce faire, au moins dans une couple d'années. Bien sûr, soumission ou d'un patch ou d'une proposition d'inscription en HTML 5 ne dire que des travaux de défense de l'idée, mais le fait que Firefox implémente déjà il vous donne quelque chose pour commencer.

4voto

Mnyikka Points 306

Bon codage!
Si vous obtenez une erreur sur Internet Explorer, modifiez les paramètres de sécurité pour autoriser ActiveX

-1voto

<pre><code></code><p>} </p><pre><code></code></pre></pre>

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X