zoukankan      html  css  js  c++  java
  • asp.net—WebApi跨域

    一、什么是跨域?

      定义:是指浏览器不能执行其他网站的脚本,它是由浏览器的同源策略造成的,是浏览器对JavaScript实施的安全限制。

      同源策略限制了以下行为:

      1、Cookie、LocalStorage和IndexDB无法读取

      2、DOM和js对象无法获取

      3、ajax请求无法发送

    二、为什么要跨域?  

      跨域问题来源于JavaScript的同源策略,即只有 协议+主机名+端口号(如存在)相同,则允许相互访问。

      那么跨域就是在 协议+主机名+端口号(如存在)不相同时,让其允许相互访问。

    三、webapi跨域解决办法

      跨域解决办法有多种, 这里我给出最近在webapi + vue 实现前后端分离项目开发中的跨域解决方案:

      (1)WebApi配置文件里面添加如下配置信息即可

     <system.webServer>
         <httpProtocol>
            <customHeaders>
                <add name="Access-Control-Allow-Origin" value="*" />
                <add name="Access-Control-Allow-Headers" value="*" />
                <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
            </customHeaders>
         </httpProtocol>
     </system.webServer>

      (2)当遇到WebApi要开启session会话时,那么前端和后端的配置信息如下

    webapi端(webapi默认是不支持session会话,需先手动设置其支持session会话)

     <system.webServer>
         <httpProtocol>
            <customHeaders>
                <add name="Access-Control-Allow-Origin" value="http://localhost:8080" />  //此时这里就不能为 * ,要填前端项目的正确域名地址
                <add name="Access-Control-Allow-Headers" value="*" />
                <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
                <add name="Access-Control-Allow-Credentials" value="true"/>
            </customHeaders>
         </httpProtocol>
     </system.webServer>

    Vue端

    ● 每个ajax请求都需将 withCredentials = true

  • 相关阅读:
    与非
    抄卡组
    数据结构》关于差分约束的两三事(BZOJ2330)
    刷题向》图论》BZOJ1179 关于tarjan和SPFA的15秒(normal)
    图论算法》关于tarjan算法两三事
    图论算法》关于SPFA和Dijkstra算法的两三事
    刷题向》DP》值得一做》关于对DP问题的充分考虑(normal)
    数据结构》关于线段树两三事(新手向)(工具向)
    图论算法》关于匈牙利算法的两三事
    关于羊和车的问题
  • 原文地址:https://www.cnblogs.com/yanglang/p/10106872.html
Copyright © 2011-2022 走看看