javascript - fetch设置了Access-Control-Allow-Origin为我的ip依然无法发post跨域请求
巴扎黑
巴扎黑 2017-04-11 12:44:10
[JavaScript讨论组]

1.用了fetch api,因为要做session验证,所以tomcat的Access-Control-Allow-Origin设置为了我的ip
2.登录是post请求,下单也是post请求,但是登录正常,下单却提示跨域
3.提示如下,这个提示大家应该都见过很多遍了

Response to preflight request doesn't pass access control check: 
No 'Access-Control-Allow-Origin' header is present on the requested resource.

4.两个post请求都是如下代码

const postWithCookie=({url,body})=>{
    const fetchUrl=HOME_URL+url;
    let headers =new Headers({
        'Accept': 'application/json',
        'Content-Type': 'application/json;charset=UTF-8',
        'Access-Control-Allow-Credentials':'true',
    })
    return fetch(fetchUrl,{
        credentials: "include",
        method: "POST",
        headers:headers,
        body:body
    }).then(response=>{
        if(window.DEBUG){console.info('url',response)}
        return response.json();
    })
}

5.后台两个接口也是一模一样的设置,但请求的结果完全不同

6.下面是tomcat过滤器的一些设置

    
    
        CrossOrigin
        com.util.CrossOriginFilter
        
            AccessControlAllowOrigin
            http://192.168.0.165
        
        
            AccessControlAllowMethods
            POST, GET, DELETE, PUT
        
        
            AccessControlMaxAge
            3628800
        
        
            AccessControlAllowHeaders
            x-requested-with,Content-Type,Access-Control-Allow-Credentials,Access-Control-Allow-Origin
        
        
            AccessControlAllowCredentials
            true
        
    
    
        CrossOrigin
        /*
    

请教一下大大们,谢谢了。
真的搞不懂这个fetch,实在不行只能用ajax了。

巴扎黑
巴扎黑

全部回复(2)
巴扎黑
        <init-param>
            <param-name>AccessControlAllowMethods</param-name>
            <param-value>POST, GET, DELETE, PUT, OPTIONS</param-value>
        </init-param>
伊谢尔伦

谢谢楼上大哥的回答,找到问题所在了。
由于跨域,会在正式请求前发一次预请求(options),我们的后台对所有请求都做了登录验证(通过请求携带的cookie)。
重点来了,options是不带cookie的,不带!!!
所以拦截器拒绝了请求,预请求失败,正式请求无法发出。
解决办法是,拦截器对request的method进行判断,如果是options就放过,不是再来进行登录验证。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号