使用动态参数从 c# 调用 javascript 方法

Question

我一直被一个关于动态类型与 jsRuntime 调用相结合的问题所困扰。

有一个实际问题：
如何从 C# 代码中以动态对象作为参数调用 Javascript 函数？
如果这不可能，那么完全转换它以便它可以被IJSRuntime 的InvokeAsync 函数接受的最佳方法是什么？

现在，我已经尝试过（显然失败了）。

我正在使用library from github which implements ChartJS in blazor。我已经复制了源代码而不是使用 nuget 包，因为在 blazor 或其他一些依赖项的最后更新中似乎有一些东西被破坏了。

我正在做的是从我的 razor 组件调用一个 Javascript 函数，并且我还在为所述函数传递我的配置。 StripNulls 方法将配置（实际类型）转换为动态类型，没有所有为空的属性。

dynamic param = StripNulls(chartConfig);
return jsRuntime.InvokeAsync<bool>("ChartJSInterop.SetupChart", param);

我认为没有必要为 StripNulls 方法添加代码，但也许我遗漏了一些重要的东西，所以这里是代码。

/// Returns an object that is equivalent to the given parameter but without any null member AND it preserves DotNetInstanceClickHandler/DotNetInstanceHoverHandler members intact
///
/// <para>Preserving DotNetInstanceClick/HoverHandler members is important because they contain DotNetObjectRefs to the instance whose method should be invoked on click/hover</para>
///
/// <para>This whole method is hacky af but necessary. Stripping null members is only needed because the default config for the Line charts on the Blazor side is somehow messed up. If this were not the case no null member stripping were necessary and hence, the recovery of the DotNetObjectRef members would also not be needed. Nevertheless, The Show must go on!</para>
/// </summary>
/// <param name="chartConfig"></param>
/// <returns></returns>
private static ExpandoObject StripNulls(ChartConfigBase chartConfig)
{
    // Serializing with the custom serializer settings remove null members
    var cleanChartConfigStr = JsonConvert.SerializeObject(chartConfig, JsonSerializerSettings);

    // Get back an ExpandoObject dynamic with the clean config - having an ExpandoObject allows us to add/replace members regardless of type
    dynamic clearConfigExpando = JsonConvert.DeserializeObject<ExpandoObject>(cleanChartConfigStr, new ExpandoObjectConverter());

    // Restore any .net refs that need to be passed intact
    var dynamicChartConfig = (dynamic) chartConfig;
    if (dynamicChartConfig?.Options?.Legend?.OnClick != null
        && dynamicChartConfig?.Options?.Legend?.OnClick is DotNetInstanceClickHandler)
    {
        clearConfigExpando.options = clearConfigExpando.options ?? new { };
        clearConfigExpando.options.legend = clearConfigExpando.options.legend ?? new { };
        clearConfigExpando.options.legend.onClick = dynamicChartConfig.Options.Legend.OnClick;
    }

    if (dynamicChartConfig?.Options?.Legend?.OnHover != null
        && dynamicChartConfig?.Options?.Legend?.OnHover is DotNetInstanceHoverHandler)
    {
        clearConfigExpando.options = clearConfigExpando.options ?? new { };
        clearConfigExpando.options.legend = clearConfigExpando.options.legend ?? new { };
        clearConfigExpando.options.legend.onHover = dynamicChartConfig.Options.Legend.OnHover;
    }

    return clearConfigExpando;
}

但是，如果我尝试使用此动态对象调用 InvokeAsync 方法，则会收到以下错误：

System.NotSupportedException: '不支持集合类型'System.Dynamic.ExpandoObject'。'

所以经过一些研究，我偶然发现了this answer，它建议将动态对象转换为字典。
但遗憾的是，这段代码出现了完全相同的错误：

dynamic dynParam = StripNulls(chartConfig);
Dictionary<string, object> param = new Dictionary<string, object>(dynParam);
return jsRuntime.InvokeAsync<bool>("ChartJSInterop.SetupChart", param);

