Embed uno single page to existing aspnet project

[jingliancui]

Hi everyone,
I have an aspnet mvc app was already published in server.
May i know is it possible to embed uno page to this project?

Example case:
Home/Index is cshtml.
When user click a hyper link in this page, Then navigate to the uno page which is wasm page.

[jeromelaban]

Thanks for the question!

You can place an uno app as a page of an asp.net site, like any other static page. You'll need to set the WasmShellWebAppBasePath property to ensure that the app will load properly.

Placing an uno app in an iframe is also possible.

[jingliancui]

Thank you! @jeromelaban
But I occurred some an error while I try below, could you help of if any document can guide me on how to embed uno wasm to existing mvc project:
1.
dotnet new unoapp -o MAUILibraryMenu -platforms "wasm" -renderer "native" -server -vscode -pwa False -toolkit False -theme-service

2. copy the MAUILibraryMenu folder to my existing mvc project's parent folder.
3. mvc project add MAUILibraryMenu project reference.
4. copy .editorconfig .vsconfig .gitignore Directory.Build.props Directory.Build.targets Directory.Packages.props global.json to MAUILibraryMenu folder
5. copy global.json to mvc project's parent folder for fix compile error
6. try to build the mvc app.
7. MAUILibraryMenu.dll build fine
8. can not run with below error:

/usr/local/share/dotnet/sdk/9.0.300/Sdks/Microsoft.NET.Sdk.StaticWebAssets/targets/Microsoft.NET.Sdk.StaticWebAssets.targets(615,5): error : Conflicting assets with the same target path 'favicon#[.{fingerprint}]?.ico'. 
For assets 'Identity: /Users/ericcui/Desktop/GitHubWorkspace/ECentHome/src/HomeWeb/HomeWeb/wwwroot/favicon.ico, SourceType: Discovered, SourceId: HomeWeb, ContentRoot: /Users/ericcui/Desktop/GitHubWorkspace/ECentHome/src/HomeWeb/HomeWeb/wwwroot/, BasePath: _content/HomeWeb, RelativePath: favicon#[.{fingerprint}]?.ico, AssetKind: All, AssetMode: All, AssetRole: Primary, AssetRole: , AssetRole: , RelatedAsset: , AssetTraitName: , AssetTraitValue: , Fingerprint: 61n19gt1b8, Integrity: Jtxf9L+5ITKRc1gIRl4VbUpGkRNfOBXjYTdhJD4facM=, FileLength: 5430, LastWriteTime: 2025/2/25 16:58:21 +00:00, CopyToOutputDirectory: Never, CopyToPublishDirectory: PreserveNewest, 
OriginalItemSpec: wwwroot/favicon.ico' and 'Identity: /Users/ericcui/Desktop/GitHubWorkspace/ECentHome/src/HomeWeb/MAUILibraryMenu/obj/Debug/net9.0-browserwasm/unoresizetizer/AppIcons/favicon.ico,
 SourceType: Project, SourceId: MAUILibraryMenu, ContentRoot: /Users/ericcui/Desktop/GitHubWorkspace/ECentHome/src/HomeWeb/MAUILibraryMenu/obj/Debug/net9.0-browserwasm/unoresizetizer/AppIcons/, BasePath: /,
 RelativePath: favicon#[.{fingerprint}]?.ico, AssetKind: All, AssetMode: All, AssetRole: Primary, AssetRole: , AssetRole: , RelatedAsset: , AssetTraitName: , AssetTraitValue: , Fingerprint: mh1nzsk930, Integrity: tiWUjoFlGN+7+fEV0NuJXlIMpTS5DqlgGs4y5BCT3F8=, FileLength: 4212, LastWriteTime: 2025/6/19 15:25:50 +00:00
, CopyToOutputDirectory: PreserveNewest, CopyToPublishDirectory: PreserveNewest, OriginalItemSpec: /Users/ericcui/Desktop/GitHubWorkspace/ECentHome/src/HomeWeb/MAUILibraryMenu/obj/Debug/net9.0-browserwasm/unoresizetizer/AppIcons/favicon.ico' from different projects. [/Users/ericcui/Desktop/GitHubWorkspace/ECentHome/src/HomeWeb/HomeWeb/HomeWeb.csproj]

[jeromelaban]

Note that MAUI embedding is not available for WebAssembly, it is only available for ios/android/winappsdk.

I'm not sure to see exactly what you're trying to do, it would be best if you were to create a repro so we can talk about the same behavior.

Thanks.

[jingliancui]

Hi @jeromelaban
Apologize that make you confuse, not maui embedding, just the uno project name is "MAUILibraryMenu".

Here is the repro:
Sample.zip

Vscode to open it and click the run button, the error will be shown.

Some background about this use case:
Due to I have a aspnet mvc project already run in server for some years, at this time, I want to add some feature to this project by using uno, due to team have tech in dotnet and xaml.
That's why I want to add uno app to mvc sln, instead of add mvc app to uno sln, thanks.

[jingliancui]

I try to search about your first response:
https://platform.uno/docs/articles/external/uno.wasm.bootstrap/doc/features-embedded.mode.html#browser-embedded-mode
By default, the project is launched with a HTML page (index.html). This mode is used for SPAs (Single Page Applications), but does not allow embedding into an existing webpage or application.
Is this one the solution?

[jeromelaban]

Thanks for the repro.

By default, uno supports an integration into an ASP.NET Core app that is placed at the root, and only provides an API.

If you want to have your app setup with a different root, you'll need the following in the Uno app:

<PropertyGroup>
   <WasmShellWebAppBasePath>./</WasmShellWebAppBasePath>
   <StaticWebAssetBasePath>app</StaticWebAssetBasePath>
</PropertyGroup>

Add add the following in your ASP.NET Core app (before UseHttpsRedirection()):

app.UseStaticFiles(new StaticFileOptions
{
    OnPrepareResponse = context =>
    {
        IHeaderDictionary headers = context.Context.Response.Headers;
        string contentType = headers["Content-Type"];
        if (contentType == "application/x-gzip")
        {
            if (context.File.Name.EndsWith("js.gz"))
            {
                contentType = "application/javascript";
            }
            else if (context.File.Name.EndsWith("css.gz"))
            {
                contentType = "text/css";
            }
            headers.Add("Content-Encoding", "gzip");
            headers["Content-Type"] = contentType;
        }
    }
});

As there is a decoding issue with web assets provided by a separate app, where the decoding does not happen properly.