Maison > interface Web > js tutoriel > Chargement et téléchargement de plusieurs fichiers sous forme de chaînes hexadécimales en JS (exemple de code)

Chargement et téléchargement de plusieurs fichiers sous forme de chaînes hexadécimales en JS (exemple de code)

不言
Libérer: 2019-01-26 09:39:32
avant
2667 Les gens l'ont consulté

Le contenu de cet article concerne le téléchargement et le téléchargement de plusieurs fichiers sous forme de chaînes hexadécimales en JS (exemples de code). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Je maintiens actuellement un ancien projet Web, qui utilise DWR 2.0 (un framework de communication à distance qui peut appeler des méthodes Java en js). Nous devons maintenant utiliser ce framework pour télécharger des fichiers vers et depuis le serveur. Cependant, le DWR 2.0 utilisé dans ce projet ne prend en charge que l'appel de types de données de base et de types courants tels que String, List et Map comme paramètres et valeurs de retour. ​par défaut, les méthodes Java ne peuvent pas utiliser les objets FileTransfer, InputStream, MultipartFile.

Étant donné que les chaînes peuvent être transmises, utilisez la méthode de conversion de fichiers et de chaînes pour interagir d'avant en arrière. Le processus est le suivant :
Lors du téléchargement d'un fichier, fichier-> ArrayBuffer -> 16 chaînes hexadécimales -> byte[] -> -> octet[] ->
Chaîne hexadécimale -> Uint8Array -> Fichier

2. >Code HTML :

Code JS :

<input type="file" multiple="multiple" onchange="readFilesAndUpload(event)" />
Copier après la connexion
Code Java :

// 将 ArrayBuffer 转为 16 进制字符串
function bufToHex(buffer) {
    return Array.prototype.map.call(new Uint8Array(buffer), function (x) {
        return ('00' + x.toString(16)).slice(-2)
    }).join('')
}
function readFilesAndUpload(event) {
    var processed = 0
    var files = event.target.files
    var len = files.length
    var filenameArr = new Array(len)    // 文件名
    var fileContextArr = new Array(len)    // 文件内容
    for (var i = 0; i < len; ++i) {
        var reader = new FileReader()
        reader.index = i
        reader.filename = files[i].name
        reader.readAsArrayBuffer(files[i])    // 将文件读到 ArrayBuffer
        reader.onload = function (e) {
            filenameArr[this.index] = this.filename
            fileContextArr[this.index] = bufToHex(this.result)

            // FileReader 以异步的方式读取文件,需要借助外部变量判断是否读完全部文件
            if (++processed === len) {
                // 将 filenameArr 和 fileContext 上传到服务端
            }
        }
    }
}
Copier après la connexion

3. Télécharger le fichier

private static final String UPLOAD_DIR = "D://Files/";

public void uploadFiles(List<String> filenameArr, List<String> fileContextArr) throws IOException {
    byte[] bytes;
    FileOutputStream fos;
    for (int i = 0; i < filenameArr.size(); ++i) {
        String file = fileContextArr.get(i);
        
        // 将 16 进制字符串转换成 byte[]
        bytes = new byte[file.length() / 2];
        for (int j = 0; j < file.length() / 2; ++j) {
            String subStr = file.substring(j * 2, j * 2 + 2);
            bytes[j] = (byte) Integer.parseInt(subStr, 16);
        }

        // 保存到本地磁盘
        fos = new FileOutputStream(UPLOAD_DIR + filenameArr.get(i), true);
        fos.write(bytes);
        fos.close();
    }
}
Copier après la connexion

Code Java :

Code JS :

public String downloadFile(String filename) throws IOException {
    File file = new File(UPLOAD_DIR + filename);
    if (!file.exists()) {
        return null;
    }
    
    // 将文件读到 byte[]
    byte[] buffer = new byte[(int) file.length()];
    InputStream is = new FileInputStream(file);
    is.read(buffer);
    is.close();

    // 将 byte[] 转换成 16 进制字符串
    StringBuilder stringBuilder = new StringBuilder();
    for (int i = 0; i < buffer.length; i++) {
        int v = buffer[i] & 0xFF;
        String hv = Integer.toHexString(v);
        if (hv.length() < 2) {
            stringBuilder.append(0);
        }
        stringBuilder.append(hv);
    }
    return stringBuilder.toString();
}
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:segmentfault.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal