跨域调用WebApi
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了跨域调用WebApi相关的知识,希望对你有一定的参考价值。
1. WebApi 和WebConfig 设置
using Libaray.DAL.Services; using Libaray.Models.Entities; using System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Net.Http; using System.Web.Http; namespace Libaray.WebApi.Controllers { /// <summary> /// 图书信息 /// </summary> public class BookController : ApiController { BookService BookDAL = new BookService(); /// <summary> /// 查询所有图书信息 /// </summary> /// <returns></returns> public IQueryable<BookModel> Get() { return BookDAL.FindList<BookModel>().AsQueryable(); } /// <summary> /// 查询制定Id的图书信息 /// </summary> /// <param name="id">图书Id</param> /// <returns>查询到的图书信息</returns> public BookModel Get(string id) { Guid BookId = Guid.Parse(id); return BookDAL.Find(u => u.BookId == BookId); } } }
<system.webServer> <handlers> <remove name="ExtensionlessUrlHandler-Integrated-4.0" /> <remove name="OPTIONSVerbHandler" /> <remove name="TRACEVerbHandler" /> <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" /> </handlers> <validation validateIntegratedModeConfiguration="false" /> <modules> <remove name="ApplicationInsightsWebTracking" /> <add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" preCondition="managedHandler" /> </modules> <httpProtocol> <!-- 重点开始 --> <customHeaders> <add name="Access-Control-Allow-Origin" value="*" /> <add name="Access-Control-Max-Age" value="30"/> <add name="Access-Control-Allow-Methods" value="GET,POST,OPTIONS"/> <add name="Access-Control-Allow-Headers" value="Content-Type, Accept" /> </customHeaders> </httpProtocol> <!-- 重点结束 --> </system.webServer>
2. MVC
@{ ViewBag.Title = "FindBook"; Layout = "~/Views/Shared/_Layout.cshtml"; } <h2>FindBook</h2> <div class="table-responsive"> <table class="table table-striped table-hover"> <thead> <tr> <td>Book Name</td> <td>Author</td> </tr> </thead> <tbody id="tb"> </tbody> </table> </div> <script type="text/javascript"> $(function () { $.getJSON("http://localhost:50159/api/book", function (data) { $.each(data, function (key, item) { $("#tb").append("<tr><td>" + item.BookName + "</td>" + "<td>" + item.Author + "</td></tr>"); }); }); }) </script>
以上是关于跨域调用WebApi的主要内容,如果未能解决你的问题,请参考以下文章