❤ Download gibt Verschlüsselung und Entschlüsselung zurück

❤Funktionssammlung

Bild-Download

Methode eins

window.open(URL, name, features, replace)
// 新窗口的 URL、窗口名称、窗口特性

window.open(row.certificateImageUrl,"_blank", "width=500,height=400")
//打开一个新窗口并且指定长宽

Parameterbeschreibung:

URL: URL-Adresse zum Laden in einem neuen Fenster. Kann eine absolute URL oder eine relative URL sein.
Name: Der Name des neuen Fensters. Kann eine Zeichenfolge oder der Name eines vorhandenen Fensters sein. Wenn der Name bereits existiert, wird in diesem Fenster ein neues Fenster geöffnet. Wenn der Name leer ist oder nicht angegeben wird, wird er in einem neuen Fenster geöffnet.

"_blank": Öffnen Sie die URL in einem neuen Fenster oder Tab.
„_self“: Öffnen Sie die URL im aktuellen Fenster oder Tab.
„_parent“: Öffnen Sie die URL im übergeordneten Fenster oder Tab.
„_top“: Öffnen Sie die URL im obersten Fenster oder Tab.

features: Eine durch Kommas getrennte Zeichenfolge, die zur Angabe der Eigenschaften des neuen Fensters verwendet wird, z. B. Größe, Position, Symbolleiste usw. Die genauen verfügbaren Funktionen hängen vom Browser ab.
ersetzen: Ein boolescher Wert, der angibt, ob das neue Fenster den Verlauf des aktuellen Browsers ersetzt. Wenn „true“, wird der Verlauf des aktuellen Browsers durch den Verlauf des neuen Fensters ersetzt, nachdem ein neues Fenster geöffnet wird. Wenn falsch oder nicht angegeben, wird der Verlauf des aktuellen Browsers beibehalten, nachdem ein neues Fenster geöffnet wird.

function toHoutai() {
    
    
   window.open('http://trainingadmin.caderm.org', 'new_window');
}

Methode 2

// 下载图片01
const handleDownLoad = (url, name) => {
    
    
    const iframe = document.createElement("iframe");
    iframe.style.display = "none";
    iframe.src = url;
    document.body.appendChild(iframe);
    setTimeout(() => {
    
    
        document.body.removeChild(iframe);
    }, 200);
 
    // 下载图片
    downloadByBlob(url, name);
};

// 下载图片03
const download = (href, name) => {
    
    
    let eleLink = document.createElement("a");
    eleLink.download = name;
    eleLink.href = href;
    eleLink.click();
    eleLink.remove();
};
 
// 下载图片02
const downloadByBlob = (url, name) => {
    
    
    let image = new Image();
    image.setAttribute("crossOrigin", "anonymous");
    image.src = url;
    image.onload = () => {
    
    
        let canvas = document.createElement("canvas");
        canvas.width = image.width;
        canvas.height = image.height;
        let ctx = canvas.getContext("2d");
        ctx.drawImage(image, 0, 0, image.width, image.height);
        canvas.toBlob((blob) => {
    
    
            let url = URL.createObjectURL(blob);
            download(url, name);
            // 用完释放URL对象
            URL.revokeObjectURL(url);
        });
    };
};

Die Webseite kehrt zurück

const toBack = (e) => {
    
    
    window.history.back(-1);
};

verschlüsseln und entschlüsseln

① Plug-in-Verschlüsselung

MD5-Verschlüsselung (irreversibel)
Die MD5-Verschlüsselung ist irreversibel, was einer Plug-in-Verschlüsselung entspricht. Natürlich können Sie seine Methode auch kopieren und selbst implementieren.

MD5.js ist ein Tool, das Benutzerinformationen, Passwörter und andere private Informationen durch Front-End-JS-Verschlüsselung verschlüsselt und häufig im Front-End verwendet wird.

6 Methoden der MD5-Verschlüsselung

1, hex_md5(value)
2, b64_md5(value)
3, any_md5(s, e)
4, hex_hmac_md5(key, data)
5, b64_hmac_md5(key, data)
6, any_hmac_md5(key, data, e)
————————————————

 var str64 = b64_md5(urlInput.value);
     outPut.value = str64;
     console.log('hex_md5加密', hex_md5(urlInput.value));
     console.log('b64_md5加密', b64_md5(urlInput.value));
     console.log('any_md5加密', any_md5('1', urlInput.value));
     console.log('hex_hmac_md5加密', hex_hmac_md5('1', urlInput.value));
————————————————
 

SHA1-Verschlüsselung (irreversibel)

② JS-API-Verschlüsselung

var btnEncrypt = document.getElementById('btnEncrypt');
var urlInput = document.getElementById('urlInput');
var outPut = document.getElementById('encryptContent');
var btnDecryption = document.getElementById('btnDecryption');
var decryptionContent = document.getElementById('decryptionContent');

// base 64 加密
btnEncrypt.addEventListener('click', function() {
     var str64 = window.btoa(urlInput.value);
    outPut.value = str64;
})
btnDecryption.addEventListener('click', function() {
     var str = window.atob(outPut.value);
     decryptionContent.value = str;
})
 

Der Fehler „hex_md5 ist nicht definiert“ wird in der Front-End-Konsole angezeigt

Eingabeaufforderung zur Fehlermeldung:

md5.js这一个文件没有问题
[Vue warn]: Error in v-on handler: “ReferenceError: hex_md5 is not defined”
found in    —> at src/views/admin/user.vue        at src/views/admin.vue        at src/app.vue

warn @ webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:620

Lösung

检查index.html，是否有引入md5.js，写法是否正确
写法错误