然后我在调试检查器中看到，即使在我创建了 Dictionary 之后，字典中仍然存在 ExpandoObjects，这可能导致异常。令我惊讶的是，这种转换不是递归的。

所以我创建了自己的递归函数来将动态对象完全转换为字典。我是这样实现的，它似乎可以工作（它是一个非常大的嵌套对象，但我查看的所有属性都很好）：

private static Dictionary<string, object> ConvertDynamicToDictonary(IDictionary<string, object> value)
{
    return value.ToDictionary(
        p => p.Key,
        p => 
            p.Value is IDictionary<string, object> 
                ? ConvertDynamicToDictonary((IDictionary<string, object>)p.Value) 
                : p.Value
    );
}

并像这样调用（不，我不只是不小心传入了错误的参数）：

dynamic dynParam = StripNulls(chartConfig);
Dictionary<string, object> param = ConvertDynamicToDictonary(dynParam);
return jsRuntime.InvokeAsync<bool>("ChartJSInterop.SetupChart", param);

这个仍然抛出了同样的异常，现在我非常沮丧，不知道为什么它仍然告诉我ExpandoObject，而在我看来，我不明白它怎么可能不会已完全转换为Dictionary<string, object>。
我没有进一步的想法，并希望某种互联网上的陌生人可以帮助我解决这个问题。也许我的递归解决方案有问题，或者我忽略了一件小事，但我还没有设法找到它。

其他信息：

版本：
最新预览版中的所有内容（.net Core 3、VS 19、C#）

异常堆栈跟踪：

在 System.Text.Json.Serialization.JsonClassInfo.GetElementType(Type propertyType, Type parentType, MemberInfo memberInfo) 在 System.Text.Json.Serialization.JsonClassInfo.CreateProperty（类型声明的PropertyType，类型 runtimePropertyType，PropertyInfo propertyInfo，类型 parentClassType，JsonSerializerOptions 选项） 在 System.Text.Json.Serialization.JsonClassInfo.AddProperty（类型 propertyType，PropertyInfo propertyInfo，类型 classType，JsonSerializerOptions 选项） 在 System.Text.Json.Serialization.JsonClassInfo..ctor（类型类型，JsonSerializerOptions 选项） 在 System.Text.Json.Serialization.JsonSerializerOptions.GetOrAddClass（类型 classType） 在 System.Text.Json.Serialization.JsonSerializer.GetRuntimeClassInfo（对象值，JsonClassInfo& jsonClassInfo，JsonSerializerOptions 选项） 在 System.Text.Json.Serialization.JsonSerializer.HandleEnumerable（JsonClassInfo elementClassInfo，JsonSerializerOptions 选项，Utf8JsonWriter writer，WriteStack& 状态） 在 System.Text.Json.Serialization.JsonSerializer.Write（Utf8JsonWriter writer，Int32 flushThreshold，JsonSerializerOptions 选项，WriteStack& 状态） 在 System.Text.Json.Serialization.JsonSerializer.WriteCore（PooledByteBufferWriter 输出，对象值，类型类型，JsonSerializerOptions 选项） 在 System.Text.Json.Serialization.JsonSerializer.WriteCoreString（对象值，类型类型，JsonSerializerOptions 选项） 在 System.Text.Json.Serialization.JsonSerializer.ToString[TValue]（TValue 值，JsonSerializerOptions 选项） 在 Microsoft.JSInterop.JSRuntimeBase.InvokeAsync[T]（字符串标识符，对象 [] args） 在 ChartJs.Blazor.ChartJS.ChartJsInterop.SetupChart(IJSRuntime jsRuntime, ChartConfigBase chartConfig)

Answer 1

更新

