为了账号安全,请及时绑定邮箱和手机立即绑定

webapi跨域使用session

标签:
前端工具

在之前的项目中,我们设置跨域都是直接在web.config中设置的。

https://img1.sycdn.imooc.com//5b5b16210001115208120255.jpg

这样是可以实现跨域访问的。因为我们这边一般情况下一个webapi会有多个网站、小程序、微信公众号等访问,所以这样设置是没有问题的。但是……如果其中一个网站需要用到cookie或者session的时候,

Access-Control-Allow-Origin如果还是设置成“*”就会报错,当然是前端报错。。。数据返回还有cookie/session都还是能存,但是报错就不爽了啊。

于是,想着整改一下。

先上前端代码。来个页面远程ajax请求去设置session。啥都没有,就是点按钮,发个请求。标记地方是必须加的

复制代码

@{
    ViewBag.Title = "TestSetSession";
}<h2>TestSetSession</h2>

<button ="Set()">设置session</button>@section scripts{<script class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="~/Scripts/jquery-1.10.2.min.js"></script>
    <script>
        function Set() {
            $.ajax({
                url: "http://localhost:1338/api/Test/SetSession?session=1234567fdsdfghjhgfds",
                dataType: "json",                xhrFields: {
                    withCredentials: true
                },
                crossDomain: true,
                data: {},
                type: "post",
                success: function (data) {
                    alert(data.message)
                },
                error: function () {
                    alert('服务器发生错误!');
                }
            });
        }    </script>}

复制代码

然后再来个页面,获取上个页面设置的session。

复制代码

@{
    ViewBag.Title = "TestGetSession";
}<h2>TestGetSession</h2>
<button ="Get()">获取session</button>@section scripts{<script class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="~/Scripts/jquery-1.10.2.min.js"></script>
    <script>
        function Get() {
            $.ajax({
                url: "http://localhost:1338/api/Test/GetSession",
                dataType: "json",                xhrFields: {
                    withCredentials: true
                },
                crossDomain: true,
                data: {},
                type: "get",
                success: function (data) {
                    alert("session:" + data.data.session_state + ",cookie:" + data.data.cookie);
                },
                error: function () {
                    alert('服务器发生错误!');
                }
            });
        }    </script>}

复制代码

后台代码

1.先允许webapi使用session

在global中加入如下代码

复制代码

        public override void Init()
        {
            PostAuthenticateRequest += MvcApplication_PostAuthenticateRequest;            base.Init();
        }        void MvcApplication_PostAuthenticateRequest(object sender, EventArgs e)
        {
            System.Web.HttpContext.Current.SetSessionStateBehavior(
                System.Web.SessionState.SessionStateBehavior.Required);
        }

复制代码

2.允许跨域。我这里使用的是Microsoft.AspNet.WebApi.Cors

先安装包,然后在WebApiConfig中加入如下代码。等同于在web.config中设置

            //允许跨域
            config.EnableCors(new EnableCorsAttribute("*", "*", "*"));

在请求方法上打上[EnableCors]标签,特指某一些域名的访问需要cookie/session

复制代码

    [EnableCors("http://localhost:6477,http://localhost:6478", "*","*")]    public class TestController : ApiController
    {        /// <summary>
        /// 设置session        /// </summary>
        /// <returns></returns>
        public dynamic SetSession(string session)
        {
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Credentials", "true");            //缓存state
            HttpContext.Current.Session["session_test"] = session;
            HttpCookie cookie = new HttpCookie("cookie_test")
            {
                Value = session,
                Expires = DateTime.Now.AddHours(1)
            };
            HttpContext.Current.Response.Cookies.Add(cookie);            return new 
            {
                success = true,
                message = "设置session"
            };
        }        /// <summary>
        /// 获取session        /// </summary>
        /// <returns></returns>
        public dynamic GetSession()
        {
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Credentials", "true");            var session = HttpContext.Current.Session["session_test"];
            HttpCookie _cookie = HttpContext.Current.Request.Cookies["cookie_test"];            var cookie = _cookie?.Value??"";            string session_state = session == null ? "" : session.ToString();            return new 
            {
                success = true,
                message = "获取session",
                data = new { session_state, cookie }
            };
        }

复制代码

结果:

https://img1.sycdn.imooc.com//5b5b162a00016bdb12330388.jpg

https://img1.sycdn.imooc.com//5b5b16340001aad612140334.jpg

 

纸上得来终觉浅,绝知此事要躬行

原文出处:https://www.cnblogs.com/zhaoshang/p/9378928.html

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消