呈现组件，但立即无法连接。

Question

我跟踪了文献资料 (和一些博客)，在剃须刀页面应用程序中添加了blazor组件。剃须刀页面是完美的呈现组件，但随后立即得到‘试图重新连接’，这总是失败的。控制台输出显示(显然，运行在本地主机上)：

[2020-07-20T00:22:59.957Z] Information: Normalizing '_blazor' to 'https://localhost:44306/_blazor'.
blazor.server.js:1 [2020-07-20T00:22:59.961Z] Debug: Starting HubConnection.
blazor.server.js:1 [2020-07-20T00:22:59.969Z] Debug: Starting connection with transfer format 'Binary'.
blazor.server.js:1 [2020-07-20T00:22:59.970Z] Debug: Sending negotiation request: https://localhost:44306/_blazor/negotiate?negotiateVersion=1.
blazor.server.js:1 [2020-07-20T00:23:00.145Z] Debug: Selecting transport 'WebSockets'.
blazor.server.js:1 [2020-07-20T00:23:00.174Z] Information: WebSocket connected to wss://localhost:44306/_blazor?id=vuY411dkAsPan4fQrNN3aw.
blazor.server.js:1 [2020-07-20T00:23:00.175Z] Debug: The HttpConnection connected successfully.
blazor.server.js:1 [2020-07-20T00:23:00.175Z] Debug: Sending handshake request.
blazor.server.js:1 [2020-07-20T00:23:00.176Z] Information: Using HubProtocol 'blazorpack'.
blazor.server.js:1 [2020-07-20T00:23:00.182Z] Debug: Server handshake complete.
blazor.server.js:1 [2020-07-20T00:23:00.182Z] Debug: HubConnection connected successfully.
blazor.server.js:1 [2020-07-20T00:23:00.327Z] Information: Close message received from server.
blazor.server.js:1 [2020-07-20T00:23:00.329Z] Debug: HttpConnection.stopConnection(undefined) called while in state Disconnecting.
blazor.server.js:1 [2020-07-20T00:23:00.332Z] Error: Connection disconnected with error 'Error: Server returned an error on close: Connection closed with an error.'.
e.log @ blazor.server.js:1
e.stopConnection @ blazor.server.js:1
transport.onclose @ blazor.server.js:1
e.close @ blazor.server.js:1
e.stop @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
a @ blazor.server.js:1
Promise.then (async)
c @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stopInternal @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stop @ blazor.server.js:1
e.processIncomingData @ blazor.server.js:1
connection.onreceive @ blazor.server.js:1
i.onmessage @ blazor.server.js:1
blazor.server.js:1 [2020-07-20T00:23:00.333Z] Debug: HubConnection.connectionClosed(Error: Server returned an error on close: Connection closed with an error.) called while in state Connected.
blazor.server.js:1 Uncaught (in promise) Error: Server returned an error on close: Connection closed with an error.
    at e.processIncomingData (blazor.server.js:1)
    at e.connection.onreceive (blazor.server.js:1)
    at WebSocket.i.onmessage (blazor.server.js:1)
