c#:如何在Blazor Wasm托管中从服务器发送动态Razor组件到客户端?

Question

我想在Blazor wasm中呈现动态剃刀组件项目。这些组件是在Razor类库中使用IDynamicComponent接口创建的。Blazor服务器端加载dll并将它们存储到IEnumerable<Type>中。问题是我不能通过SignalR将System.Type的单个组件发送到客户端并转换到IDynamicComponent。

IDynamicComponent.cs

public interface IDynamicComponent
{
IDictionary<Type,Type> InjectableDependencies { get; }
IDictionary<string,string> Parameters { get; }
string Name { get; }
Type Component { get;}
}

组件示例

MyComponent.cs

public class MyComponent : IDynamicComponent
{
public IDictionary<Type, Type> InjectableDependencies => new Dictionary<Type, Type>();
public IDictionary<string, string> Parameters => new Dictionary<string, string>();
public string Name => "Example1";
public Type Component => typeof(Component1);
}

Component1.razor

<h1>Counter</h1>
<p>Current count: @currentCount</p>
<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
@code {
private int currentCount = 0;
private void IncrementCount()
{
currentCount++;
}
}

Blazor端加载组件

public IEnumerable<Type> Components { get; private set; }
// Loads the dlls and stores the components in the 'IEnumerable<Type>'
public void LoadComponents(string path)
{
var components = new List<Type>();
var assemblies = LoadAssemblies(path);
foreach (var asm in assemblies)
{
var types = GetTypesWithInterface(asm);
foreach (var typ in types) components.Add(typ);
}
Components = components;
}
// Gets the component by name
public IDynamicComponent GetComponentByName(string name)
{
return Components.Select(x => (IDynamicComponent)Activator.CreateInstance(x))
.SingleOrDefault(x => x.Name == name);
}

SignalR服务端的功能

// Sends a component to client via SignalR when requested.
public async Task GetPlugin()
{
// Converting component of System.Type to object to send to client
string typeName = Component.FullName;
Type type = GetTypeFrom(typeName);
object obj = Activator.CreateInstance(type);
string component = JsonConvert.SerializeObject(obj);

await myHub.Clients.All.SendAsync("Plugin", component);
}
private Type GetTypeFrom(string valueType)
{
var type = Type.GetType(valueType);
if (type != null)
return type;
try
{
var assemblies = AppDomain.CurrentDomain.GetAssemblies();
//To speed things up, we check first in the already loaded assemblies.
foreach (var assembly in assemblies)
{
type = assembly.GetType(valueType);
if (type != null)
break;
}
if (type != null)
return type;
var loadedAssemblies = assemblies.ToList();
foreach (var loadedAssembly in assemblies)
{
foreach (AssemblyName referencedAssemblyName in loadedAssembly.GetReferencedAssemblies())
{
var found = loadedAssemblies.All(x => x.GetName() != referencedAssemblyName);
if (!found)
{
try
{
var referencedAssembly = Assembly.Load(referencedAssemblyName);
type = referencedAssembly.GetType(valueType);
if (type != null)
break;
loadedAssemblies.Add(referencedAssembly);
}
catch
{
//We will ignore this, because the Type might still be in one of the other Assemblies.
}
}
}
}
}
catch (Exception exception)
{
//throw my custom exception    
}
if (type == null)
{
//throw my custom exception.
}
return type;
}

客户端信号

尝试将对象强制转换为IDynamicComponent时发生错误。

public IDynamicComponent Component;

hubConnection.On<string>("Plugin", (component) =>
{
object obj = JsonConvert.DeserializeObject<object>(component);
Console.WriteLine(obj.ToString());
// Casting object to 'IDynamicComponent' to be able to render
Component = (IDynamicComponent)obj; // Error occurs here
UpdateBlazorUIEvent?.Invoke();
});

浏览器控制台输出

{ 
"InjectableDependencies": {}, 
"Parameters": {},
"Name": "Counter",
"Component": "PluginOne.Component1, PluginOne, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null",
}
Specified cast is not valid.

我怎样才能成功地发送一个组件(System.Type)到客户端并转换到IDynamicComponent来渲染UI?

Answer 1

不能通过Json传递Types。这正是错误所说的- 'System '的序列化和反序列化。不支持"实例"类型。

您需要使用反射来获得实际的完全限定类名作为字符串，通过IDynamicComponent传递，例如myassembly.myclass，然后在另一端获得对象的新实例。

代码看起来像:

// In Code
var myclass = typeof(myComponent).AssemblyQualifiedName;

// Out code
var assembly = Assembly.GetExecutingAssembly();
var mytype = assembly.GetTypes().First(item => item.Name.Equals(className));
var myclass = Activator.CreateInstance(type);

传递泛型类型object也有类似的问题。它最近咬了我!