CORS Set Cookie不起作用

时间:2017-05-01 12:07:05

标签: javascript reactjs spring-boot cors

我遇到了在跨域方案中无法设置cookie的问题。

首先,我想描述一下我的情景。基本上,我有3个客户端平台,分别是web,ios,android。这三个平台将与我的后端端点通信。

这个问题仅涉及Web和后端。 Web和后端位于不同的域中。

我的网站(React JS)将作为http://webdomain1.com托管。 我的auth端点(Spring Boot Application)将作为http://backenddomain1.com和侦听端口8080

进行托管

我正在使用chrome浏览http://webdomain1.com并尝试通过Ajax将身份验证用户名和密码发送到http://backenddomain1.com,后端会向网络发送令牌。响应将响应'Set-Cookie'并将令牌设置为cookie。但是,我没有看到通过检查Chrome开发人员工具在http://webdomain1.com中设置了cookie。

这是我的ajax代码:

axios({
            method:'post',
            url: 'http://backenddomain1.com/auth/rentilife/authenticate',
            data: this.loginModel,
            withCredentials: true,
            headers: {'X-Requested-With': 'XMLHttpRequest'}
        }).then((response) => {
            document.cookie="test=value";
        }).catch(function (error) {
            //console.log(error);
        }); 

我的后端代码如下:

@Configuration
@EnableWebMvc
public class WebConfiguration extends WebMvcConfigurerAdapter{

    @Value("${allowed.origin.domains}")    
    private String[] allowedOriginDomains;

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
            .allowCredentials(true)
            .allowedHeaders("*")
            .allowedMethods("*")
            .allowedOrigins(allowedOriginDomains);
    }
}

响应标题如下:

Access-Control-Allow-Credentials:true
Access-Control-Allow-Origin:http://webdomain1.com
Content-Type:application/json;charset=UTF-8
Date:Mon, 01 May 2017 11:34:17 GMT
Set-Cookie:XA=eyJhbGciOiJSUzI1NiJ9.eyJzdWIiOiJhMWN8Y2h1YW5ob3I4NUBnbWFpbC5jb20iLCJpc3MiOiJnYWdlc2lzLmNvbSIsImV4cCI6MTQ5MzY0MjA1OCwiaWF0IjoxNDkzNjM4NDU4LCJ1c2VybmFtZSI6aGAZ21haWwuY29tIn0.OGVpymzgOzoLhjdhJS6OMbYnCB1NhwfVxCP7E8dxSahKYZvE5lZBrMBN5xgylOZoOWLHRB0C28j2Ps6zO1s7KF_KuNI6lPn1hU2oCjGZkp4X2HGj1rPBhmB7jy5oXpBB0GZDu8HV5u-HeVh2HfDH1KaCw-pJdPH66y0e6ugJghR36StqfrphTu1ideSjsWgN7BTpVip_uVP8aDKjVLZsQjnntlVLqrrEt0wutn10xXDs5d_pULi3wn0s18IPQFWA9iiC0d8s5hNk-AdVKmMhD9wQrczxYoPO5WqKIf5SFFKHa7bYJPUNJ6mSw6zshS1Bnj1cn_joJ8wo9mKQr05Lhw;domain=webdomain1.com;path=/
Transfer-Encoding:chunked
Vary:Origin
X-Application-Context:gateway:8080

请求标题:

Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate
Accept-Language:en-GB,en;q=0.8,en-US;q=0.6,la;q=0.4
Connection:keep-alive
Content-Length:57
Content-Type:application/json;charset=UTF-8
Host:backenddomain1.com:8080
Origin:http://webdomain1.com
Referer:http://webdomain1.com/
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36
X-Requested-With:XMLHttpRequest

寻求指导。感谢有人可以提供帮助。

1 个答案:

答案 0 :(得分:2)

您无法为其他域设置Cookie,因为这样做会带来很大的安全问题 在您的情况下,第一个解决方案是http://webdomain1.com向您的API发送请求并从响应中添加Cookie。如果您确实需要网站上的cookie,则需要这样做 可以从标题中读取cookie信息,但我不确定。

示例回复:

{
    'auth':'Success',
    'cookieName':'yourCookie',
    'cookieValue':'eatoinshruldu'
}

执行此操作将允许您的不同后端实施自己的身份验证和安全解决方案。

另一个选项是仅对您的API域执行权限和身份验证检查,因此在此域而不是您的网站上设置cookie。