Introduction à WebAssembly en Go

Introduction à WebAssembly en Go
Des lecteurs comme vous aident à soutenir MUO. Lorsque vous effectuez un achat en utilisant des liens sur notre site, nous pouvons gagner une commission d'affiliation. Lire la suite.

WebAssembly est l'une des technologies modernes conçues pour exécuter plus de langues sur le navigateur avec l'interopérabilité Javascript.





WebAssembly (WASM) est un format d'instruction binaire indépendant de la plate-forme pour les machines virtuelles basées sur la pile, conçu comme une cible de compilation portable pour les langages de programmation à exécuter sur des environnements habilitants (c'est-à-dire les applications Web et serveur).





Avec WASM, vous pouvez exécuter plusieurs langages de programmation, y compris Go, sur votre navigateur et exploiter les fonctionnalités du langage. Interagissez également avec Javascript sur le Web.





Premiers pas avec WebAssembly dans Go

Go fournit un support de première classe pour l'utilisation de WebAssembly dans vos applications Go, il vous suffit de faire quelques configurations et de compiler le code Go dans WebAssembly.

Vous devrez faire quelques configurations pour transpiler votre code Go dans WebAssembly. Vous devrez changer votre architecture Go GOARCH variable d'environnement à était M and Go système d'exploitation GOOS variable à js .



Exécutez cette commande dans le terminal de votre répertoire de travail pour effectuer ces configurations.

 Set GOARCH=wasm GOOS=js  

La prochaine étape consiste à transpiler votre code Go dans un WebAssembly .était M dossier. Exécutez cette commande pour transpiler votre main.go fichier vers un fichier nommé lib.wasm





 go build -o lib.wasm main.go 

En exécutant la commande, vous trouverez un lib.wasm dans votre répertoire de travail.

comment effacer un disque dur windows 10

Vous devez copier le fichier WebAssembly accompagnant votre installation Go dans votre répertoire de travail pour exécuter le fichier WebAssembly avec NodeJS sur une page Web.





 cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" . 

La commande copie le wasm_exec.js fichier dans votre répertoire de travail et sert de point d'entrée à votre application.

Vous pouvez maintenant utiliser le wasm_exec.js script pour exécuter vos fichiers WASM avec Go et make API DOM appels.

 node wasm_exec.js main.wasm 

Démarrage d'un serveur Web pour héberger le site Web

Ajoutez ce code des auteurs Go à un fichier HTML dans votre répertoire de travail pour instancier un flux de données WebAssembly avec le instantiateStreaming méthode.

 <!DOCTYPE html> 
<!--
Copyright 2018 The Go Authors. All rights reserved.
Use of this source code is governed by a BSD-style
license that can be found in the LICENSE file.
-->

<html>
<head>
    <meta charset="utf-8" />
    <title>Go wasm</title>
</head>

<body>
<script src="wasm_exec.js"></script>

<script>
    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("lib.wasm"), go.importObject).then(
        result => {
            mod = result.module;
            inst = result.instance;
            document.getElementById("runButton").disabled = false;
        }
    );

    async function run() {
        await go.run(inst);
        inst = await WebAssembly.instantiate(mod, go.importObject); // reset instance
    }
</script>

<button onClick="run();" id="runButton" disabled>Run</button>
</body>
</html>

Le code HTML provient des auteurs Go, pour instancier un flux WebAssembly qui connecte votre code Go à la page Web.

Démarrage d'un serveur Web pour exécuter la page

Vous allez configurer le serveur avec le http forfait . Importez le http paquet et le Journal package pour consigner les éventuelles erreurs dans la console.

 import ( 
    "log"
    "net/http"
)

Vous pouvez déclarer des variables pour l'adresse du serveur et le répertoire des fichiers que vous souhaitez servir sur l'adresse.

l'ordinateur de mise à jour de Windows 10 ne démarre pas
 var ( 
    serverAddr = ":8080"
    directory = "."
)

Vous pouvez utiliser le Serveur de fichiers méthode de la http package pour servir les fichiers dans un répertoire spécifié. Le Serveur de fichiers prend dans le répertoire et renvoie une instance de serveur de fichiers.

 func main() { 
    serveFiles := http.FileServer(http.Dir(directory))
    if err := http.ListenAndServe(serverAddr, serveFiles); err != nil {
        log.Fatalln(err)
}
}

Dans le principale fonction, vous avez déclaré une variable d'instance de serveur de fichiers pour servir les fichiers dans le répertoire racine. Le ÉcouterEtServir La méthode sert les fichiers dans le répertoire spécifié sur le port spécifié.

  résultat du chargement de WASM sur le navigateur

Fonctions WebAssembly dans Go

Go fournit des fonctionnalités pour appeler des fonctions JS et interagir avec le DOM dans le appel système/js forfait.

Le js fournit un accès aux environnements hôtes WebAssembly sur le js/wasm architecture. Votre environnement de développement doit être configuré pour GOARCH=wasm GOOS=js pour accéder et utiliser le package.

  aperçu de la documentation du package js

Vous pouvez utiliser les différentes méthodes du package pour interagir avec votre page Web. Voici comment vous pouvez enregistrer des fonctions avec le js forfait.

 // function definition 
func print(this js.Value, i []js.Value) interface{} {
    return js.ValueOf(i[:])
}

Le imprimer fonction lors de l'enregistrement en tant que fonction de rappel affichera les données transmises à la fonction dans la console du navigateur.

Vous pouvez enregistrer des fonctions de rappel avec le Ensemble méthode de la Global méthode de la js forfait. Le Ensemble La méthode prend l'identifiant de la fonction et une instance de fonction de rappel.

 func RegisterCallbackFunctions() { 
    js.Global().Set("print", js.FuncOf(print))
}

Le RegisterCallbackFunctions méthode enregistre la imprimer fonctionnent comme une fonction de rappel que vous pouvez utiliser dans la console du navigateur.

WebAssembly est une fonctionnalité expérimentale dans de nombreux langages, y compris Go

Les fonctionnalités de WebAssembly sont relativement nouvelles dans de nombreux langages, en particulier depuis que le langage est récemment devenu un standard du W3C. Le js package est expérimental et le package est exempté de la promesse de compatibilité Go.