[PHP知识库]svelte + axios + php的跨域和跨域携带cookie配置（绝对靠谱）

客户端设置:

这个是自己配置的一个

import axios from 'axios';
let HOST = __DEBUG ? 'http://ulegou.c.com/newindex' : 'https://ulegou.xxx.com/newindex';

function encodeFormData(data) {
    var pairs = [];
    var regexp = /%20/g;
    for (var name in data) {
        var value = data[name].toString();
        var pair = encodeURIComponent(name).replace(regexp, "+") + "=" + encodeURIComponent(value).replace(regexp, "+");
        pairs.push(pair);
    }
    return pairs.join("&");
};
const config = (url, data) => {
    let c = {};
    c.url = url;
    c.method = typeof(data) !== "function" ? 'post' : 'get';
    if (c.method == 'post') {
        c.data = data ? encodeFormData(data) : {};
    }
    // cookie
    c.withCredentials = true
        // 域名
    c.baseURL = HOST
        // 协议头
    c.headers = {
            // 'X-Requested-With': 'XMLHttpRequest',
            'Content-Type': 'application/x-www-form-urlencoded',
        }
        // 请求前处理
    c.transformRequest = [(e) => {
            return e;
        }]
        // 请求后处理
    c.transformResponse = [(e) => {
        return e;
    }]
    return c;
}
const send = (url, data) => {
    let c = config(url, data);
    return new Promise((resolve, reject) => {
        axios(c).then((e) => {
            resolve(JSON.parse(e.data))
        }).catch((error) => {
            console.log(error);
        });
    })
}
export default send;

配置里面的这个是必须要开的

c.withCredentials = true

自己看上面的封装吧，我这边目前使用的是这个！

服务端php，这个代码放到php的入口文件就可以了，最好的最最最上方

// 设置能访问的域名
$originarr = [
	'http://ulegou.c.com:5000',
];
// 获取当前跨域域名
$origin = isset($_SERVER['HTTP_ORIGIN']) ? $_SERVER['HTTP_ORIGIN'] : '';

if (in_array($origin, $originarr)) {
	// 允许 $originarr 数组内的 域名跨域访问
	header('Access-Control-Allow-Origin:' . $origin);
	// 响应类型
	header('Access-Control-Allow-Methods:POST,GET');
	// 带 cookie 的跨域访问
	header('Access-Control-Allow-Credentials:true');
	// 响应头设置
	header('Access-Control-Allow-Headers:x-requested-with,Content-Type,X-CSRF-Token');
	header("Access-Control-Request-Methods:GET, POST, PUT, DELETE, OPTIONS");
    header('Access-Control-Allow-Headers: Origin, Access-Control-Request-Headers, SERVER_NAME, Access-Control-Allow-Headers, cache-control, token, X-Requested-With, Content-Type, Accept, Connection, User-Agent, Cookie');
}

//部分前端请求会携带这个玩意OPTIONS，让他取消还特么不会的，就把这个加上，过滤掉
if(isset($_SERVER['REQUEST_METHOD']) && $_SERVER['REQUEST_METHOD'] == 'OPTIONS'){
    die('狗蛋，你又调皮了，By:Maiji');
}

基本上这个配置就可以跨域了，如果你的跨域不能携带COOKIE，那么就看下面这个链接，

我个人的一个解决办法就是，使用客户端的host修改，只用改域名就可以了，如果使用localhost访问是没有办法达到跨域携带cookie的，另外一个方案就是，吧host改成你API接口的域名这个绝对靠谱

鄙人第一次尝试使用异步的方法，以下是案例，不知道对不对啊，因为之前都是专注于同步的方法，使用的回调处理

async function onlogin() {
        if(phone == undefined || pass == undefined){
            return re.toast("账号或密码不能为空");
        }
        if (phone.length != 11) {
            re.toast("请输入正确手机号");
        } else if (pass.length < 6) {
            re.toast("请输入正确的密码");
        } else {
            let e = await re.send("login/login.html", {
                phone: phone,
                pass: pass,
            });
            if (e.code == 1) {
                await getuser();
                if (pass_state == true) {
                    re.db("Remember_password", {
                        phone: phone,
                        pass: pass,
                    });
                } else {
                    re.db("Remember_password", null);
                }
                f7router.navigate("/home");
            } else {
                re.toast(e.msg);
            }
            async function getuser() {
                re.send("my/user.html").then((e) => {
                    re.db("user", e.data);
                });
            }
        }
    }

修改链接：跳转