跨域的解决方法

JSONP的跨域方式

是JSON的一种模式，html中script标签可以引入其他域下的js，比如引入线上的jquery库。利用这个特性，可实现跨域访问接口
需要后端支持
服务器愿意提供接口
数据返回前需要提前定义好数据处理函数
创建script标签，src的地址执行后端接口，最后加个参数callback=数据处理函数名这个参数可以让返回的数据以数据处理函数名(data)的字符串形式输出，以此调用数据处理函数
例子
script部分

document.querySelector(对象).addEventListnner('操作',function(){
    var script=document.createElement('script')//创建一个元素
    script.src='路径?callback=数据处理函数'//设定地址
})
function 数据处理函数(){}

router.js部分

app.get('路径',function(req,res){
    var 返回数据=[xx]

    var cb = req.query.callback;
    if(cb){
        res.send(cb + '('+ JSON.stringify(返回数据) + ')');
    }else{
        res.send(返回数据);
    }
})

CORS的跨域请求方式

是AJAX的一种跨域请求方式，使用 XMLHttpRequest 发送请求时，浏览器发现该请求不符合同源策略，会给该请求加一个请求头：Origin，后台进行一系列处理，如果确定接受请求则在返回结果中加入一个响应头Access-Control-Allow-Origin 浏览器判断该相应头中是否包含 Origin 的值，如果有则浏览器会处理响应，我们就可以拿到响应数据，如果不包含浏览器直接驳回，这时我们无法拿到响应数据。
res.header('Access-Control-Allow-Origin','(此处输入同意对象的URL)')
例子
script部分

ducument.querySelector(对象).addEventListnner('操作',function(){
    
    var xhr=new XMLHttpRequest()
    xhr.open('get','路径',true)
    xhr.send()
    xhr.onreadystatechange =function(){
        if(xhr.readyState ===4 && xhr.status===200){
            appendHtml(JSON.parse(xhr.responseText))
        }
    }
})
function appendHtml(){}

router.js部分

    app.get('路径',function(req,res){
        var 返回数据=[xx]

        res.header('Access-Control-Allow-Origin','(此处输入同意对象的URL)') //也可输入'*'，表示同意所有
        res.send(返回数据)
    })

使用降域进行跨域

操作iframe
window.frames[0].document.querySelector('input').value='xxx'获取iframe里面的输入框后对其赋值，当子域名不同时不能进行操作，因此需要进行降域
document.domain=''降到相同的父域名，且主域名必须相同
例子
script部分
页面a

document.querySelector('input').addEventListener('input',function(){//选中页面a的input进行绑定操作
    window.frames[0].document.querySelector('input').value=this.value//对iframe（即页面b）里的input属性进行赋值
})
document.domain='同一二级域名或主域名'//重要部分修改域名

页面b

document.querySelector('input').addEventListener('input',function(){//选中页面b的input进行绑定操作
    window.parent.document.querySelector('input').value=this.value//对window父对象中的Input进行赋值
})
document.domain='同一二级域名或主域名'//重要部分修改域名