前端跨域常用解决办法

首先,码下一篇文章 超链接
这篇文章完美解决的我遇到的问题
首先说一下我遇到的问题
想跨域传一个表单,之前用的是jsonp的方式,奈何jsonp跨域只支持get方式,而表单中又有大量的中文,这就导致中文会变成乱码存入服务器中 。

贴出jsonp的跨域代码

$.ajax({
    url:'#',
    data:{
    'subject_type':$('#product_name').val(),
    'quantity':$('#num').val(),
    'consignee':$('#username').val(),
    'telephone':$('#phone').val(),
    'address':$('#address').val(),
    'price':$('#total').val(),
    'state':'1'
    },
    type:'get',
    dataType:"jsonp",/*加上datatype*/
    jsonpCallback:"cb",   //指明回调方法名字
    success:function(data){
    	console.log(data);
     },
    error:function(){
    	layer.alert('网络错误', {icon: 2})
    }
}); 

后来想到的方法是把中文变成unicode再进行传输,但又由于是get方式,参数过长会截断。

最终找到了credentials这个方式
超链接 这位仁兄讲的很好很详细,我就不在赘述了,贴下我写的源码

 $.ajax({
    url:'#',
    data:{
    'subject_type':$('#product_name').val(),
    'quantity':$('#num').val(),
    'consignee':$('#username').val(),
    'telephone':$('#phone').val(),
    'address':$('#address').val(),
    'price':$('#total').val(),
    'state':'1'
    },
    xhrFields : { withCredentials: true },
    type:'post',
    
    success:function(data){
		console.log(data);
    },
    error:function(){
    	layer.alert('网络错误', {icon: 2})
    }
});   

只要后台在设置一下,就可以完美跨域,当然在不传过多参数的情况下,jsonp的方式也是好用的哦!

打赏一个呗

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