使用AJAX POST获取Razor Pages Partial视图返回404如何解决

解决方案 #

该需求完全可以在Razor Pages中实现，你遇到的404错误核心是路由规则不匹配、请求配置错误导致的，按照以下步骤排查修正即可：

1. 修正Razor Pages路由匹配逻辑 #

Razor Pages的路由默认和项目Pages目录下的文件路径绑定：

• 如果你要请求的处理器写在Pages/XXX.cshtml.cs中，请求的基础URL就必须是/XXX，不能随便自定义
• 命名处理器的匹配规则为On[请求方法][处理器名]，请求时需通过handler参数指定处理器名，匹配不区分大小写
• 如果你是在现有页面（比如首页Index.cshtml）中加的处理器，请求URL就应该是/Index，而非自定义的/myawesomeurl

2. 修正后台处理方法写法 #

你当前用了void作为返回值，无法返回分部视图内容，需要调整为：

// 方法名按照规则写，参数对应你前端传的参数
public IActionResult OnPostMyawesomeurl(string myawesomeparameter01, string myawesomeparameter02)
{
    // 你的业务逻辑写在这里
    // 返回分部视图，第一个参数为分部视图的路径，分部视图默认不带布局
    return Partial("_你要返回的分部视图名称");
}

3. 修正前端JS代码 #

你当前JS存在两处明显错误：

• 给div赋值时错误使用了逗号，应该用点调用innerHTML属性
• 要确认自定义AJAX对象的go方法默认发送的是POST请求，如果默认发GET，需要将后台方法前缀改为OnGet，或者调整AJAX对象的请求方法为POST
  调整后的JS代码：

// 此处URL替换为你对应Razor页面的真实路径，比如处理器写在Index.cshtml.cs里就填/Index
var myawesomeajaxobject = new ajax('/对应Razor页面的路径');
myawesomeajaxobject.done = function(dat) {
    // 把逗号改成点
    document.getElementById('myawesomediv').innerHTML = dat;
}
// handler参数值和后台方法名中OnPost/OnGet后面的部分保持一致即可
myawesomeajaxobject.go('handler=Myawesomeurl&myawesomeparameter01=1&myawesomeparameter02=2');

4. 排查特殊规则影响 #

你提到自定义AJAX对象会自动在URL末尾加?和时间戳，需要打开浏览器开发者工具的「网络」面板，确认最终发出的请求中：

• 没有出现两个?导致参数解析错误（比如/xxx?123456&handler=xxx是正确格式，/xxx?123456?handler=xxx就是错误格式，会导致handler参数丢失）
• 请求头中的请求方法和后台处理器前缀匹配
• handler参数被正确传递

按照以上步骤调整后即可解决404问题，正常渲染分部视图。

内容的提问来源于stack exchange，提问作者sanepete