美文网首页IT.技术分享
跟我一起从零开始学习WebAssembly(三)、最简单的例子h

跟我一起从零开始学习WebAssembly(三)、最简单的例子h

作者: 5de9e117f2fe | 来源:发表于2019-07-09 10:21 被阅读1次

    有时我们想要使用我们自定义HTML模板。让我们来看看我们如何做到这一点。

    创建C++代码片

    • 首先,创建一个名为hello2的目录。


      新建hello2目录
    • 其次,在该目录下创建一个名为hello2.c文件。


      新建hello2.c文件
    • 并将以下C++代码保存在文件中:
    #include <stdio.h>
    
    int main(int argc, char ** argv)
    {
        printf("Hello World\n");
    }
    

    创建我们的自定义HTML模板文件

    • 1、在我们的emsdk库中搜索shell_minimal.html文件(如我的是:D:\emsdk\fastcomp\emscripten\src)。
      shell_minimal.html
    • 2、在我们当前目录的上一级创建一个html_template目录。


      新建html_template目录
    • 3、将shell_minimal.html文件复制到html_template目录。


      复制到目录

    编译

    现在进入到hello2目录(再次,在Emscripten编译器环境终端窗口中),然后运行以下命令:

    emcc -o hello2.html hello2.c -O3 -s WASM=1 --shell-file html_template/shell_minimal.html
    

    然而我们发现会报错,

    Traceback (most recent call last):
      File "D:\emsdk\fastcomp\emscripten\emcc.py", line 3420, in <module>
        sys.exit(run(sys.argv))
      File "D:\emsdk\fastcomp\emscripten\emcc.py", line 2318, in run
        memfile, optimizer)
      File "D:\emsdk\fastcomp\emscripten\emcc.py", line 3237, in generate_html
        wasm_binary_target, memfile, optimizer)
      File "D:\emsdk\fastcomp\emscripten\emcc.py", line 3010, in generate_traditional_runtime_html
        shell = read_and_preprocess(options.shell_path)
      File "D:\emsdk\fastcomp\emscripten\tools\shared.py", line 3272, in read_and_preprocess
        run_js(path_from_root('tools/preprocessor.js'), NODE_JS, args, True, stdout=open(stdout, 'w'), cwd=path)
      File "D:\emsdk\fastcomp\emscripten\tools\shared.py", line 1089, in run_js
        return jsrun.run_js(filename, engine, *args, **kw)
      File "D:\emsdk\fastcomp\emscripten\tools\jsrun.py", line 129, in run_js
        universal_newlines=True)
      File "D:\emsdk\python\2.7.13.1_64bit\python-2.7.13.amd64\lib\subprocess.py", line 390, in __init__
        errread, errwrite)
      File "D:\emsdk\python\2.7.13.1_64bit\python-2.7.13.amd64\lib\subprocess.py", line 640, in _execute_child
        startupinfo)
    WindowsError: [Error 267]
    

    如图:


    报错

    根据提示,我们跟踪到最后一个文件,看看里面的内容:


    跟踪错误
    我们主要看抛异常的地方:
                except pywintypes.error, e:
                    # Translate pywintypes.error to WindowsError, which is
                    # a subclass of OSError.  FIXME: We should really
                    # translate errno using _sys_errlist (or similar), but
                    # how can this be done from Python?
                    raise WindowsError(*e.args)
    

    看看官方的描述:将pywintypes.error转换为WindowsError,它是OSError的子类。 FIXME:我们应该使用_sys_errlist(或类似的)来转换错误码,但是如何从Python中完成呢?。
    那么说白了就是将python的错误码转换为window错误码。
    最终输出:
    WindowsError: [Error 267],其实就给我们windows中使用的GetlastError一样,而我们找到windows错误码为267,是路劲错误。
    最终定位到我们命令中的html_template/shell_minimal.html路劲有问题,要么使用绝对路劲,要么前面加上../
    最后我们修改如下:

    emcc -o hello2.html hello2.c -O3 -s WASM=1 --shell-file ../html_template/shell_minimal.html
    

    编译成功。


    编译成功

    我们通过的选项这次略有不同:

    我们已经指定了-o hello2.html,这意味着编译器仍将输出JavaScript粘合代码和.html。
    我们还指定了--shell-file html_template/shell_minimal.html- 这提供了您想要用来创建HTML的HTML模板的路径,您将通过该示例运行。


    编译结果

    运行实例

    现在让我们运行这个例子。上面的命令将生成hello2.html,它将与模板具有相同的内容,并添加一些粘合代码以加载生成的wasm,运行它等。在浏览器中打开它,你会看到与最后一个相同的输出例。
    先看看我们的模板效果:


    模板效果

    再看实例效果,看看是否跟模板一样:


    运行效果
    注意:您可以通过在-o标志中指定.js文件而不是HTML文件来指定仅输出JavaScript“glue”文件*而不是完整的HTML ,例如 emcc -o hello2.js hello2.c -O3 -s WASM=1。然后,您可以从头开始构建自定义HTML,尽管这是一种高级方法; 使用提供的HTML模板通常更容易。

    Emscripten需要各种各样的JavaScript“粘合”代码来处理内存分配,内存泄漏以及许多其他问题。

    相关文章

      网友评论

        本文标题:跟我一起从零开始学习WebAssembly(三)、最简单的例子h

        本文链接:https://www.haomeiwen.com/subject/mzvtkctx.html