代码之家 › 专栏 › 技术社区 › Murdock

相对路径上的.Net核心Spa资源路由

asp.net-core-2.1 middleware single-page-application url-routing asp.net-core

Murdock · 技术社区 · 7 年前

我配置了以下.net核心spa应用程序

    public void Configure(IApplicationBuilder app, IHostingEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
            app.UseDatabaseErrorPage();
        }
        else
        {
            app.UseExceptionHandler("/Home/Error");
            // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
            app.UseHsts();
        }

        app.UseHttpsRedirection();
        app.UseStaticFiles();
        app.UseSpaStaticFiles();
        app.UseCookiePolicy();

        app.UseAuthentication();


        app.UseMvc(routes =>
        {
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");


            routes.MapRoute(
                name: "catch",
                template: "{*url}",
                defaults: new { controller = "Home", action = "Index" });
        });

        app.UseSpa(spa =>
        {
            spa.Options.SourcePath = "Spa";
            spa.Options.DefaultPage = "/home/index";
        });
    }

例如,当我的初始网址是 https://localhost:44380/ ,正确地从

但是当我的初始url是 https://localhost:44380/administration/user-profiles ,错误地从以下位置获取图像: https://localhost:44380/administration/

这是那个“x”的css

.chosen-container-multi .chosen-choices .search-choice .search-choice-close {
    background: url("chosen-sprite.png") right top no-repeat;
    display: block;
    font-size: 1px;
    height: 10px;
    position: absolute;
    right: 4px;
    top: 5px;
    width: 12px;
    cursor: pointer; }

0 回复 | 直到 7 年前

Murdock 7 年前

最终,这个方法成功了

        app.UseHttpsRedirection();  

        app.Use((context, next) =>
        {
            if (!string.IsNullOrWhiteSpace(System.IO.Path.GetExtension(context.Request.Path)))
            {
                context.Request.Path = Invariant($"/{System.IO.Path.GetFileName(context.Request.Path)}");
            }
            return next();
        });

        app.UseStaticFiles();

-1

jazzmasterkc 7 年前

换言之,使用~/引用根目录 https://localhost:44380

-1

Pablo Recalde 7 年前

这是最重要的 浏览器的默认行为

你在css上使用的是相对路径

background: url("chosen-sprite.png") right top no-repeat;

根据规范:

部分URL是相对于样式表的源进行解释的,而不是相对于文档

https://localhost:44380/administration/ (您可以在devtools网络面板上进行检查)浏览器将尝试从那里加载图像。

关于这个问题,这里有更多的信息 stack overflow question that I found