luzifer/wasm-openssl
1
0
Fork 0
mirror of https://github.com/Luzifer/wasm-openssl.git synced 2024-11-09 15:20:06 +00:00
Code Issues Releases Wiki Activity

Add some frontend for testing instead of hardcoded console

Browse source 
Signed-off-by: Knut Ahlers <knut@ahlers.me>
This commit is contained in:
Knut Ahlers 2019-08-24 17:12:35 +02:00
parent 6f65564958
commit db992bc201
Signed by: luzifer
GPG key ID: DC2729FDD34BE99E
1 changed files with 133 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

140
example/index.html
View file

@ -1,10 +1,136 @@
<!doctype html> <!doctype html>
<html> <html>
<head> <meta charset="utf-8">
<meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>
<body> <title>Luzifer / wasm-openssl - DEMO</title>
<script src="wasm_exec.js"></script>
<script src="index.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/combine/npm/bootstrap-vue@2.0.0-rc.28/dist/bootstrap-vue.min.css,npm/bootstrap@4.3.1/dist/css/bootstrap.min.css">
</body>
<div id="app">
<b-container>
<b-row class="mt-3">
<b-col class="text-center">
<h1 class="mb-3">Luzifer / wasm-openssl - DEMO</h1>
<b-alert
:show="!loaded"
variant="primary"
>
Loading WASM... (If this message persists check console for errors!)
</b-alert>
<b-alert
:show="error !== ''"
variant="danger"
>
{{ error }}
</b-alert>
<b-form-input
v-model="passphrase"
class="mb-2"
placeholder="Put a passphrase here..."
></b-form-input>
<b-form-textarea
class="mb-2"
rows="3"
max-rows="10"
placeholder="Enter plaintext here..."
v-model="plaintext"
></b-form-textarea>
<b-button variant="primary" @click="encrypt" :disabled="!passphrase || !plaintext">Encrypt plaintext...</b-button>
<b-button @click="decrypt" :disabled="!passphrase || !ciphertext">Decrypt ciphertext...</b-button>
<b-form-textarea
class="mt-2"
rows="3"
max-rows="10"
placeholder="Paste ciphertext here..."
v-model="ciphertext"
></b-form-textarea>
</b-col>
</b-row>
</b-container>
</div>
<script src="https://cdn.jsdelivr.net/combine/npm/vue@2.6.10,npm/bootstrap-vue@2.0.0-rc.28/dist/bootstrap-vue.min.js"></script>
<script src="wasm_exec.js"></script>
<script>
function decryptResponse(plaintext, error) {
console.log(["decryptResponse", plaintext, error])
}
function encryptResponse(ciphertext, error) {
console.log(["encryptResponse", ciphertext, error])
if (error === null) {
opensslDecrypt(ciphertext, "password", decryptResponse)
}
}
function opensslLoaded() {
app.$data.loaded = true
}
const app = new Vue({
data: {
ciphertext: '',
error: '',
loaded: false,
passphrase: '',
plaintext: '',
},
el: '#app',
methods: {
decrypt() {
opensslDecrypt(this.ciphertext, this.passphrase, (plaintext, err) => {
if (err) {
this.error = err
return
}
this.plaintext = plaintext
})
},
encrypt() {
opensslEncrypt(this.plaintext, this.passphrase, (ciphertext, err) => {
if (err) {
this.error = err
return
}
this.ciphertext = ciphertext
})
},
initWASM() {
if (!WebAssembly.instantiateStreaming) { // polyfill
WebAssembly.instantiateStreaming = async (resp, importObject) => {
const source = await (await resp).arrayBuffer()
return await WebAssembly.instantiate(source, importObject)
}
}
const go = new Go()
let mod, inst
WebAssembly.instantiateStreaming(fetch("openssl.wasm"), go.importObject)
.then(result => go.run(result.instance))
.catch(err => console.error(err))
},
},
mounted() {
this.initWASM()
},
})
</script>
</html> </html>