首页 > 其他分享 >WASM_WebAssembly简单运行-hello,world

WASM_WebAssembly简单运行-hello,world

时间:2024-02-04 11:56:01浏览次数:26  
标签:WebAssembly emscripten https releases WASM wasm world http

WASM

 WASM 可以被 JavaScript 调用,进入 JavaScript 上下文
    Wasm,即WebAssembly,是一种用来补充JS在运行上不足的“低级”语言——基于二进制编写-是一种新的字节码格式
      允许用户采用自己熟悉的语言书写(目前支持C/C++/Rust),再在虚拟机引擎在浏览器上运行。
	   它支持沙盒模式,即先用高级语言编写wasm模块,再在JS中以库函数加载。

安装

 emsdk_packages_url = 'https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/'
 emscripten_releases_repo = 'https://chromium.googlesource.com/emscripten-releases'
 emscripten_releases_download_url_template = "https://storage.googleapis.com/webassembly/emscripten-releases-builds/%s/%s/wasm-binaries%s.%s"

下载下来后放在./emsdk/downloads中(downloads中需要创建),一共需要下载四个安装包,下载后再次执行命令会自动解压loads中(zips需要创建),一共需要下载四个安装包,下载后再次执行命令会自动解压

②node
https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/node-v16.20.0-linux-x64.tar.xz
①wasm
https://storage.googleapis.com/webassembly/emscripten-releases-builds/linux/e5523d57a0e0dcf80f3b101bbc23613fcc3101aa/wasm-binaries.tar.xz

③python
https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/WinPython-64bit-2.7.13.1Zero.zip
④java
https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/portable_jre_8_update_152_64bit.zip

编译器

wasm的官方编译器是Emscripten--将c文件编译产出生成xx.wasm
  转换的大致流程可以简单归结为:C/C++ 源代码 -> LLVM IR -> Wasm。
  emcc 直接使用了 Clang 编译器的前端,把编译输入的 C/C++ 源代码转换到 LLVM-IR 中间代码	
     LLVM 的全称为 “Low Level Virtual Machine”,翻译成中文即“低层次虚拟机”
	 Emscripten将llvm的中间语言转换成node代码(test.wasm),js可以识别使用
 Wasmtime: 优点:Wasmtime 是一个快速、安全的 wasm 运行时引擎
 WebAssembly Studio: 优点:WebAssembly Studio 是一个在线 IDE


|--> .wasm : WebAssembly汇编文件;
|--> .js : 胶水代码,自动完成.wasm载入/编译/实例化、运行时初始化等工作;
|--> .html : Emscripten测试页面

运行

