asp.net core 的 razor pages 如何使用ajax调用后台方法

Razor 是一种允许您向网页中嵌入基于服务器的代码(Visual Basic 和 C#)的标记语法。

当网页被写入浏览器时,基于服务器的代码能够创建动态内容。

在网页加载时,服务器在向浏览器返回页面之前,会执行页面内的基于服务器代码。

由于是在服务器上运行,这种代码能执行复杂的任务,比如访问数据库。

 

razor pages 的渲染是由服务器完成的,后端Razor直接渲染模版,这就会导致服务器端的压力,

所以在遇到数据量过大的地方,还是由前端来渲染比较好,这就牵涉到了如何利用ajax调用 razor pages的后端代码了,

基于我的搜索结果,方式有两种:

 

方式一

参考:https://www.jb51.net/article/133437.htm

参考:http://www.cnblogs.com/mebius4789/p/8685755.html

这个方式我个人认为比麻烦,大家可以自行查看链接

 

方式二

参考:https://www.learnrazorpages.com/security/request-verification#ajax-post-requests

这个方式也是我接受的方式:

操作步骤如下:

1、Startup文件的ConfigureServices方法,添加下段:

services.AddMvc().AddRazorPagesOptions(o =>
{
    o.Conventions.ConfigureFilter(new IgnoreAntiforgeryTokenAttribute());
});

整体如下:

 services.AddMvc()
                    .SetCompatibilityVersion(CompatibilityVersion.Version_2_1)
                    .AddRazorPagesOptions(o =>
                     {
                         o.Conventions.ConfigureFilter(new IgnoreAntiforgeryTokenAttribute());
                     });

2、Ajax请求

var postSubmit = $.ajax({
    type: "POST",
    url: "/yourformhandler",
    data: JSON.stringify({ ... }),
    contentType: "application/json"
}).done(function(response){
    //...
});

 

举个栗子:

后端代码:

public class Index1Model : PageModel
    {
        public void OnGet()
        {

        }

        //url:"Index"
        public IActionResult OnPost([FromBody]MyClass my)
        {
            return new JsonResult("Hello Response Back");
        }

        //url: "Index?handler=Send"
        public ActionResult OnPostSend([FromBody] MyClass my)
        {
            return new JsonResult(my);
        }

        public class MyClass
        {
            public int speakerId { get; set; }
            public bool currentYear { get; set; }
        }
    }

前端Ajax调用:

Index1

@section Scripts { }

 

转载于:https://www.cnblogs.com/Mindy-hym/p/10119334.html

你可能感兴趣的:(asp.net core 的 razor pages 如何使用ajax调用后台方法)