ASP.NET Core Razor Pages中URL Slug的斜杠/被转换为%2F的原因及解决方案咨询

我来帮你梳理下这个问题的核心原因，以及几个可行的解决方案，帮你彻底搞定这个URL编码的坑：

为什么会出现这个问题？ #

核心原因很简单：斜杠（/）在URL里是天然的路径分隔符，浏览器和ASP.NET Core的路由系统默认都会把它当成拆分路径段的标记，而不是你slug的一部分。

举个例子，当你把en/learn-english-in-99-days放在URL路径里时：

• 浏览器可能会自动把编码后的%2F解码回/，导致URL被拆成CourseDetails、en、learn-english-in-99-days三个路径段；
• ASP.NET Core路由解析时，会把这三个段分别识别为页面名和两个独立参数，而你数据库里存的是完整的en/learn-english-in-99-days作为单个slug，自然匹配不上，返回404。

这种编码/解码的不一致，本质是因为你把路径分隔符当成了业务字符来使用，违反了URL的设计规范，所以才会出现各种奇怪的问题。

解决方案（按推荐程度排序） #

1. 调整路由结构，拆分culture和slug（最推荐） #

这是最符合URL设计规范的方案，彻底从根源上避免编码问题：

• 把culture和slug拆成两个独立的路由参数，比如路由定义为CourseDetails/{culture}/{slug}；
• 数据库里可以继续存culture/slug格式的字符串，或者分开存culture和slug（更灵活）。

具体操作：
在你的CourseDetails.cshtml页面顶部指定路由：

@page "{culture}/{slug}"

然后在后台OnGet方法中接收两个参数，组合后查询数据库：

public IActionResult OnGet(string culture, string slug)
{
    // 组合成数据库里的slug格式
    var fullSlug = $"{culture}/{slug}";
    // 用fullSlug查询对应的课程
    var course = _dbContext.Courses.FirstOrDefault(c => c.Slug == fullSlug);
    
    if (course == null)
    {
        return NotFound();
    }
    // 后续逻辑
    return Page();
}

这样你的URL就是https://localhost:7213/CourseDetails/en/learn-english-in-99-days，服务器会正确解析culture和slug参数，组合后和数据库里的格式完全匹配，再也不会有编码问题。

2. 改用查询参数传递slug #

如果你不想调整路由结构，可以把slug放在查询参数里，而不是路径中。查询参数里的斜杠不会被当作路径分隔符，编码/解码的处理更稳定。

比如URL变成：

https://localhost:7213/CourseDetails?slug=en/learn-english-in-99-days

后台接收参数的代码：

public IActionResult OnGet(string slug)
{
    // 直接用slug查询数据库，ASP.NET Core会自动处理查询参数的解码
    var course = _dbContext.Courses.FirstOrDefault(c => c.Slug == slug);
    
    if (course == null)
    {
        return NotFound();
    }
    // 后续逻辑
    return Page();
}

生成URL的时候，用Url.Page方法确保正确编码：

// 在页面或后台生成跳转URL
var courseUrl = Url.Page("CourseDetails", new { slug = "en/learn-english-in-99-days" });

生成的URL会自动把斜杠编码成%2F，但服务器接收查询参数时会自动解码回/，完美匹配数据库里的slug。

3. 配置ASP.NET Core允许路径中的%2F不自动解码（不推荐，仅作备选） #

如果你必须把带斜杠的slug放在路径里，可以配置ASP.NET Core的路由选项，禁止自动解码路径中的%2F，同时使用捕获所有路由来获取完整的slug。

在Program.cs里添加路由配置：

var builder = WebApplication.CreateBuilder(args);

// 配置路由选项，禁止自动解码路径中的斜杠编码
builder.Services.Configure<RouteOptions>(options =>
{
    options.EncodeSlashInPath = false;
});

// 其他服务配置...

var app = builder.Build();

// 中间件配置...
app.MapRazorPages();

app.Run();

然后在CourseDetails.cshtml里使用捕获所有路由：

@page "{*slug}"

后台OnGet方法中手动解码slug：

public IActionResult OnGet(string slug)
{
    // 手动解码%2F为/
    var decodedSlug = Uri.UnescapeDataString(slug);
    // 用decodedSlug查询数据库
    var course = _dbContext.Courses.FirstOrDefault(c => c.Slug == decodedSlug);
    
    if (course == null)
    {
        return NotFound();
    }
    // 后续逻辑
    return Page();
}

注意：这个方案有个缺点，捕获所有路由（{*slug}）会优先匹配其他路由，可能影响你的其他页面路由，需要仔细调整路由顺序，所以不是最优解。

总结 #

优先选择拆分路由参数的方案，既符合URL设计规范，又能彻底解决编码问题，后续维护也更简单。如果实在无法调整路由，再考虑用查询参数的方式，尽量避免第三种配置路由选项的方案，容易引入其他问题。

备注：内容来源于stack exchange，提问作者Naved