An Interest In:
Web News this Week
- February 28, 2024
- February 27, 2024
- February 26, 2024
- February 25, 2024
- February 24, 2024
- February 23, 2024
- February 22, 2024
Build a Chat service using GoLang and WebAssembly (part 2)
ok, now we want to write our first WebAssembly code with golang
this is our source code structure:
our source code => Link
Hello World WebAssembly Program Cross Compiled from Go:
Let's start by writing a simple hello world program in Go, cross compile it to WebAssembly, and run it on the browser.
1) At the first you have to install golang compiler on your device => golang
2) Creating a directory with a new project:
mkdir golangChatWebAssembly cd golangChatWebAssembly
3) Lets create golangChatWebAssembly module:
go mod init golangChatWebAssembly
4) Lets create main.go file
mkdir app && cd apptouch main.go
5) Lets fill our application with content
app/main.go
package mainimport ( "fmt")func main() { fmt.Println("Go Web Assembly")}
6) Now its time to build our app
This command will compile our go application into the main file. wasm (with wasm bytecode) is an executable module of a web assembly.
if you have Linux or MacOS use bottom command:
GOOS=js GOARCH=wasm go build -o ./html/main.wasm .
if you have Windows OS I suggest creating build.bat file and then running it:
touch build.bat
on your build.bat file write this syntax:
SET GOOS=jsSET GOARCH=wasmgo build -o ./html/main.wasm .SET GOOS=windowsSET GOARCH=amd64
and then run it in command line: .\build.bat
7) Javascript Glue
As we already discussed (part 1), WebAssembly is supposed to exist hand in hand with JavaScript. Hence some JavaScript glue code is needed to import the WebAssembly Module we just created and run it in the browser. This code is already available in the Go installation. Let's go ahead and copy it to our html directory.
cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" ./html/
The above command copies the wasm_exec.js that contains the glue code to run WebAssembly into the html directory.
in Windows OS download wasm_exec.js from this link and then copy file into html folder
8) we have to create a HTML page with an application call to the Web Assembly
create index.html in app/html directory:
<html> <head> <meta charset="utf-8"/> <script src="wasm_exec.js"></script> <script> if (!WebAssembly.instantiateStreaming) { WebAssembly.instantiateStreaming = async (resp, importObject) => { const source = await (await resp).arrayBuffer(); return await WebAssembly.instantiate(source, importObject); }; } const go = new Go(); WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then(result => { go.run(result.instance); }); </script> </head></html>
9) we will also need a web server
Lets create a simple web server on Go
cd ..mkdir server && cd servertouch server.go
fill our server.go with this source code:
package mainimport ( "log" "net/http")const ( AddSrv = ":8080" TemplatesDir = "../app/html/")func main() { fileSrv := http.FileServer(http.Dir(TemplatesDir)) err := http.ListenAndServe(AddSrv, fileSrv) if err != nil { log.Fatalln(err) }}
10) After that, we start the server
server/
go run server.go
and open the address in the browser
and in DevTools > console you can see the output:
Go Web Assembly
In part 3 we are going to study about chat service architecture
Original Link: https://dev.to/taherfattahi/build-a-chat-service-using-golang-and-webassembly-part-2-1e4l
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To