如何在HTML页面间传递PyScript变量并保留Python对象类型？

因为localStorage仅支持存储字符串，直接存入Python对象会自动调用__repr__()转为字符串，导致无法还原为原对象。要保留Python对象的结构，需要通过序列化-反序列化的方式处理，以下是两种可行方案：

方案1：基于JSON的序列化（推荐，安全兼容） #

利用JSON实现跨语言序列化，对Pandas对象做针对性转换：

页面1（存储对象） #

<py-script>
    import js
    import json
    import pandas as pd

    # 假设已生成dtypes（字典）、df（DataFrame）、target（任意可JSON序列化类型）
    # 将DataFrame转为JSON兼容的字典格式
    df_serializable = df.to_dict(orient='records')
    
    # 序列化为JSON字符串后存入localStorage
    js.localStorage.setItem("dtypes", json.dumps(dtypes))
    js.localStorage.setItem("df", json.dumps(df_serializable))
    js.localStorage.setItem("target", json.dumps(target))
</py-script>

页面2（还原对象） #

<py-script>
    import js
    import json
    import pandas as pd

    # 读取JSON字符串
    dtypes_str = js.localStorage.getItem("dtypes")
    df_str = js.localStorage.getItem("df")
    target_str = js.localStorage.getItem("target")

    # 反序列化为Python对象，DataFrame单独还原
    dtypes = json.loads(dtypes_str)
    df = pd.DataFrame(json.loads(df_str))
    target = json.loads(target_str)

    # 验证类型
    js.console.log(type(dtypes))  # <class 'dict'>
    js.console.log(type(df))      # <class 'pandas.core.frame.DataFrame'>
</py-script>

方案2：基于Pickle的序列化（适合复杂对象，注意安全） #

Pickle可以序列化几乎所有Python对象，但需要将二进制数据转为Base64字符串适配localStorage，且仅在可信环境使用（反序列化恶意数据存在安全风险）：

页面1（存储对象） #

<py-script>
    import js
    import pickle
    import base64

    # 序列化对象为Base64字符串
    def serialize_to_b64(obj):
        return base64.b64encode(pickle.dumps(obj)).decode('utf-8')

    js.localStorage.setItem("dtypes", serialize_to_b64(dtypes))
    js.localStorage.setItem("df", serialize_to_b64(df))
    js.localStorage.setItem("target", serialize_to_b64(target))
</py-script>

页面2（还原对象） #

<py-script>
    import js
    import pickle
    import base64

    # 从Base64字符串反序列化
    def deserialize_from_b64(b64_str):
        return pickle.loads(base64.b64decode(b64_str))

    dtypes = deserialize_from_b64(js.localStorage.getItem("dtypes"))
    df = deserialize_from_b64(js.localStorage.getItem("df"))
    target = deserialize_from_b64(js.localStorage.getItem("target"))

    # 验证类型
    js.console.log(type(dtypes))
    js.console.log(type(df))
</py-script>

注意事项 #

• localStorage有大小限制（通常约5MB），大型DataFrame建议改用IndexedDB存储。
• Pickle序列化存在版本兼容性问题，不同Python版本的Pickle数据可能无法互转。
• 不可信环境下禁用Pickle方案，避免反序列化漏洞。

内容的提问来源于stack exchange，提问作者Value_Investor