哥哥 hello_world的wasm版本怎么hook呀

rogerxavier

// ==UserScript==
// @name         localhost wasm
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  learn webpack wasm compiling from rust
// @author       Your Name
// @match        http://localhost/*
// @grant        GM_xmlhttpRequest
// @grant        unsafeWindow
// @require      http://localhost:8080/index.js
// @run-at       document-start
// ==/UserScript==

(function(){
    unsafeWindow.WebAssembly.instantiateStreaming_ = unsafeWindow.WebAssembly.instantiateStreaming;
    unsafeWindow.WebAssembly.instantiateStreaming = function(bufferSource, importObject){
        return unsafeWindow.WebAssembly.instantiateStreaming_(bufferSource, importObject).then(
            results => {
                // Modify the greet function once the WebAssembly instance is created
            const instance = results.instance;

            debugger;
            // Hook the greet function
            const originalGreet = instance.exports.greet;
            // debugger;
            instance.exports.greet = function(...args) {
                // args 是一个包含所有传入参数的数组
                console.log('Hooked greet function called with arguments:', args);

                // 调用原始 greet 函数，使用 apply 方法传递所有参数
                return originalGreet.apply(instance, args); // args 会自动展开为多个参数传递给原始函数
            };

            // Expose instance globally if needed
            unsafeWindow.greet = instance.exports.greet;

            console.log('WebAssembly instance created and greet hooked');
            return results; // Return the original results
        });
    } 

})();

这里greet明明被调用了，但是hook不到，是因为greet是只读不可修改属性的原因吗，要怎么用proxy或者defineproporty来修改属性然后hook到greet函数呀（比如修改参数显示"哥哥牛逼"）

李恒道

哥哥最好顺便给个测试页面的demo
不然不好看问题

rogerxavier

李恒道 发表于 2024-12-3 05:19

哥哥最好顺便给个测试页面的demo
不然不好看问题

哥哥我是本地跑的这个rust wasm 实例( example下的hello_world)https://github.com/rustwasm/wasm-bindgen/tree/main/examples

李恒道

rogerxavier 发表于 2024-12-3 07:24
[md]哥哥我是本地跑的这个rust wasm 实例( example下的hello_world)https://github.com/rustwasm/wasm-bi ...

哥哥方便的话可以发个打包版的吗
我这里跑都跑不起来...

rogerxavier

https://rustwasm.github.io/wasm-bindgen/exbuild/hello_world/ 哥哥可以使用官方的示例试试

李恒道

rogerxavier 发表于 2024-12-4 08:44

https://rustwasm.github.io/wasm-bindgen/exbuild/hello_world/ 哥哥可以使用官方的示例试试

可以不可以复写成功可以直接下个debugger做测试
哥哥的代码里只有instance是可以被复写的
顺着这层直接assgin一下返回应该是可以的

    unsafeWindow.WebAssembly.instantiateStreaming = function(bufferSource, importObject){
        return unsafeWindow.WebAssembly.instantiateStreaming_(bufferSource, importObject).then(
            results => {
                // Modify the greet function once the WebAssembly instance is created
                const instance = results.instance;

                const handler = {
                    get: function (obj, prop) {
                        console.log('get attr',prop)
                        return obj[prop];
                    },
                };
                results.instance=new Proxy(instance, handler);

                console.log('WebAssembly instance created and greet hooked');
                return results; // Return the original results
            });
    }

因为控制台测试的，后续代码就懒得写了，哥哥判断export然后assign直接复写应该就ok了

rogerxavier

1. (function(){
   
2.     unsafeWindow.WebAssembly.instantiateStreaming_ = unsafeWindow.WebAssembly.instantiateStreaming;
   
3.     unsafeWindow.WebAssembly.instantiateStreaming = function(bufferSource, importObject){
   
4.         return unsafeWindow.WebAssembly.instantiateStreaming_(bufferSource, importObject).then(
   
5.             results => {
   
6.                 // 获取 WebAssembly 实例
   
7.                 const instance = results.instance;
   
8. 
   
9.                 const handler = {
   
10.                     get: function (obj, prop) {
    
11.                         // 检查是访问 exports 对象，还是更具体的函数
    
12.                         console.log('get attr', prop);
    
13. 
    
14.                         // 如果访问的是 'exports'，进一步检查
    
15.                         if (prop === 'exports') {
    
16.                             return new Proxy(obj[prop], {
    
17.                                 get: function (exportsObj, exportProp) {
    
18.                                     // 只处理对 'greet' 函数的访问
    
19.                                     if (exportProp === 'greet') {
    
20.                                         console.log('hook到greet');
    
21.                                         const originalGreet = exportsObj[exportProp];
    
22.                                         return function(...args) {
    
23.                                             console.log('调用greet函数', args);
    
24.                                             return originalGreet(...args);
    
25.                                         };
    
26.                                     }
    
27.                                     return exportsObj[exportProp];
    
28.                                 }
    
29.                             });
    
30.                         }
    
31. 
    
32.                         // 返回其他属性
    
33.                         return obj[prop];
    
34.                     },
    
35.                 };
    
36. 
    
37.                 // 使用 Proxy 拦截 instance，捕获对属性（包括 exports）和 greet 的访问
    
38.                 results.instance = new Proxy(instance, handler);
    
39. 
    
40.                 console.log('WebAssembly instance created and greet hooked');
    
41.                 return results; // 返回原始结果
    
42.             });
    
43.     }
    
44. })();
    

复制代码

哥哥这里我判断export然后hook到greet函数后试图打印参数并修改它添加log，但是最后报错了

1. 'get' on proxy: property 'greet' is a read-only and non-configurable data property on the proxy target but the proxy did not return its actual value (expected 'function 64() { [native code] }' but got 'function(...args) { console.log('调用greet函数', args)...<omitted>... }')TypeError: 'get' on proxy: property 'greet' is a read-only and non-configurable data property on the proxy target but the proxy did not return its actual value (expected 'function 64() { [native code] }' but got 'function(...args) {
   

复制代码

李恒道

rogerxavier 发表于 2024-12-4 13:01

哥哥这里我判断export然后hook到greet函数后试图打印参数并修改它添加log，但是最后报错了
...

// ==UserScript==
// @name         localhost wasm
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  learn webpack wasm compiling from rust
// @author       Your Name
// @match        https://rustwasm.github.io/wasm-bindgen/exbuild/hello_world/
// @grant        GM_xmlhttpRequest
// @grant        unsafeWindow
// @run-at       document-start
// ==/UserScript==

(function(){
    debugger;
    unsafeWindow.WebAssembly.instantiateStreaming_ = unsafeWindow.WebAssembly.instantiateStreaming;
    unsafeWindow.WebAssembly.instantiateStreaming = function(bufferSource, importObject){
        return unsafeWindow.WebAssembly.instantiateStreaming_(bufferSource, importObject).then(
            results => {
                // Modify the greet function once the WebAssembly instance is created
                const instance = results.instance;

                const handler = {
                    get: function (obj, prop) {
                        if(prop==='exports'){
                            const assign={...obj[prop]}
                            assign.greet=function (...args){
                                return obj[prop].greet(...args)
                            }
                            return assign
                        }
                        console.log('get attr',prop)
                        return obj[prop];
                    },
                };
                results.instance=new Proxy(instance, handler);

                console.log('WebAssembly instance created and greet hooked');
                return results; // Return the original results
            });
    }

})();

rogerxavier

ggnb,ggnb,ggnb