我已将此功能放在 CodeReview (see) 上，并且我有一些改进。首先是一些一般性的东西，但是在当前的解决方案中有一个致命的错误。 IEnumerable<object> 的处理是错误的。只转换ExpandoObjects 很好，但我完全忽略了ExpandoObject以外的所有内容。这已在新解决方案中得到解决。
您可能想要做的一件事是将其转换为扩展方法以使其更加干净，但就我而言，我不想这样做，因为我希望该函数是私有的。如果您是公开的，您应该真正考虑扩展方法。

/// <summary>
/// This method is specifically used to convert an <see cref="ExpandoObject"/> with a Tree structure to a <see cref="Dictionary{string, object}"/>.
/// </summary>
/// <param name="expando">The <see cref="ExpandoObject"/> to convert</param>
/// <returns>The fully converted <see cref="ExpandoObject"/></returns>
private static Dictionary<string, object> ConvertExpandoObjectToDictionary(ExpandoObject expando) => RecursivelyConvertIDictToDict(expando);

/// <summary>
/// This method takes an <see cref="IDictionary{string, object}"/> and recursively converts it to a <see cref="Dictionary{string, object}"/>. 
/// The idea is that every <see cref="IDictionary{string, object}"/> in the tree will be of type <see cref="Dictionary{string, object}"/> instead of some other implementation like <see cref="ExpandoObject"/>.
/// </summary>
/// <param name="value">The <see cref="IDictionary{string, object}"/> to convert</param>
/// <returns>The fully converted <see cref="Dictionary{string, object}"/></returns>
private static Dictionary<string, object> RecursivelyConvertIDictToDict(IDictionary<string, object> value) =>
    value.ToDictionary(
        keySelector => keySelector.Key,
        elementSelector =>
        {
            // if it's another IDict just go through it recursively
            if (elementSelector.Value is IDictionary<string, object> dict)
            {
                return RecursivelyConvertIDictToDict(dict);
            }

            // if it's an IEnumerable check each element
            if (elementSelector.Value is IEnumerable<object> list)
            {
                // go through all objects in the list
                // if the object is an IDict -> convert it
                // if not keep it as is
                return list
                    .Select(o => o is IDictionary<string, object>
                        ? RecursivelyConvertIDictToDict((IDictionary<string, object>)o)
                        : o
                    );
            }

            // neither an IDict nor an IEnumerable -> it's fine to just return the value it has
            return elementSelector.Value;
        }
    );

原答案

所以我在几个小时后终于找到了答案。问题是（有点预期）ConvertDynamicToDictionary 方法。
我的递归解决方案只检查是否有另一个IDictionary，但最终发生的是在树的某处有一个ExpandoObjects 数组。在为IEnumerables 添加此检查后它起作用了，该方法现在看起来像这样：

private static Dictionary<string, object> ConvertDynamicToDictonary(IDictionary<string, object> value)
{
    return value.ToDictionary(
        p => p.Key,
        p =>
        {
            // if it's another IDict (might be a ExpandoObject or could also be an actual Dict containing ExpandoObjects) just go trough it recursively
            if (p.Value is IDictionary<string, object> dict)
            {
                return ConvertDynamicToDictonary(dict);
            }

            // if it's an IEnumerable, it might have ExpandoObjects inside, so check for that
            if (p.Value is IEnumerable<object> list)
            {
                if (list.Any(o => o is ExpandoObject))
                { 
                    // if it does contain ExpandoObjects, take all of those and also go trough them recursively
                    return list
                        .Where(o => o is ExpandoObject)
                        .Select(o => ConvertDynamicToDictonary((ExpandoObject)o));
                }
            }

            // neither an IDict nor an IEnumerable -> it's probably fine to just return the value it has
            return p.Value;
        } 
    );
}

我很高兴看到对此功能的任何批评，因为我不知道我是否涵盖了所有可能性。随时告诉我任何引起您注意的可以改进的地方。它绝对适用于我的情况，所以这将是我对自己问题的回答。