e.processIncomingData @ blazor.server.js:1
connection.onreceive @ blazor.server.js:1
i.onmessage @ blazor.server.js:1
Promise.then (async)
c @ blazor.server.js:8
a @ blazor.server.js:8
Promise.then (async)
c @ blazor.server.js:8
(anonymous) @ blazor.server.js:8
r @ blazor.server.js:8
E @ blazor.server.js:8
(anonymous) @ Eol:12448
blazor.server.js:19 [2020-07-20T00:23:03.338Z] Error: TypeError: window.Blazor.reconnect is not a function
e.log @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
r @ blazor.server.js:19
e.attemptPeriodicReconnection @ blazor.server.js:19
e @ blazor.server.js:19
e.onConnectionDown @ blazor.server.js:19
(anonymous) @ blazor.server.js:8
(anonymous) @ blazor.server.js:1
e.completeClose @ blazor.server.js:1
e.connectionClosed @ blazor.server.js:1
connection.onclose @ blazor.server.js:1
e.stopConnection @ blazor.server.js:1
transport.onclose @ blazor.server.js:1
e.close @ blazor.server.js:1
e.stop @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
a @ blazor.server.js:1
Promise.then (async)
c @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stopInternal @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stop @ blazor.server.js:1
e.processIncomingData @ blazor.server.js:1
connection.onreceive @ blazor.server.js:1
i.onmessage @ blazor.server.js:1
blazor.server.js:19 [2020-07-20T00:23:06.346Z] Error: TypeError: window.Blazor.reconnect is not a function
e.log @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
r @ blazor.server.js:19
e.attemptPeriodicReconnection @ blazor.server.js:19
e @ blazor.server.js:19
e.onConnectionDown @ blazor.server.js:19
(anonymous) @ blazor.server.js:8
(anonymous) @ blazor.server.js:1
e.completeClose @ blazor.server.js:1
e.connectionClosed @ blazor.server.js:1
connection.onclose @ blazor.server.js:1
e.stopConnection @ blazor.server.js:1
transport.onclose @ blazor.server.js:1
e.close @ blazor.server.js:1
e.stop @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
a @ blazor.server.js:1
Promise.then (async)
c @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stopInternal @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stop @ blazor.server.js:1
e.processIncomingData @ blazor.server.js:1
connection.onreceive @ blazor.server.js:1
i.onmessage @ blazor.server.js:1
blazor.server.js:19 [2020-07-20T00:23:09.353Z] Error: TypeError: window.Blazor.reconnect is not a function
e.log @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
r @ blazor.server.js:19
e.attemptPeriodicReconnection @ blazor.server.js:19
e @ blazor.server.js:19
e.onConnectionDown @ blazor.server.js:19
(anonymous) @ blazor.server.js:8
(anonymous) @ blazor.server.js:1
e.completeClose @ blazor.server.js:1
e.connectionClosed @ blazor.server.js:1
connection.onclose @ blazor.server.js:1
e.stopConnection @ blazor.server.js:1
transport.onclose @ blazor.server.js:1
e.close @ blazor.server.js:1
e.stop @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
a @ blazor.server.js:1
Promise.then (async)
c @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stopInternal @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stop @ blazor.server.js:1
e.processIncomingData @ blazor.server.js:1
connection.onreceive @ blazor.server.js:1
i.onmessage @ blazor.server.js:1
blazor.server.js:19 [2020-07-20T00:23:12.375Z] Error: TypeError: window.Blazor.reconnect is not a function
e.log @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
r @ blazor.server.js:19
e.attemptPeriodicReconnection @ blazor.server.js:19
e @ blazor.server.js:19
e.onConnectionDown @ blazor.server.js:19
(anonymous) @ blazor.server.js:8
(anonymous) @ blazor.server.js:1
e.completeClose @ blazor.server.js:1
e.connectionClosed @ blazor.server.js:1
connection.onclose @ blazor.server.js:1
e.stopConnection @ blazor.server.js:1
transport.onclose @ blazor.server.js:1
e.close @ blazor.server.js:1
e.stop @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
a @ blazor.server.js:1
Promise.then (async)
c @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stopInternal @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stop @ blazor.server.js:1
e.processIncomingData @ blazor.server.js:1
connection.onreceive @ blazor.server.js:1
i.onmessage @ blazor.server.js:1
blazor.server.js:19 [2020-07-20T00:23:15.390Z] Error: TypeError: window.Blazor.reconnect is not a function
e.log @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
a @ blazor.server.js:19
Promise.then (async)
c @ blazor.server.js:19
(anonymous) @ blazor.server.js:19
r @ blazor.server.js:19
e.attemptPeriodicReconnection @ blazor.server.js:19
e @ blazor.server.js:19
e.onConnectionDown @ blazor.server.js:19
(anonymous) @ blazor.server.js:8
(anonymous) @ blazor.server.js:1
e.completeClose @ blazor.server.js:1
e.connectionClosed @ blazor.server.js:1
connection.onclose @ blazor.server.js:1
e.stopConnection @ blazor.server.js:1
transport.onclose @ blazor.server.js:1
e.close @ blazor.server.js:1
e.stop @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
a @ blazor.server.js:1
Promise.then (async)
c @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stopInternal @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
(anonymous) @ blazor.server.js:1
M @ blazor.server.js:1
e.stop @ blazor.server.js:1
e.processIncomingData @ blazor.server.js:1
connection.onreceive @ blazor.server.js:1
i.onmessage @ blazor.server.js:1

• _Layout.cshtml在头中包含<base href="/">，在<body>的末尾有：
• 我在根目录和页面文件夹中都有_Imports.razor，其中包含 使用Microsoft.AspNetCore.Authorization @使用Microsoft.AspNetCore.Components使用Microsoft.AspNetCore.Components.Authorization使用Microsoft.AspNetCore.Components.Forms使用Microsoft.AspNetCore.Components.Routing使用Microsoft.AspNetCore.Components.Web使用Microsoft.JSInterop使用MyAppNamespace
• Startup.cs在ConfigureServices中有services.AddServerSideBlazor();，并配置如下： .MapRazorPages()；.MapBlazorHub()；.MapFallbackToPage(/_Host)；
• _Host.cshtml在“页面”文件夹中，包含 @页面"/blazor“@{ Layout = "_Layout"；}

根据控制台日志，从Index页面连接可以正常工作，但对于使用组件的另一个页面则不行。

我显然是错过了一些水管，但我不知道是什么。我遗漏了什么？

更新:我尝试使用Index页面中的blazor组件，在该页面中，客户端似乎正在连接，但我看到了同样的情况:页面呈现组件，然后连接被关闭，不尝试重新连接成功。

Answer 1

当将复杂对象作为参数传递给组件时，我观察到了这种行为。

<component type="typeof(MyComponent)" render-mode="ServerPrerendered" param-Data="@myComplexObject" />

组件标记助手似乎只适用于简单类型的参数表。

对我来说，我可以通过将呈现模式设置为Static来解决这个问题，但这对每个人来说都不是一个很好的解决方案。

Answer 2

你说过：_Layout.cshtml包含<href="/">

如果这不是一个错误，将其更改为<base href="/">