使用 AJAX POST 返回部分剃刀页面

Question

我已经搜索过这个，尝试了从 stackoverflow 建议的问题中接受的解决方案可能有效，在尝试了我能想到或找到的一切之后，我在这里作为最后的手段。 我想要一个按钮在我的剃刀页面上发送一个帖子请求，通过我必须使用的 ajax 函数，并返回一个没有布局的剃刀页面。

HTML

<button id="myawesomebutton">Go get a partial</button>

javascript

 var myawesomeajaxobject=new ajax('/myawesomeurl');
 myawesomeajaxobject.done=function(dat)
 {
  document.getElementById('myawesomediv'),innerHTML=dat
 }
 myawesomeajaxobject.go('myawesomeparameter01=1&myawesomeparameter02=2');

我必须使用的 AJAX 对象添加了以下标头：

   Content-type, application/x-www-form-urlencoded
   Access-Control-Allow-Origin, *

以及添加一个'?' 后跟一个指向 url 端点的 unix 时间码。

我的理解是请求必须首先发送到 razor 页面后面的 cshtml.cs 类，然后重定向到我的部分。

无论我为 C# 方法命名，onPost、myawesomeurl 还是许多其他名称，我都会收到 404 错误，而不是在myawesomediv中呈现部分。

我试图添加一个防伪令牌，将服务器上的 CORS 值设置为“全部接受”，并尝试将请求直接发送到部分的 onPost，但我无处可去。

更新。

我已经添加了：

services.AddRazorPages().AddRazorPagesOptions(options =>
{
    options.Conventions.ConfigureFilter(new IgnoreAntiforgeryTokenAttribute());
});

到我的启动。

我的 javascript 内容如下：

var myawesomeajaxobject=new ajax('/myawesomeurl');
myawesomeajaxobject.done=function(dat)
{
 document.getElementById('myawesomediv'),innerHTML=dat
}
myawesomeajaxobject.go('handler=myawesomeurl&myawesomeparameter01=1&myawesomeparameter02=2');

这是cshtml.cs文件中的处理程序方法：

public void OnPostmyawesomeurl()
{
  //myawesomecoded added, so I have a break point to hit.       
}

而且我仍然收到 404。这在剃须刀页面中是否真的可行？

Answer 1

看起来您正在向命名处理程序方法发出 POST 请求。 处理程序仍然需要On[Http Method]其名称中包含On[Http Method]以便可以找到它。 如果是 POST 请求，则处理程序方法的名称应为OnPostMyAwesomeUrl 。

您还需要处理 Razor 页面内置请求验证这一事实，因此您需要在 AJAX 请求中包含令牌 ( https://www.learnrazorpages.com/security/request-verification#ajax-post- requests-and-json ），或完全禁用该页面（ https://www.learnrazorpages.com/security/request-verification#opting-out ）：

[IgnoreAntiforgeryToken(Order = 1001)]
public class IndexModel : PageModel
{
    ...
}

Answer 2

感谢大家的投入。 这就是我达到预期结果的方式。

HTML

<button id="myawesomebutton">Go get a partial</button>

javascript

var myawesomeajaxobject=new ajax('/myawesomeurl');
myawesomeajaxobject.done=function(dat)
{
 document.getElementById('myawesomediv'),innerHTML=dat
}
myawesomeajaxobject.go('/shared/myawesomepartial/?handler=myawesomehandler&myawesomeparameter01=1&myawesomeparameter02=2');

启动

services.AddRazorPages().AddRazorPagesOptions(options =>
{
 options.Conventions.ConfigureFilter(new IgnoreAntiforgeryTokenAttribute());
});

myawesomepartial.cshtml.cs

public void OnPostmyawesomehandler(MyAwesomeModel myawesomemodel)
{
  //Do something with myawesomemodel and return myawesomepartial.cshtml
}

这只是使 URL 和端点方法名称匹配的问题。