C# ASP.NET MVC構成によりドメイン間アクセスが可能
7252 ワード
ASPを有効にする.NET Coreにおけるドメイン間要求(CORS)ASP.NET Coreドメイン間要求の有効化(CORS)
【注意:ajax jsonリクエストのみを制限でき、ajax jsonpリクエストを制限できません.hostファイルをローカルに変更し、異なるドメイン名を構成し、テストを繰り返し確認しました.】ASP.NET Web APIプロジェクトでは、Cross Origin Resource Sharing(CORS)を使用して、ドメイン間要求の問題を解決し、AjaxでWeb APIインタフェースを直接呼び出すことができます.
1、管理NuGetはMicrosoftを参照する.AspNet.Cors注:OWINで参照する必要があるのはMicrosoftです.AspNet.WebApi.Cors
2.WebApiConfigファイルにドメイン間メソッド構成を追加する
*************************************************************************************************************************************【注意:ウェブapi項目に上記の情報が配置されていれば、ドメインをまたいでインタフェースに要求することは可能ですが、データを返すことはできません.エラーメッセージを提示します.ウェブapi項目のウェブ.configファイルのhttp Protocolノードを削除することを考慮してください】 ***************************************************************************************************************** ******** ******** ******** ********
web.configファイルのsystem.WebServerノードでは、次の構成を追加します.
サイトを指定してドメイン間アクセスを許可する(ベースクラス)
Controllerによるドメイン間アクセスの許可の指定
アクションを指定してドメイン間アクセスを許可
htmlページ
XMLHttpRequest(オリジナル)
D:MyFileテスト項目Solution 1WebApplication 1
【注意:ajax jsonリクエストのみを制限でき、ajax jsonpリクエストを制限できません.hostファイルをローカルに変更し、異なるドメイン名を構成し、テストを繰り返し確認しました.】ASP.NET Web APIプロジェクトでは、Cross Origin Resource Sharing(CORS)を使用して、ドメイン間要求の問題を解決し、AjaxでWeb APIインタフェースを直接呼び出すことができます.
1、管理NuGetはMicrosoftを参照する.AspNet.Cors注:OWINで参照する必要があるのはMicrosoftです.AspNet.WebApi.Cors
2.WebApiConfigファイルにドメイン間メソッド構成を追加する
using System.Linq;
using System.Web.Http;
using System.Web.Http.Cors;
namespace WebApplication1
{
public static class WebApiConfig
{
public static void Register(HttpConfiguration config)
{
var allowOrigin = ConfigurationManager.AppSettings["cors:allowOrigin"];
var allowHeaders = ConfigurationManager.AppSettings["cors:allowHeaders"];
var allowMethods = ConfigurationManager.AppSettings["cors:allowMethods"];
//config.EnableCors(new EnableCorsAttribute("*", "*", "*"));
config.EnableCors(new EnableCorsAttribute(allowOrigin, allowHeaders, allowMethods));
config.MapHttpAttributeRoutes();
config.Routes.MapHttpRoute(
name: "DefaultApi",
routeTemplate: "api/{controller}/{id}",
defaults: new { id = RouteParameter.Optional }
);
}
}
}
*************************************************************************************************************************************【注意:ウェブapi項目に上記の情報が配置されていれば、ドメインをまたいでインタフェースに要求することは可能ですが、データを返すことはできません.エラーメッセージを提示します.ウェブapi項目のウェブ.configファイルのhttp Protocolノードを削除することを考慮してください】 ***************************************************************************************************************** ******** ******** ******** ********
web.configファイルのsystem.WebServerノードでは、次の構成を追加します.
サイトを指定してドメイン間アクセスを許可する(ベースクラス)
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace WebApplication1.App_Start
{
public class AllowOriginAttribute
{
public static void onExcute(ControllerContext context, string[] AllowSites)
{
var origin = context.HttpContext.Request.Headers["Origin"];
Action action = () =>
{
context.HttpContext.Response.AppendHeader("Access-Control-Allow-Origin", origin);
};
if (AllowSites != null && AllowSites.Any())
{
if (AllowSites.Contains(origin))
{
action();
}
}
}
}
public class ActionAllowOriginAttribute : ActionFilterAttribute
{
public string[] AllowSites { get; set; }
public override void OnActionExecuting(System.Web.Mvc.ActionExecutingContext filterContext)
{
AllowOriginAttribute.onExcute(filterContext, AllowSites);
base.OnActionExecuting(filterContext);
}
}
public class ControllerAllowOriginAttribute : AuthorizeAttribute
{
public string[] AllowSites { get; set; }
public override void OnAuthorization(System.Web.Mvc.AuthorizationContext filterContext)
{
AllowOriginAttribute.onExcute(filterContext, AllowSites);
}
}
}
Controllerによるドメイン間アクセスの許可の指定
[ControllerAllowOrigin(AllowSites = new string[] { "http://localhost:52559" })]
public class CityController : Controller
{}
アクションを指定してドメイン間アクセスを許可
[HttpPost]
[ActionAllowOrigin(AllowSites = new string[] { "http://localhost:52559" })]
public ActionResult addCity(string userName, string password)
{
var a = userName;
var b = password;
return Json(new
{
Code = 200,
msg = "123",
data = ""
}, JsonRequestBehavior.AllowGet);
}
htmlページ
@{
Layout = null;
}
IndexTest
function login() {
$.ajax({
//
type: "POST",//
dataType: "json",//
url: "http://localhost:5640/City/addCity",//url
data: $('#form1').serialize(),
success: function (result) {
console.log(result);// ( )
if (result.Code == 200) {
alert("SUCCESS");
}
},
error: function () {
alert(" !");
}
});
}
XMLHttpRequest(オリジナル)
function loginNew() {
var barcode = document.getElementById("Barcode").value;
var name = document.getElementById("Name").value;
console.log("1:" + barcode + ";2:" + name);
//
var xmlhttp = new XMLHttpRequest();
// url
xmlhttp.open('post', 'http://localhost:52556/api/AssetOa?IsAddAsset=true', true);
//post
//xmlhttp.setRequestHeader("Content-type", "application/json");
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
//
xmlhttp.send('&Barcode=' + barcode + '&Name=' + name + '&AssetTypeId=1');
xmlhttp.onreadystatechange = function () {
//
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
console.log(xmlhttp.responseText);
}
};
}
D:MyFileテスト項目Solution 1WebApplication 1