常用的方式有 js –> WebService , js->*.ashx, js->WebAPI, js->MVC Controller->Action. 前两种就不说了.
一、Webform中 js-> WebAPI .
1.在需要的地方,直接添加WebAPI
2.在Global.asax中设置一下.
public class Global : System.Web.HttpApplication
{ void Application_Start(object sender, EventArgs e)
{
RouteTable.Routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
RouteTable.Routes.IgnoreRoute("{resource}.aspx/{*pathInfo}"); //api
var route = RouteTable.Routes.MapHttpRoute(name: "DefaultApi",
routeTemplate: "api/{controller}/{action}/{id}", defaults: new { id = RouteParameter.Optional });
route.RouteHandler = new SessionStateHttpControllerRouteHandler();
3.改一下WebAPI,需要理解FormBody,FromUri的区别.返回Json还是xml格式,是根据请求时的ContentType决定的.
public class UserController : ApiController
{
// GET api/<controller>
public IEnumerable<string> Get()
{
return new string[] { "value1", "value2" };
} // GET api/<controller>/5
[HttpGet()]
//[ActionName("getValue")]
public string GetById([FromBody]dynamic obj)
{
var session = HttpContext.Current.Session;
var user = HttpContext.Current.User;
return "value" + "aabbccdd";
} // POST api/<controller>
[HttpPost]
public object Test(dynamic value)
{
var x = value["A"];
return x;
}
4,js调用 WebAPI方法,注意发送数据的格式.是字符串,不是Json.
function test() {
var options = {};
options.url = "/api/user/Test";
options.type = "post";
options.data =
JSON.stringify
({ 'A': 1, 'B': 2 });
options.contentType = "application/json";
options.success = function (customer) {
alert(customer);
};
options.error = function (err) { alert(err.statusText); };
$.ajax(options);
};
function submitForm() {
var s = $("#from1").serializeArray();
alert(s);
var options = {};
options.url = "/api/user/submit";
options.type = "post";
options.contentType = "application/json";
options.data = JSON.stringify(s);
options.success = function (customer) {
alert(customer);
};
options.error = function (err) { alert(err.statusText); };
$.ajax(options);
}
二,webform 中 js-> asp.net mvc
1,在webform中添加 asp.net mvc相关的程序集引用.建议直接从asp.net mvc项目拷贝引用.
2,在web.config中需要设置作这些设置.
<compilation debug="true" targetFramework="4.0" >
<assemblies>
<add assembly="System.Web.Abstractions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
<add assembly="System.Web.Helpers, Version=2.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
<add assembly="System.Web.Routing, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
<add assembly="System.Web.Mvc, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
<add assembly="System.Web.WebPages, Version=2.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
</assemblies>
</compilation>
<pages>
<namespaces>
<add namespace="System.Web.Helpers" />
<add namespace="System.Web.Mvc" />
<add namespace="System.Web.Mvc.Ajax" />
<add namespace="System.Web.Mvc.Html" />
<add namespace="System.Web.Routing" />
<add namespace="System.Web.WebPages"/>
</namespaces>
</pages>
3,在webform程序中,添加一个controller
4,在Global.asax.cs中添加mvc路由
public class Global : System.Web.HttpApplication
{ void Application_Start(object sender, EventArgs e)
{
RouteTable.Routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
RouteTable.Routes.IgnoreRoute("{resource}.aspx/{*pathInfo}"); //mvc
RouteTable.Routes.MapRoute(
name: "Default",
url: "mvc/{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
}
5,在controller中添几个测试方法,同样需要注意js调用时的数据格式,默认只接收post调用.get请求时.需设置JsonRequestBehavior.AllowGet
public class HomeController : Controller
{
public JsonResult Index()
{
ViewBag.Message = "修改此模板以快速启动你的 ASP.NET MVC 应用程序。"; return Json(,JsonRequestBehavior.AllowGet);
} public JsonResult About()
{
ViewBag.Message = "你的应用程序说明页。";
return Json("aaa");
} public ActionResult Contact(int age,string name)
{
ViewBag.Message = "你的联系方式页。";
return Json("bbbbbbbbbbbbb");
}
6,添加测试js
function mvcpost() {
var options = {};
options.url = "/mvc/home/Contact";
options.type = "post";
options.data = JSON.stringify({ 'age': 1, 'name': 'xiaowy' });
options.contentType = "application/json";
options.success = function (customer) {
alert(customer);
};
options.error = function (err) { alert(err.statusText); };
$.ajax(options);
}
在上面的代码中,用到了一个自定义的类 SessionStateHttpControllerHandler. 这个是为了在Web API中使用 session.
public class SessionStateHttpControllerHandler : HttpControllerHandler, IRequiresSessionState
{
public SessionStateHttpControllerHandler(RouteData routeData)
: base(routeData)
{ }
} public class SessionStateHttpControllerRouteHandler : HttpControllerRouteHandler
{
protected override IHttpHandler GetHttpHandler(RequestContext requestContext)
{
return new SessionStateHttpControllerHandler(requestContext.RouteData);
}
}
如果你照上面的步骤仍然不成功,那就下载这个,自己修改一下.