当对象添加到向量时，Rust wasm_bindgen 对象在 JS 端变为 null

Question

我有两个结构导出到 Javascript。我可以创建实例并在 JavaScript 中使用它们而不会出现任何错误，但是当我将实例推入 Rust 端的向量时，出现错误 "Uncaught Error: null pointer passed to rust"

由于所有权已更改，JS 对象变为 null 是完全正常的，但我还需要保留我的 JavaScript 对象以便在 JavaScript 方面进行更改。

是否有任何正确的方法来保持 "vect" 对象不为空并允许更改？

我添加了一个工作 example。您可以在浏览器的控制台中看到错误。

Rust 代码

use wasm_bindgen::prelude::*;

#[wasm_bindgen]
struct Vector3 {
    x: f32,
    y: f32,
    z: f32,
}

#[wasm_bindgen]
impl Vector3 {
    #[wasm_bindgen(constructor)]
    pub fn new() -> Vector3 {
        return Vector3 {
            x: 0.0,
            y: 0.0,
            z: 0.0,
        };
    }
    pub fn get_x(&self) -> f32 {
        self.x
    }
}

#[wasm_bindgen(extends = Object)]
struct Group {
    list: Vec<Vector3>,
}

#[wasm_bindgen]
impl Group {
    #[wasm_bindgen(constructor)]
    pub fn new() -> Group {
        return Group { list: vec![] };
    }

    pub fn add(&mut self, vec: Vector3) {
        self.list.push(vec);
    }
}

JavaScript代码

let group = new Group();

let list = [];
for (let i = 0; i < 10; i++) {
  let vect = new Vector3();
  list.push(vect);
  group.add(vect);
}

setInterval(() => {
  for (let i = 0; i < list.length; i++) {
    const vect = list[i];
    console.log(vect.get_x());
  }
}, 1000);

Answer 1

你应该非常小心你的数据被复制 - 一个副本在 JS 端，然后在 Rust 的 WASM 端。这里的问题是 Group.add 将值移出，因此一旦您调用 group.add，向量内部 "heap pointer"（由 wasm-bindgen 生成的互操作代码维护）就会发生变化，并且之前的复制变得无效，所以插入 list 的值几乎没有用。

处理这种情况的 Rust-y 方法是保留一个借用值的列表，并明确管理生命周期，以便列表不会超过其元素。不幸的是，wasm-bindgen 不允许对导出的结构进行显式生命周期声明，因此该选项不可用。

理想情况下，所有与处理向量相关的逻辑都应该只存在于 Rust 中并且对 JavaScript 隐藏。如果您真的需要访问两个位置的矢量，最简单的暴力解决方案是将 getter 添加到组中并将其用作 "master copy"。代码如下所示：

#[wasm_bindgen]
#[derive(Copy, Clone)]
pub struct Vector3 {
    x: f32,
    y: f32,
    z: f32,
}

#[wasm_bindgen]
impl Vector3 {
    #[wasm_bindgen(constructor)]
    pub fn new() -> Vector3 {
        Vector3 { x:0.0, y:0.0, z:0.0 }
    }

    pub fn get_x(&self) -> f32 {
        self.x
    }

    pub fn get_y(&self) -> f32 {
        self.y
    }

    pub fn get_z(&self) -> f32 {
        self.z
    }
}

#[wasm_bindgen]
pub struct Group{
    list: Vec<Vector3>,
}

#[wasm_bindgen]
impl Group {
    #[wasm_bindgen(constructor)]
    pub fn new() -> Group {
        Group { list: vec![] }
    }

    pub fn add(&mut self, vec: Vector3) {
        self.list.push(vec);
    }

    pub fn get_at(&self, idx: usize) -> Vector3 {
        self.list[idx]
    }
}

然后，JavaScript 边看起来像：

...

setTimeout(() => {
  for (let i = 0; i < list.length; i++) {
    const vect = group.get_at(i);
    console.log(vect.get_x());
  }
}, 1000);

...

我们完全摆脱了 list。

注意：这是一种非常糟糕的列表管理方式，因为每次调用 get_at 都会创建向量的另一个副本，因此如果您的代码是计算-heavy 那么内存泄漏可能是一个问题。不幸的是，wasm-bindgen 不允许借用 return 值，因此如果您需要在一次调用中拥有整个元组，克隆几乎是唯一的选择。

如果你不介意在 JS 端处理许多小调用，那么一个更明显的优化是拆分 get_at 并将其转换为 get_x_at、get_y_at, get_z_at 从而避免了携带 Vector 实例跨越 wasm 边界的需要。

更好的是，也许您可以想出一种不同的方法来拆分关注的区域，这样向量就根本不必跨越装配边界。

希望对您有所帮助！

当对象添加到向量时，Rust wasm_bindgen 对象在 JS 端变为 null

Rust wasm_bindgen object turns null in JS side when the object is added to a vector

rust

webassembly

wasm-bindgen