WebAssembly 入门教程
文章目录
- 简介
- 入门示例
- 总结
简介
什么是 WebAssembly?在其主页上:https://webassembly.org/ 有如下描述:
WebAssembly(缩写为 Wasm)是一种用于基于堆栈的虚拟机的二进制指令格式。Wasm 被设计为用于编译编程语言的可移植目标,支持在 Web 上部署客户端和服务器应用程序。
目前 Rust 对 WebAssembly 的支持较好。那 Go 什么时候开始支持支持 WebAssembly 的呢?
Go 1.11 向 WebAssembly 添加了一个实验性端口。Go 1.12 对其某些部分进行了改进,Go 1.13 有了进一步改进。
入门示例
首先,请保证安装了 Go1.11 以上版本,建议安装最新版本 Go。
在本地创建一个项目:gowasm(Windows 用户自行修改路径)
$ mkdir ~/gowasm
$ cd ~/gowasm
$ go mod init gowasm
$ touch main.go
要为 Web 编译基本的 Go 包,打开 main.go,填上如下代码:
package mainimport "fmt"func main() {fmt.Println("Hello, WebAssembly!")
}
为 WebAssembly 编译设置GOOS=js和GOARCH=wasm环境变量:
$ GOOS=js GOARCH=wasm go build -o main.wasm
这将构建包并生成一个名为 main.wasm 的可执行 WebAssembly 模块文件。.wasm 文件扩展名使得通过 HTTP 用正确的 Content-Type 标头来更好地提供它。
请注意,你只能编译 main 包。否则,你将获得一个无法在 WebAssembly 中运行的目标文件。如果你有一个包希望能够与 WebAssembly 一起使用,请将其转换为 main 包并构建它得到一个二进制文件。
要在浏览器中执行 main.wasm,我们还需要一个 JavaScript 支持文件和一个 HTML 页面来将所有内容连接在一起。
复制 JavaScript 支持文件:
$ cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" .
创建一个index.html文件:
<html><head><meta charset="utf-8"/><script src="wasm_exec.js"></script><script>const go = new Go();WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => {go.run(result.instance);});</script></head><body></body>
</html>
如果你的浏览器尚不支持WebAssembly.instantiateStreaming,可以使用 polyfill。
然后从 Web 服务器服务这三个文件(index.html、wasm_exec.js和 main.wasm)。例如,使用 goexec。注意,安装 goexec 后,放入 PATH 目录,方便使用:
# 先安装 goexec
$ go install github.com/shurcooL/goexec@latest
# 执行 goexec(如果提示你缺少 github.com/shurcooL/go-goon,请 go get 下载)
$ goexec 'http.ListenAndServe(`:8080`, http.FileServer(http.Dir(`.`)))'
当然也可以使用任何其他的方式提供 HTTP 服务。
打开浏览器访问 http://localhost:8080/index.html,打开 JavaScript 调试控制台(Console Tab),你应该会看到输出:Hello, WebAssembly!
你可以修改程序、重新编译 main.wasm,刷新以查看新输出。(goexec 不需要重启)
总结
Go 的安全更新,如果涉及到你的项目,建议升级,否则可以不升级。WebAssembly 这两年挺火的,但生产使用还是很少。有兴趣可以学习了解。本文希望能够带给你一个初步印象。
WebAssembly 入门教程相关推荐
- html语言教程.chn,Go WebAssembly 入门(一)
有关WebAssembly的介绍可以参考 几张图让你看懂WebAssembly 简单来说WebAssembly就是将其他语言C/Go/Rust等语言编译成wasm可执行二进制文件,浏览器来执行wasm ...
- Rust编程语言入门教程(一)-什么是Rust
文章目录 Rust编程语言入门教程(一) 什么是Rust rust 发展历史 应用环境 为什么选择Rust 新项目用Rust还是Go? Rust编程语言入门教程(一) 什么是Rust wiki百科:h ...
- 《进击吧!Blazor!》系列入门教程 第一章 4.数据交互
<进击吧!Blazor!>是本人与张善友老师合作的Blazor零基础入门教程视频,此教程能让一个从未接触过Blazor的程序员掌握开发Blazor应用的能力. 视频地址:https://s ...
- 《进击吧!Blazor!》系列入门教程 第一章 8.部署
<进击吧!Blazor!>是本人与张善友老师合作的Blazor零基础入门教程视频,此教程能让一个从未接触过Blazor的程序员掌握开发Blazor应用的能力. 视频地址:https://s ...
- 《进击吧!Blazor!》系列入门教程 第一章 3.页面制作
<进击吧!Blazor!>是本人与张善友老师合作的Blazor零基础入门教程视频,此教程能让一个从未接触过Blazor的程序员掌握开发Blazor应用的能力. 视频地址:https://s ...
- asm.js 和 Emscripten 入门教程
http://www.ruanyifeng.com/blog/2017/09/asmjs_emscripten.html 作者: 阮一峰 日期: 2017年9月 7日 Web 技术突飞猛进,但是有一个 ...
- WebAssembly入门-未来可能发生的巨变
引言 先看下 官网 给的定义. WebAssembly (abbreviated Wasm) is a binary instruction format for a stack-based virt ...
- Kafka入门教程与详解
1 Kafka入门教程 1.1 消息队列(Message Queue) Message Queue消息传送系统提供传送服务.消息传送依赖于大量支持组件,这些组件负责处理连接服务.消息的路由和传送.持久 ...
- 【CV】Pytorch一小时入门教程-代码详解
目录 一.关键部分代码分解 1.定义网络 2.损失函数(代价函数) 3.更新权值 二.训练完整的分类器 1.数据处理 2. 训练模型(代码详解) CPU训练 GPU训练 CPU版本与GPU版本代码区别 ...
最新文章
- 【解决方案】MTU现场能源发电机,点亮孤岛的文明之光
- ab plc编程软件_三菱PLC编程程序PLC的软件编程
- DIY人脸跟踪电风扇送女朋友(2)
- 【树状数组】Bzoj1878[SDOI2009] HH的项链
- C++ Qt学习笔记 (1) 简易计算器设计
- Java设计模式(详细待续)(转)
- 分治法 —— 折半查找(递归与非递归)
- android (java) 网络发送get/post请求参数设置
- QQ所有文件和目录详细分析
- win10 如何设置绿色保护色?
- 魔兽世界插件开发-WOWLUA插件
- php 快递鸟 批量打印,电子面单批量打印接口简易手册(快递鸟)
- CDC Schemes
- 图片的透明半透明显示!
- react中关于解决antd里日历组件内部英文转换的问题
- Java调用excel宏
- Hypergraph Neural Networks HGNN
- promise的前世来生
- pipeline的相关解释(instruction pipeline)
- 城市易涝点(隧道、涵洞)监测系统方案
热门文章
- mysql5.6.17编译 安装
- g网java_G网游戏手机评测之摩托罗拉E398_新浪游戏_新浪网
- NC212914 牛牛与后缀表达式
- 如何下载10米精度的谷歌地球高程数据
- UTF-8编码格式转换
- [通讯录工具][安卓+苹果]如何将Excel电话通讯录导入华为或苹果手机?如何批量导入号码到安卓手机,下面是具体操作
- 磁盘阵列故障数据恢复常规思路--谈数据恢复心得
- 股票费用计算机,【股票买卖收益的计算器】股票买卖费用怎么算?_千聊
- web前端工程师怎么写月报_Web开发人员月报2018年8月
- 公司组织结构 中英对照