1.浏览器上运行
   接从本地硬盘打开生成的 HTML 文件(hello.html)(例如 file://your_path/hello.html),
   你会得到一个错误信息,大意是 both async and sync fetching of the wasm failed。
   你需要通过 HTTP 服务器(http://)运行你的 HTML 文件——参见如何设置本地测试服务器获取更多信息。

2.非浏览器上运行
   浏览器以外运行 .wasm 程序,系统需要提供一个 wasm 运行环境 (runtime)
      对嵌入式的 wasm-micro-runtime 了,简称为 WAMR
	  云服务的运行环境,现在比较主流的是 wasmer 和 wasmtime
 
3.浏览器运行说明 
  HTML文件直接在浏览器打开和本地服务器localhost打开有什么区别?
         最直接的区别,很容易注意到,一个是file协议,另一个是http协议。 
          http请求方式则是通过假架设一个web服务器,解析http协议的请求然后向浏览器返回资源信息
		  。我们所开发的html文件最后必定是会以网页的形式部署在服务器上
	  访问服务器上的html文件是以http的协议方式去打开,有网络交互。直接打开html文件是以file协议的方式去打开,没有网络交互	  
   
   启动http服务
 01.Python自带一个微型的http服务,可以通过命令行启动:
        python3 -m http.server 
       然后这个服务启动后,在浏览器输入localhost:8000即可。显示的内容是基于你启动服务时所在的路径下的文件。
    http.server 不推荐用于生产环境。它仅仅实现了 basic security checks 的要求。
    可用性: 非 Emscripten,非 WASI。此模块在 WebAssembly 平台 wasm32-emscripten 和 wasm32-wasi 上不适用或不可用
   
  02.  http-server 启动一个静态服务器,只负责当前目录的文件路由
     http-server
	   npm i http-server -g
	 NPM的全称是Node Package Manager,是一个NodeJS包管理和分发工具,已经成为了非官方的发布Node模块(包)的标准  
	
 注意http-server 和http.server的不同

参考

 windows下和linux 安装emscripten  https://blog.csdn.net/qq_34754747/article/details/103815349
 WebAssembly初探 https://blog.csdn.net/jh1988abc/article/details/130364866
 https://developer.mozilla.org/zh-CN/docs/WebAssembly/C_to_wasm

标签:WebAssembly,emscripten,https,releases,WASM,wasm,world,http
From: https://www.cnblogs.com/ytwang/p/18005933

相关文章

  • Day 02.Hello world
    Helloworld新建文件夹,用于存放代码新建一个java文件,文件后缀.java编写代码publicclassHello{publicstaticvoidmain(String[]args)[System.out.print("Hello,world!");]}转译javac文件运行class文件![image-20240203134956868](/Users/zewei/Librar......
  • HelloWorld详解
    HelloWorld新建文件夹,存放代码新建一个Java文件文件后缀名为.java(Hello.java)系统可能没有显示文件名后缀,需手动打开编写代码publicclassHello{publicstaticviodmain(String[]args){System.out.print("Hello,World!");}}编译javacja......
  • WebAssembly核心编程[3]: Module 与 Instance
    WebAssembly程序总是以模块来组织,模块是基本的部署、加载和编译单元。在JavaScript编程接口中,模块通过WebAssembly.Module类型表示。WebAssembly.Module通过加载的.wasm二进制文件创建而成,它承载了描述wasm模块的元数据,类似于描述程序集的Assembly对象。WebAssembly.Module自身是......
  • quickjs-emscripten webassembly 包
    quickjs-emscripten是基于emscripten将quickjsc版本,编译为了webassembly方便通过npm使用包含的特性支持node以及web使用安全的执行js(支持到es2020)quickjsruntime进行创建以及维护值暴露主机函数到quickjsruntime通过asyncify支持执行异步代码参考使用app.mjs......
  • rust使用proxy-wasm-rust-sdk开发envoy wasm 进行GRPC调用
    在一些业务中,对于客户端发送的请求,需要调用grcp服务来确认是否合规,这个时候可以在入口网关做些统一的处理。之前写的用go来编写wasm,在编写grpc调用时发现由于tinygo的原因导致无法进行grpc请求,在找了一圈后决定使用proxy-wasm-rust-sdk来完成该部分功能。一、创建项目cargone......
  • WebAssembly核心编程[2]:类型系统
    对于绝大多数编程语言来说,类型都是编程的基础,WebAssembly自然也不例外。总的来说,WebAssembly涉及的类型不多,很好掌握,接下来我们就来介绍一下WebAssembly编程涉及到的几种类型。本篇内容参考WebAssemblySpec。一、ValueType二、Function三、Memory四、Table五、Global六、......
  • 幻兽帕鲁Palworld优化配置文件在哪?存放路径
    幻兽帕鲁配置文件在哪?如何优化Palworld配置?阿腾云分享不同Windows和Linux服务器操作系统幻兽帕鲁配置文件路径:幻兽帕鲁配置文件存放路径位置Windows-Steam,SteamCMD配置文件位置:steamapps/common/PalServer/Pal/Saved/Config/WindowsServer/PalWorldSettings.iniLinux-SteamCM......
  • WebAssembly核心编程[1]:wasm模块实例化的N种方式
    当我们在一个Web应用中使用WebAssembly,最终的目的要么是执行wasm模块的入口程序(通过start指令指定的函数),要么是调用其导出的函数,这一切的前提需要创建一个通过WebAssembly.Instance对象表示的wasm模块实例(源代码)。一、wasm模块实例化总体流程二、利用WebAssembly.Module创建实......
  • HelloWorld
    随便新建一个文件夹,存放代码新建一个java文件文件后缀名为:.javaHello.java【注意点】系统可能没有显示文件后缀名,我们需要手动打开3.编写代码publicclassHello{ publicstaticvoidmain(String[]args){ System.out.print("Hello,World!"); }}编译javacjav......
  • Day03-Helloworld-IDEA
    Helloworld1.新建一个文件夹,用于存放代码。2.新建后缀名为java的文件。​文件命名组成是:Hello.java​文件打开方式为notepad++3.编写代码:publicclassHello{ publicstaticvoidmain(String[]args){ System.out.print("Hello,World!"); }}4.编译:把写的......