`

浏览器拦截跨域请求处理方法

阅读更多
引用
在浏览器请求中,出现跨域访问资源的问题,我们肯定会遇到。如果跨域请求被阻止,有可能导致css、js 、ajax请求、font字体等资源出现无法正常访问的问题。接下来,就介绍下解决同源策略不允许读取远程资源的问题。


解决此类问题,最直接的方法就是,就是给被请求的服务器,添加HTTP头响应头,这里提供两种添加HTTP头的方法:

第一种,就是在程序中添加HTTP头:  


如: Response.Headers.Add("Access-Control-Allow-Origin", "*");
// JSON
{
  'Access-Control-Allow-Origin': '*', 
}
// HTML
<meta http-equiv="Access-Control-Allow-Origin" content="*">
// PHP
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");


   添加此段代码的目的很简单,也就是告诉浏览器,这个资源是运行远程所有域名访问的。当然,此处的*也可以替换为指定的域名,出于安全考虑,建议将*替换成指定的域名。

   第二种,就是在服务器上,添加HTTP响应头。在这里,我们就以IIS6.0为例:

   在被请求的网站上,设置HTTP头,添加“

//在被请求的网站上,设置HTTP头,添加
"Access-Control-Allow-Origin:*" //值为*或指定的域名。


  第三种,使用JSONP格式,即在jQuery中ajax请求参数dataType:'JSONP':  

<script> 
    $.ajax({ 
        url:"http://map.oicqzone.com/gpsApi.php?lat=22.502412986242&lng=113.93832783228", 
        type:'GET', 
        dataType:'JSONP',  // 处理Ajax跨域问题
        success: function(data){ 
            $('body').append( "Name: " + data ); 
        } 
    }); 
</script>


   一般完成以上工作,就可以了。网上还有说在被请求服务器根目录下创建:"crossdomain.xml"的文件。内容格式如下:

<?xml version="1.0"?>
<cross-domain-policy>
  <allow-access-from domain="*" />
</cross-domain-policy>




分享到:
评论

相关推荐

    web前端开发中的常见技能问题.doc

    web扫码登录,判断用户设备,浏览器拦截跨域请求处理方法,ios 键盘遮挡问题

    vue面试题之web前端开发中的常见技能

    三、浏览器拦截跨域请求处理方法 浏览器拦截跨域请求是web前端开发中常见的问题,解决方法如下: * 在服务器端添加HTTP头响应头,例如'Access-Control-Allow-Origin': '*' * 使用代理跨域,例如配置Apache或Nginx...

    开源android浏览器,访问跨域网页

    开发者可以通过自定义WebView的设置来处理跨域请求,例如启用跨域资源共享(CORS)或者通过JavaScript接口与Web内容交互。 Android SDK是开发Android应用的基础,包含了一系列的库、工具和文档,使得开发者可以使用...

    Springmvc ajax跨域请求处理方法实例详解

    SpringMVC AJAX 跨域请求处理方法实例详解 本文主要介绍了 SpringMVC AJAX 跨域请求处理方法实例详解,解决了 AJAX 跨域请求问题。下面是详细的知识点解释: 一、什么是 AJAX 跨域请求? AJAX 跨域请求是指在不同...

    过滤器或拦截器跨域CORS处理

    `CORSInterceptor.java` 是Spring MVC中的拦截器,它在控制器处理方法之前和之后执行。Spring MVC拦截器可以处理模型数据、改变请求或响应,包括添加CORS头。 1. 实现`preHandle`方法,在请求被控制器处理前进行...

    Tomcat开启跨域请求jar包

    5. **CorsFilter**:`cors-filter-2.6.jar`中的主要类,它实现了Servlet Filter接口,可以在请求处理链中拦截并处理跨域请求。这个过滤器会检查请求并根据配置的规则添加相应的响应头。 6. **java-property-utils-...

    Android跨域请求获取Java后端数据,登录界面例子

    跨域请求是指浏览器安全策略的一种限制,即一个源(Origin)的文档或脚本不能发起对另一个源的HTTP请求。但Android应用不受此限制,因此可以直接向其他域名发送网络请求。在这个案例中,Android应用作为客户端,Java...

    springmvc跨域处理和过滤器方式跨域处理主要代码

    在Spring MVC中,跨域问题通常发生...通过上述方法,你可以实现Spring MVC或Spring Boot应用中的跨域请求处理。在提供的压缩包文件"code"中,应该包含了具体的代码实现,你可以参考这些代码来理解和应用这些解决方案。

    JAVA通过Filter实现允许服务跨域请求的方法

    【Java通过Filter实现允许服务跨域请求的方法】 在Web开发中,浏览器的同源策略是一项安全机制,限制了JavaScript只能发起与当前页面同源(协议、域名和端口相同)的HTTP请求。然而,随着前后端分离的发展,跨域...

    SpringBoot解决跨域请求拦截问题代码实例

    除了允许跨域请求外,还可以对请求的headers、方法、来源等进行限制。例如: ``` @Configuration public class WebMvcConfig implements WebMvcConfigurer { @Override public void addCorsMappings(CorsRegistry ...

    jQuery.ajax 跨域请求webapi设置headers的解决方案

    对于跨域请求并且包含headers的情况,大部分现代浏览器(包括IE和Chrome)会采用“预请求”机制,即先发送一个`OPTIONS`请求来询问服务器是否允许该跨域请求。服务器需要正确处理这个预请求,通常返回`202 Accepted`...

    cors技术解决ajax跨域

    **CORS技术详解:解决AJAX跨域...总之,CORS通过在服务器端设置特定的响应头,使浏览器能够判断并处理跨域请求,从而解决了AJAX的跨域问题。在实际应用中,我们需要根据需求合理配置CORS Filter,并注意安全性问题。

    跨域安全JAR包

    2. **Filter或Interceptor实现**:为了在服务器端处理跨域请求,JAR包可能提供了预定义的过滤器(Filter)或拦截器(Interceptor),这些组件可以在请求到达实际业务逻辑之前进行预处理,添加必要的CORS响应头。...

    【JavaScript源代码】解决vue $http的get和post请求跨域问题.docx

    在开发过程中,经常遇到跨域问题,因为浏览器的安全策略限制了不同源的HTTP请求。Vue.js 的官方推荐插件 Axios 通常用于处理HTTP请求,但默认情况下,它也会受到同源策略的约束。本文将详细介绍如何解决 Vue.js 中...

    axios中cookie跨域及相关配置示例详解

    设置`withCredentials`为`true`后,浏览器将会在跨域请求中发送Cookie。但是,这还不够,后端也需要相应的配置来允许这种情况。通常,我们需要在响应头中设置`Access-Control-Allow-Credentials`为`true`,并且`...

    layui-table-cros:layui表格跨域请求

    layui表格跨域请求是网页应用中常见的需求,尤其是在前后端分离的开发模式下。layui是一款优秀的前端组件库,它的表格组件...通过这样的实践,你将能够更好地理解和处理前后端跨域请求的问题,提升你的Web开发技能。

    tomcat浏览器跨域的两个jar包

    当我们在Tomcat上部署应用并需要处理跨域请求时,就需要采取特定的方法来绕过默认的同源策略。 首先,我们来看第一个jar包:cors-filter-2.5.jar。CORS(Cross-Origin Resource Sharing,跨源资源共享)是一种W3C...

    Ext2.0.2的Ajax请求拦截示例

    在实际应用中,这些拦截器可以用来处理跨域请求的CORS设置、添加认证令牌、日志记录、错误处理等通用任务。同时,`beforeSend`和`success`回调可以与`beforerequest`和`requestcomplete`事件结合使用,以实现更复杂...

    web项目跨域jar包

    这个过滤器的核心在于设置Access-Control-Allow-Origin、Access-Control-Allow-Methods、Access-Control-Allow-Headers等CORS相关的响应头,这些头信息告诉浏览器哪些跨域请求是被允许的。 `java-property-utils-...

Global site tag (gtag.js) - Google Analytics