Apache 上的 Blazor WASM 根本找不到我的 API 端点

Question

所以，我有一个 Blazor WASM 解决方案，我已经为 Linux 编译，并且在 Apache 后面运行。 我正在使用我的 publish\wwwroot 文件夹作为 Apache 中的文档根目录，并使用 Apache 的以下 VirtualHosts 和目录配置（使用 SSL 路径和红色名称）

<Directory /etc/apache2/blazor/publish/wwwroot>
    Options Indexes FollowSymLinks
    AllowOverride None
    Require all granted
</Directory>

<VirtualHost *:80> 
  ServerName SITENAME.com
  
  Redirect permanent / https://SITENAME.com/
</VirtualHost>

<VirtualHost *:80> 
  ServerName www.SITENAME.com
  
  Redirect permanent / https://SITENAME.com/
</VirtualHost>

<VirtualHost *:443>
    ServerName SITENAME.com
        SSLEngine on
        SSLCertificateFile /SSLPATH
        SSLCertificateKeyFile /SSLPATH
        SSLCertificateChainFile /SSLPATH
        
        
    DocumentRoot "/etc/apache2/blazor/publish/wwwroot"
    ErrorDocument 404 /index.html

    AddType application/wasm .wasm
    AddType application/octet-stream .dll

    <Directory "/etc/apache2/blazor/publish/wwwroot">
        Options -Indexes
        AllowOverride None
    </Directory>

    <IfModule mod_deflate.c>
        AddOutputFilterByType DEFLATE text/css
        AddOutputFilterByType DEFLATE application/javascript
        AddOutputFilterByType DEFLATE text/html
        AddOutputFilterByType DEFLATE application/octet-stream
        AddOutputFilterByType DEFLATE application/wasm
        <IfModule mod_setenvif.c>
        BrowserMatch ^Mozilla/4 gzip-only-text/html
        BrowserMatch ^Mozilla/4.0[678] no-gzip
        BrowserMatch bMSIE !no-gzip !gzip-only-text/html
    </IfModule>
    </IfModule>

    ErrorLog /etc/apache2/blazor/blazorapp-error.log
    CustomLog /etc/apache2/blazor/blazorapp-access.log common
</VirtualHost>

当我将 go 加载到我的站点时，它加载得很好，它似乎加载了所有.razor 页面并完美地执行客户端代码。

但是，我无法访问 - 通过浏览器或通过 Postman 或通过任何东西 - 在服务器上运行的任何 API 端点。 它根本无法找到/到达他们。 我尝试在 ufw 中显式打开端口（我在 Ubuntu 20.10 上运行），在 Blazor 的启动设置中为端点指定不同的端口（并打开它们），我尝试让它们在端口 443 上侦听，以防万一the API requests are being redirected to port 443 by Apache, and nothing works - I literally cannot get them, I just get the Error 404 index.html in response (which of course is not good) with body text of "An unhandled error has发生了。”

我的启动设置：

{
  "iisSettings": {
    "windowsAuthentication": false,
    "anonymousAuthentication": true,
    "iisExpress": {
      "applicationUrl": "http://localhost:52679/",
      "sslPort": 44376
    }
  },
  "profiles": {
    "IIS Express": {
      "commandName": "IISExpress",
      "launchBrowser": true,
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    },
    "PROJECTNAME": {
      "commandName": "Project",
      "launchBrowser": true,
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      },
      "applicationUrl": "https://localhost:5001;http://localhost:5000"
    }
  }
}

最后一个 applicationUrl 的底部端口是实际在生产中使用的端口，尽管打开并尝试访问这些特定端口（5001 和 5000），或者将这些端口分别更改为 443 和 80，但没有任何效果。

在调试过程中使自己知道的控制器的实际路由没有问题，在我的开发机器上调试工作正常，一切都可以达到。 我不知道这里发生了什么使 Apache 上的已发布版本无法到达自己的端点，这让我非常抓狂。

我还尝试在我的 Apache 配置中使用以下配置行，它实际上似乎使整个站点无法访问：

<VirtualHost *:*>
    RequestHeader set "X-Forwarded-Proto" expr=%{REQUEST_SCHEME}
</VirtualHost>

<VirtualHost *:443>
    ProxyPreserveHost On
    ProxyPass / https://127.0.0.1:5001/
    ProxyPassReverse / https://127.0.0.1:5001/
...
...
etc...

我完全没有想法。 如果其他人编译了 Blazor WASM 项目以在 Linux 和 Apache 上运行，请分享您的知识，以免我痛苦，哈哈。

