1 前端jquery ajax post 方式访问web api的方法
$.ajax({
type: 'POST',
contentType: "application/x-www-form-urlencoded",
url: 'http://localhost:57181/api/MyWebAPI/GetTaoCanOnHttpPost',
data: { id: categoryid ,name:'helenzhou'},
dataType: 'json',
success: function (data) {
var tt = "";
$.each(data, function (k, v) {
tt += '<div style="height:120px;">' +
'<img src="' + v.taoCanIMGUrl + '" style="width:100px;height:100px;float:left;"/>' +
'<ul style="float:left;list-style: none;padding-left: 10px">' +
'<li>' + v.name + '</li>' +
'<li>' + v.price + '</li>' +
'<li onclick="AddToCart(' + v.taoCanId + ',' + v.price + ',\'' + v.name + '\');">加入购物车</li></ul></div>';
});
$("#div_taocan").html(tt);
}
});
2 在MyWebAPIController : ApiController类里
[HttpPost]
public List<TaoCan> GetTaoCanOnHttpPost([FromBody]JObject obj)
{
//var name =obj["name"].ToString();
//var id =obj["id"].ToString();
var taoCanCategoryId =new System.Data.SqlClient.SqlParameter("@taoCanCategoryId",
System.Data.SqlDbType.Int, 0, System.Data.ParameterDirection.Input,
0, 0, "taoCanCategoryId", System.Data.DataRowVersion.Current, false, null, "", "", "");
taoCanCategoryId.Value = Convert.ToInt32(obj["id"].ToString());
var list = db.Database.SqlQuery<TaoCan>(@"SELECT [taoCanId]
,[name]
,[price]
,[isOnline]
,[AddTime]
,[ModifyTime]
,[taoCanCategoryId]
,[taoCanIMGUrl]
FROM [dbo].[TaoCan]
where taoCanCategoryId =@taoCanCategoryId
", taoCanCategoryId).ToList();
return list;
}
3 web.config文件节点 <system.webServer> 配置允许跨域
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
</customHeaders>
</httpProtocol>