proxy代理

Proxy的意思是代理，一般称作拦截器，可以拦截对象上的一个操作。通过new的方式创建对象，第一个参数是被拦截的对象，第二个参数是对象操作的描述。实例化后返回一个新的对象，当我们对这个新的对象进行操作时就会调用我们描述中对应的方法。

输入cookie-proxy打开8899的登录页原理：

在当前目录下启动cookie-proxy，cookie-proxy会读取当前目录下proxy.config.js文件中的配置

注意由于api请求会发送到127.0.0.1:8899，存在跨域问题，需要设置响应头access-control-expose-headers

目前已经加入的响应头有

javascript代码如下：

config.proxy.afterProxy = ({response}) => {
    response.set('access-control-expose-headers', 'x-all-count, x-create-count, x-total-count');
    return true;
};

proxy.config.js文件：

module.exports = config => {
    config.proxy.afterProxy = ({response}) => {
        response.set('access-control-expose-headers', 'x-all-count, x-create-count, x-total-count, x-pr-count');
        return true;
    };

    return config;
};

Proxy与Object.definedProperty的区别：

 proxy用法如下：

new Proxy(target, {
get(target, property) {

},
set(target, property) {

},
deleteProperty(target, property) {

}
})

Proxy区别于Object.definedProperty。

Object.defineProperty只能监听到属性的读写，而Proxy除读写外还可以监听属性的删除，方法的调用等。

通常情况下我们想要监视数组的变化，基本要依靠重写数组方法的方式实现，这也是Vue的实现方式，而Proxy可以直接监视数组的变化。

const list = [1, 2, 3];
const listproxy = new Proxy(list, {
set(target, property, value) {
target[property] = value;
return true; // 标识设置成功
}
});

list.push(4);

Proxy是以非入侵的方式监管了对象的读写，而defineProperty需要按特定的方式定义对象的属性