链接到我尝试或注销的“这个问题不是我遇到的问题”：

https://docs.microsoft.com/en-us/aspnet/core/host-and-deploy/linux-apache?view=aspnetcore-5.0 （我从那里得到了代理配置的想法——这只是让我的网站无法访问，没有帮助我到达我的 API 端点）

ASP.NET Core 3.0 Controller 路由不起作用（答案中的代码已经在我的解决方案中，并且调试控制器工作正常，只有在部署时才会出现问题）

In Blazor WebAssembly solution, how to host the Blazor WASM client app on a different port to the server API (This guy is just trying to add "/api" to his controller routing, which is already part of my routing scheme and not the issue据我所知）

Asp.net 核心部署在服务器上不起作用但在机器上工作（我已经为“anyCPU”编译）

可能是我目前无法轻易找到的其他人......一直在调试并尝试修复这个问题超过 10 个小时。 我不知道问题是什么，甚至开始能够修复它，而且我在网上找不到任何人有同样的问题。

最后，一个实际错误本身的示例，其中提到了站点名称已编辑 - 这是当我进行 API 调用时发生的情况，并为我的错误页面获取 HTML 作为响应，然后尝试将其转换为 INT，因为在 a.razor 页面中转换之前，它没有被任何错误处理捕获：

System.FormatException: Input string was not in a correct format. at System.Number.ThrowOverflowOrFormatException (System.Boolean overflow, System.String overflowResourceKey) <0x35ec788 + 0x0002a> in <filename unknown>:0 at System.Number.ParseInt32 (System.ReadOnlySpan`1[T] value, System.Globalization.NumberStyles styles, System.Globalization.NumberFormatInfo info) <0x35c2c58 + 0x00048> in <filename unknown>:0 at System.Int32.Parse (System.String s, System.IFormatProvider provider) <0x35ebd38 + 0x00030> in <filename unknown>:0 at System.Convert.ToInt32 (System.String value) <0x35ebcf0 + 0x00016> in <filename unknown>:0 at REDACTED.Client.Pages.MainApplication.OnInitializedAsync () [0x00157] in C:\Users\codef\source\repos\REDACTED\REDACTED\Client\Pages\MainApplication.razor:100

RETURNED VALUE FROM API CALL: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title>REDACTED</title> <meta property="og:title" content="REDACTED" /> <meta property="og:type" content="website" /> <meta property="og:url" content="https://REDACTED.com" /> <meta property="og:image" content="https://REDACTED.com/Promotional/Screenshots/Raw/Analysis%20Portfolio_7.png" /> <base href="/" /> <link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" /> <link href="css/app.css" rel="stylesheet" /> <link href="css/Table.css" rel="stylesheet" /> <link href="_content/Blazor.ContextMenu/blazorContextMenu.min.css" rel="stylesheet" /> <link rel="stylesheet" href="_content/Radzen.Blazor/css/default-base.css"> <link href="//cdn-images.mailchimp.com/embedcode/slim-10_7.css" rel="stylesheet" type="text/css"> </head> <body> <app>Loading...</app> <div id="blazor-error-ui"> An unhandled error has occurred. <a href="" class="reload">Reload</a> <a class="dismiss">🗙</a> </div> <script src="_framework/blazor.webassembly.js"></script> <script src="_content/Blazor.ContextMenu/blazorContextMenu.min.js"></script> <script src="plotly-latest.min.js"></script> <script src="JavaScript.js"></script> <script src="_content/Radzen.Blazor/Radzen.Blazor.js"></script> <script> window.scrollToElementId = (elementId) => { console.info('scrolling to element', elementId); var element = document.getElementById(elementId); if (!element) { console.warn('element was not found', elementId); return false; } element.scrollIntoView(); return true; } </script> <style type="text/css"> #mc_embed_signup { background: #fff; clear: left; font: 14px Helvetica,Arial,sans-serif; } </style> </body> </html>

Answer 1

我在 apache 上运行时确实遇到了麻烦。 在我的情况下是因为 Blazor index.html 不在服务器根目录中。

我的 index.html 在 /app

所以我在每个页面指令前加上 Pages/，如下所示：

@page "/Pages/SupportRequest"

然后在 httpd.conf

RewriteEngine on
RewriteRule "^/app/Pages/.*$" "/app/index.html"

和索引。html

    <base href="/app/" />

注意：在项目的 index.html 中，它仍然需要：

    <base href="/" />

因此您必须在部署期间进行更改