[jsp][javascript]jquery傳送圖片與文字,前端與後端
jQuery的Code長這樣,跟.net一樣(廢話)
form_data.append("ActNo", "111050030");
form_data.append("AllParaEmp", strPay );
form_data.append("AllParaFmy", strFMPay );
form_data.append("FMQty", intBuy );
form_data.append("strNeedCheck", strNeedCheck);
//眷屬
if($("input[type='file'][id^='txtPersonAgree_']").length>0){
$("input[type='file'][id^='txtPersonAgree_']").each(function(int,total){ //form_data.append('file', $(this).prop('files')[0]);
form_data.append($(this).prop('id')+"_PA", $(this).prop('files')[0]);
//form_data.append($(this).prop('files')[0].name,$(this).prop('id').split('_')[1] + "_" + "PA");
});
}
if($("input[type='file'][id^='txtPhotoAgree_']").length>0){
$("input[type='file'][id^='txtPhotoAgree_']").each(function(int,total){
form_data.append($(this).prop('id')+"_PH", $(this).prop('files')[0]);
//form_data.append($(this).prop('files')[0].name,$(this).prop('id').split('_')[1]+ "_" + "PH");
});
}
//自己
if($("input[type='file'][id='txtPersonAgree']").length>0){
$("input[type='file'][id='txtPersonAgree']").each(function(int,total){ //form_data.append('file', $(this).prop('files')[0]);
form_data.append($(this).prop('id')+"_PA", $(this).prop('files')[0]);
//form_data.append($(this).prop('files')[0].name,$(this).prop('id').split('_')[1]+ "_" + "PA");
});
}
if($("input[type='file'][id='txtPhotoAgree']").length>0){
$("input[type='file'][id='txtPhotoAgree']").each(function(int,total){
form_data.append($(this).prop('id')+"_PH", $(this).prop('files')[0]);
//form_data.append($(this).prop('files')[0].name,$(this).prop('id').split('_')[1]+ "_" + "PH");
});
}
//組合照片檔資訊
$.ajax({
url: "SaveAllMoney.jsp",
dataType: 'html',
cache: false,
contentType: false,
processData: false,
data: form_data,
type: 'post',
success: function (data, response) {
var strReturn="OK";
try{
strReturn=data.split("㊣")[1];
}catch(e){
}
if(strReturn=="OK"){
AddAct();
}else{
alert(strReturn);
}
},
error: function (data, response) {
}
});
後端接收比較麻煩,原因是jsp這種方式的post後端很難用一個既有的方法直接取值,直接用String strActNo=(request.getParameter(“ActNo”) ==null)?””:request.getParameter(“ActNo”); 會是空,非常機歪
正解放在下面
byte[] buf = new byte[4048];
int len = in.readLine(buf, 0, buf.length);
String f = new String(buf, 0, len - 1);
int Pp=0;
int Kk=0;
ArrayList<String[]> Img = new ArrayList();
String aa1="";
String aa2;
String aa3="";
String aa4="";
//int Pp=0;
boolean IsData=false;
DataOutputStream fileStream;
while ((len = in.readLine(buf, 0, buf.length)) != -1) {
filename = new String (buf, 0, len, "UTF-8"); // solve the problem of Chinese character scrambling
if(filename.indexOf("filename")<0){
//非照片,一般表單的值
String tempf = new String(buf, 0, len);
Pp=Pp+1;
tempf=tempf.replace("\r\n","");
//aa3=aa3+ tempf + "▲" + Pp + "●";
if (tempf.equals("")) {
IsData=false;
}
if(tempf.length()>2){
if (tempf.substring(0,2).equals("--")) {
IsData=false;
}else{
IsData=true;
}
}else if(tempf.length()>0){
IsData=true;
}
if(IsData){
//aa3=aa3 + filename + ":" + new String (buf, 0, len, "UTF-8")+ "●";
//if(filename.indexOf(" name=\"")>0){
if(aa1.equals("")){
aa1=filename.replace("\r\n","");
aa1=aa1.substring(aa1.indexOf(" name=\"")+7,aa1.length()-1);
}else{
aa2=filename.replace("\r\n","");
if(aa1.equals("ActNo")){
strActNo=aa2;
aa3=aa3+ aa1 + ":" + aa2 + "●";
aa1="";
File directory = new File(filepath);
//照片專用,不存在就建立
filepath =filepath + "Images/";
directory = new File(filepath);
if (! directory.exists()){
directory.mkdir();
}
//先放暫存目錄
filepath =filepath + strActNo +"/";
directory = new File(filepath);
if (! directory.exists()){
directory.mkdir();
}
//照工號,不存在就建立
filepath =filepath + strEmpno +"/";
directory = new File(filepath);
if (! directory.exists()){
directory.mkdir();
}
}else if(aa1.equals("AllParaEmp")){
strAllParaEmp=aa2;
aa3=aa3+ aa1 + ":" + aa2 + "●";
aa1="";
}else if(aa1.equals("AllParaFmy")){
strAllParaFmy=aa2;
aa3=aa3+ aa1 + ":" + aa2 + "●";
aa1="";
}else if(aa1.equals("FMQty")){
FMQty=aa2;
aa3=aa3+ aa1 + ":" + aa2 + "●";
aa1="";
}else if(aa1.equals("strNeedCheck")){
strNeedCheck=aa2;
aa3=aa3+ aa1 + ":" + aa2 + "●";
aa1="";
}else{
}
}
}
}else{
//strTmp=strTmp +filename+ "●";
aa1=filename;
aa1=aa1.substring(aa1.indexOf(" name=\"")+7,aa1.indexOf("\";"));
strTmp=strTmp +aa1+ "●";
aa2=filename;
aa2=aa2.substring(aa2.indexOf("; filename=")+12,aa2.length()-3);
strTmp=strTmp +aa2+ "㊣";
String[] Pa;
Pa=aa1.split("_");
System.out.println("filename="+filename);
aa4=aa4+ aa1 + "●";
String[] a1=new String[4];
int j = filename.lastIndexOf("\"");
int s = filename.indexOf("filename");
name=filename.substring(s+10,j);
filename = name; // you can get the uploaded filename through the above processing
if(Pa.length>2){
//大於兩個是眷屬
//txtPersonAgree_6190_PA
//if(Pa[2].equals("PA")){
//Pa[2]=PA個人同意書
//Pa[2]=PH照片同意書
//a1=new String[{"",Pa[1],filepath + "/" + filename,Pa[2]};
//工號是空
a1[0]=strRegUserID;
//眷屬DB編號
a1[1]=Pa[1];
//檔案路徑
a1[2]=filepath+ filename;
//同意書類型
a1[3]=Pa[2];
//}else{
//照片同意書
//}
}else{
//員工
//txtPhotoAgree_PH
//工號
a1[0]=strRegUserID;
//眷屬DB編號
a1[1]="-1";
//檔案路徑
a1[2]=filepath + filename;
//同意書類型
a1[3]=Pa[1];
}
Img.add(a1);
fileStream = new DataOutputStream(new BufferedOutputStream(new FileOutputStream(filepath + "/"+ filename)));
len = in.readLine(buf, 0, buf.length);
len = in.readLine(buf, 0, buf.length);
while ((len = in.readLine(buf, 0, buf.length)) != -1) {
String tempf = new String(buf, 0, len - 1);
if (tempf.equals(f) || tempf.equals(f + "--")) {
break;
}
else{
fileStream.write (buf, 0, len); // write
//a1[4]=buf;
//
}
}
fileStream.close();
aa1="";
}
}
理由:
如果在 //非照片,一般表單的值 的下面下
aa3=aa3 + filename + “:” + new String (buf, 0, len, “UTF-8”)+ “●”;
會得到
Content-Disposition: form-data; name=”ActNo”
:
●111050030
:——WebKitFormBoundaryhAfA7rWwrHEyXvGg
●Content-Disposition: form-data; name=”AllParaEmp”
:
●txtPoint_0=0㊣txtPay_0=1
:——WebKitFormBoundaryhAfA7rWwrHEyXvGg
●Content-Disposition: form-data; name=”AllParaFmy”
:
●txtFMPoint_0_老媽=0㊣txtFMAmt_0_老媽=1
:——WebKitFormBoundaryhAfA7rWwrHEyXvGg
●Content-Disposition: form-data; name=”FMQty”
:
●1
:——WebKitFormBoundaryhAfA7rWwrHEyXvGg
●Content-Disposition: form-data; name=”strNeedCheck”
:
●Y
:——WebKitFormBoundaryhAfA7rWwrHEyXvGg–
●