解决jquery跨域cookie丢失问题

最新推荐文章于 2023-11-08 17:56:03 发布

置顶小T猴

最新推荐文章于 2023-11-08 17:56:03 发布

阅读量3.9k

点赞数

分类专栏： javascript 文章标签： jquery cookie jsonp

本文链接：https://blog.csdn.net/u014692324/article/details/78782900

版权

javascript 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

方式一：

采用jsonp方式实现解决，建议采取这种方式实现。

前端代码：

                                $.ajax({
                                    type: "POST",
                                    url: "http://*",
                                    data: {
                                        'vCode': vcode
                                    },
                                      dataType:'jsonp',
                                    jsonp:'jsoncallback',
                                    crossDomain: true,
                                    success: function(rs) {
                                        alert(rs.data);
                                    },

                                    error: function() {

                                    }

                                })

方式二：

采用后台允许相应请求头方式、实现跨域请求。缺点:需后台配置实现允许相应响应头，不灵活。

前端代码:

    $.ajax({
                    type: "POST",
                    url: "http://*",
                    data: {
                        'vCode': vcode
                    },
                    dataType: 'json',
                    xhrFields: {
                        withCredentials: true
                    },
                    crossDomain: true,
                    success: function(rs) {
                        alert(rs.data);
                    },

                    error: function() {

                    }

                })
            }


json请求方式:

    $.ajax({
                        type: "POST",
                        url: base_url+"/cms/web/bespeak",
                        contentType: "application/json",
                        crossDomain: true,
                        data: JSON.stringify({
                            'verifyCode': vcode
                        }),
                        success: function(rs) {
                            console.log(rs);
                        }
                    });

服务器端设置：

前端方式一：

数据返回形式:jsoncallback(data)

例如:
jsoncallback({"data":"验证失败","errorCode":0,"errorMsg":"success"})

前端方式二：

前端提交数据方式如是content-type：application/json
服务器需要支持options请求方式，前端设置请求头发出请求，浏览器会发出预请求来进行证书校验。

options(仅需要设置响应头,设置状态码200返回即可)以及真正的请求方式 响应头设置:

Access-Control-Allow-Origin http://*
Access-Control-Allow-Methods GET, POST, PUT, DELETE, OPTIONS
Access-Control-Allow-Credentials true

options 格外添加

Access-Control-Allow-Headers content-type