angularjs+文件上传 http头content-type字段变化

注 :
1 文件上传必须采用Content-Type:multipart/form-data; boundary=—-WebKitFormBoundarypHkhXOMllLo8SW36
2 angularjs默认的$http服务是content-type:application/json
附带ajax为application/x-www-form-urlencoded;charset=utf-8

问题:
1 需要自行修改配置$http的content-type头
2 文件+普通text一起会存在后端解析中文乱码问题(multipart/form-data导致)

解:

                var date = new FormData();  //存储文件格式流数据
                var logFile = document.getElementById('logFile').files[0];  //原生dom获取流图片数据
                var backFile = document.getElementById('backFile').files[0];
                date.append('file[0]', logFile);
                date.append('file[1]', backFile);
                //date.append('pageTitle', $scope.pageTitle); //数据传到后端会乱码  对于此方式传递普通字段 解析的方式是multipart/form-data
                var parmass = "?" //可以保证数据不会乱码 隔离multipart/form-data
                    + 'id=' +  id + "&"
                    + 'pageTitle=' +  $scope.pageTitle + "&"
                    + 'shopName=' +  $scope.shopName + "&"
                    + 'shopContact=' +  $scope.shopContact + "&"
                    + 'shopAddr=' +  $scope.shopAddr + "&"
                    + 'shopDesc=' +  $scope.shopDesc + "&"
                    + 'pageLogo=' +  $scope.pageLogo + "&"
                    + 'pageBackground=' +  $scope.pageBackground;

                $http({
                    method : 'POST',
                    url : "/portalmgr/portalPage/saveTemplate1" + parmass,  //如此添加普通字段数据保证其和流数据不是在同一个域中
                    data : date,  //仅仅存放的是文件流数据
                    headers : {
                        'Content-Type' : undefined  //angularjs设置文件上传的content-type修改方式
                    },
                    transformRequest : angular.identity
                }).success(function(response) {
                    layer.alert('提交成功', {icon: 6});
                });

这里写图片描述

附录:
// 前端不做修改可以解决乱码问题
//String name1 = new String(request.getParameter(“pageTitle”).getBytes(“iso8859-1”), “utf-8”);
// 前端将参数放在路由后面可以解决中文乱码问题 如上面代码

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值