Does anyone know how I can pick select crypto from...

# webassembly

[Luca]

Does anyone know how I can pick select crypto from either window.crypto on browser or node crypto for node on the wasmJs target?

This works on for the js target. But in the wasmJs target I can only get it to work correctly for one at a time.

import org.khronos.webgl.Uint8Array
import org.khronos.webgl.get
import org.khronos.webgl.ArrayBufferView

external interface WebCrypto {
    fun <T : ArrayBufferView> getRandomValues(array: T): T
}

// For node
@JsModule("crypto")
external val webcrypto: WebCrypto

// For browser
external object window {
    val crypto: WebCrypto
}

actual class SecureRandom {
    var crypto: WebCrypto? = null

    init {
        crypto =
            try {
                // browser
                window.crypto
            } catch (_: Throwable) {
                null
            }
        if (crypto == null) {
            try {
                // node
                crypto = webcrypto
            } catch (_: Throwable) {
            }
        }
        requireNotNull(crypto) { "Could not get crypto from window or node" }
    }

    actual fun nextBytes(bytes: ByteArray) {
        val uint8bytes = Uint8Array(bytes.size)
        crypto!!.getRandomValues(uint8bytes)
        for (i in bytes.indices) {
            bytes[i] = uint8bytes[i]
        }
    }
}

To get it to work for node I need to comment out:

crypto =
            try {
                // browser
                window.crypto
            } catch (_: Throwable) {
                null
            }

and respectively to get it to work for browser I need to comment out:

if (crypto == null) {
            try {
                // node
                crypto = webcrypto
            } catch (_: Throwable) {
            }
        }

[Luca]

Running node tests without commenting out the window.crypto part will throw:

ReferenceError: window is not defined
      at jslibs.window_$external_object_getInstance

[Luca]

Also, is this possible on the wasmJs target? unsafeCast doesn’t seem to let you do this unlike the unsafeCast on the js target

fun Uint8Array.asByteArray(): ByteArray = this.unsafeCast<ByteArray>()
fun ByteArray.asUint8Array(): Uint8Array = this.unsafeCast<Uint8Array>()

[Oleg Yukhnevich]

for getting crypto in a safe way for both browser and node you can take a look here: https://github.com/whyoleg/cryptography-kotlin/blob/d524143a0719e6926b0ae190977a73[…]raphy-random/src/wasmJsMain/kotlin/CryptographyRandom.wasmJs.kt
regarding conversion between JS arrays and Kotlin arrays in WASM - now you need to do a copy (like here: https://github.com/whyoleg/cryptography-kotlin/blob/d524143a0719e6926b0ae190977a73[…]raphy-random/src/wasmJsMain/kotlin/CryptographyRandom.wasmJs.kt)

[Luca]

Thanks for the reference! @Oleg Yukhnevich

however I just tried that and I’m running into an issue I was having earlier when I tried something similar:

Calls to js(code) should be a single expression inside a top-level function body or a property initializer in Kotlin/Wasm

[Luca]

I’ve been getting that error pretty much every time I try to do anything with js("…") on the wasm target

[Oleg Yukhnevich]

on wasm js("...") has a lot of restrictions (https://kotlinlang.org/docs/wasm-js-interop.html#kotlin-functions-with-javascript-code)
But at least this variant, that I've posted above works with Kotlin 1.9.20
By this variant I mean not only code inside js("...") but also where it's placed:

// js(...) should be single declaration in a function, should not be an expression, just a statement
fun getCrypto(): Crypto {
    js(
        code = """
    
        var isNodeJs = typeof process !== 'undefined' && process.versions != null && process.versions.node != null
        if (isNodeJs) {
            return (eval('require')('node:crypto').webcrypto);
        } else {
            return (window ? (window.crypto ? window.crypto : window.msCrypto) : self.crypto);
        }
    
               """
    )
}

[Luca]

Ohh I see now. I glossed over that error explaination saying it needs to be a top level function. I moved fun getCrypto(): Crypto out of my class and you’re right it does work!

[Luca]

Thanks alot! @Oleg Yukhnevich

[Oleg Yukhnevich]

glad it's helped 🙂

[Luca]

I was actually briefly looking at your cryptography-kotlin lib today see if wasm was supported, but didn’t go through all your branches. is there a release with wasm targets out already?

[Oleg Yukhnevich]

Not yet.
next release is planned in coming weeks (it will support Random for WasmJs and WasmWasi + WebCrypto provider for WasmJs)

[Luca]

@Oleg Yukhnevich Sweet. Looking forward to trying it out! I’m in the process of updating a blockchain client I wrote with wasm support, and I’m thinking I should switch to using your lib for signing with ecdsa… vs the hacked port of https://github.com/indutny/elliptic I threw together here haha

[Oleg Yukhnevich]

You can try it even right now if you want, snapshot build already contains Wasm things (published from dev branch)
to try snapshot: https://github.com/whyoleg/cryptography-kotlin?tab=readme-ov-file#using-in-your-projects (under a drop-down)

[Luca]

Nice I’ll take a look