Ajax提交參數(shù)的值中帶有html標(biāo)簽不能提交成功的解決辦法(ASP.NET)
最近在公司做資源及文章上傳功能遇到一個小問題,被坑了好半天。
該功能就類似利用富文本編輯器發(fā)布信息,但是用Ajax提交數(shù)據(jù),因此提交參數(shù)值中不可避免的含有html標(biāo)簽。
在本地運(yùn)行代碼一直沒問題,總是可以提交成功,但是代碼部署到線上就不能成功提交數(shù)據(jù)了,被坑了好久,找了好半天才找到問題所在。
提交不成功的原因是因為我的提交數(shù)據(jù)中含有html標(biāo)簽,然后直接無法請求到我的目標(biāo)地址。
然后解決辦法如下:
1、在頁面用JS的Base64編碼(類似加密)帶有html標(biāo)簽的參數(shù)值。
2、在目標(biāo)地址獲取到數(shù)據(jù)后,利用后臺Base64解碼方法對獲取到的數(shù)據(jù)進(jìn)行解碼即可。
以下是我的JS的Base64編碼和解碼方法代碼:
//下面是64個基本的編碼 var base64EncodeChars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"; var base64DecodeChars = new Array( -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, 62, -1, -1, -1, 63, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, -1, -1, -1, -1, -1, -1, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, -1, -1, -1, -1, -1, -1, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, -1, -1, -1, -1, -1); //編碼的方法 function base64encode(str) { var out, i, len; var c1, c2, c3; len = str.length; i = 0; out = ""; while(i < len) { c1 = str.charCodeAt(i++) & 0xff; if(i == len) { out += base64EncodeChars.charAt(c1 >> 2); out += base64EncodeChars.charAt((c1 & 0x3) << 4); out += "=="; break; } c2 = str.charCodeAt(i++); if(i == len) { out += base64EncodeChars.charAt(c1 >> 2); out += base64EncodeChars.charAt(((c1 & 0x3)<< 4) | ((c2 & 0xF0) >> 4)); out += base64EncodeChars.charAt((c2 & 0xF) << 2); out += "="; break; } c3 = str.charCodeAt(i++); out += base64EncodeChars.charAt(c1 >> 2); out += base64EncodeChars.charAt(((c1 & 0x3)<< 4) | ((c2 & 0xF0) >> 4)); out += base64EncodeChars.charAt(((c2 & 0xF) << 2) | ((c3 & 0xC0) >>6)); out += base64EncodeChars.charAt(c3 & 0x3F); } return out; } //解碼的方法 function base64decode(str) { var c1, c2, c3, c4; var i, len, out; len = str.length; i = 0; out = ""; while(i < len) { do { c1 = base64DecodeChars[str.charCodeAt(i++) & 0xff]; } while(i < len && c1 == -1); if(c1 == -1) break; do { c2 = base64DecodeChars[str.charCodeAt(i++) & 0xff]; } while(i < len && c2 == -1); if(c2 == -1) break; out += String.fromCharCode((c1 << 2) | ((c2 & 0x30) >> 4)); do { c3 = str.charCodeAt(i++) & 0xff; if(c3 == 61) return out; c3 = base64DecodeChars[c3]; } while(i < len && c3 == -1); if(c3 == -1) break; out += String.fromCharCode(((c2 & 0XF) << 4) | ((c3 & 0x3C) >> 2)); do { c4 = str.charCodeAt(i++) & 0xff; if(c4 == 61) return out; c4 = base64DecodeChars[c4]; } while(i < len && c4 == -1); if(c4 == -1) break; out += String.fromCharCode(((c3 & 0x03) << 6) | c4); } return out; } function utf16to8(str) { var out, i, len, c; out = ""; len = str.length; for(i = 0; i < len; i++) { c = str.charCodeAt(i); if ((c >= 0x0001) && (c <= 0x007F)) { out += str.charAt(i); } else if (c > 0x07FF) { out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F)); out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F)); out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); } else { out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F)); out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); } } return out; } function utf8to16(str) { var out, i, len, c; var char2, char3; out = ""; len = str.length; i = 0; while(i < len) { c = str.charCodeAt(i++); switch(c >> 4) { case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7: // 0xxxxxxx out += str.charAt(i-1); break; case 12: case 13: // 110x xxxx 10xx xxxx char2 = str.charCodeAt(i++); out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F)); break; case 14: // 1110 xxxx 10xx xxxx 10xx xxxx char2 = str.charCodeAt(i++); char3 = str.charCodeAt(i++); out += String.fromCharCode(((c & 0x0F) << 12) | ((char2 & 0x3F) << 6) | ((char3 & 0x3F) << 0)); break; } } return out; }
頁面調(diào)用JS方法進(jìn)行Base64編碼代碼如下:
var articleContent = editor.getContent(); articleContent = base64encode(utf16to8(articleContent));
但是呢,又遇到一個新的問題,用JS對數(shù)據(jù)進(jìn)行Base64編碼后,JS居然把加號(+)替換成了空格,造成我后臺方法解碼出來的數(shù)據(jù)不正確。
解決辦法如下:
本人首先采用JS方法replace()方法進(jìn)行替換,但是有錯誤,JS只是把我的第一個空格替換成了加號(+),最后解決辦法如下。
在后臺(目標(biāo)接受地址下)對獲取到的數(shù)據(jù),把空格替換成加號(+)。代碼如下:
string content = Request["content"].ToString(); if (content.Contains("")) { content=content.Replace(" ", "+"); } //byte[] sa = Convert.FromBase64String(content); //Encoding Ansi = Encoding.GetEncoding("GB2312"); // content = Ansi.GetString(sa); content = Base64Decrypt(content);//Base64解碼
如果后臺的Base64編碼和解碼方法不會的請看下面:
/// <summary> /// Base64加密 /// </summary> /// <param name="input">需要加密的字符串</param> /// <returns></returns> public static string Base64Encrypt(string input) { return Base64Encrypt(input, new UTF8Encoding()); } /// <summary> /// Base64加密 /// </summary> /// <param name="input">需要加密的字符串</param> /// <param name="encode">字符編碼</param> /// <returns></returns> public static string Base64Encrypt(string input, Encoding encode) { return Convert.ToBase64String(encode.GetBytes(input)); } /// <summary> /// Base64解密 /// </summary> /// <param name="input">需要解密的字符串</param> /// <returns></returns> public static string Base64Decrypt(string input) { return Base64Decrypt(input, new UTF8Encoding()); } /// <summary> /// Base64解密 /// </summary> /// <param name="input">需要解密的字符串</param> /// <param name="encode">字符的編碼</param> /// <returns></returns> public static string Base64Decrypt(string input, Encoding encode) { return encode.GetString(Convert.FromBase64String(input)); }
以上所述是小編給大家介紹的Ajax提交參數(shù)的值中帶有html標(biāo)簽不能提交成功的解決辦法(ASP.NET),希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
- 詳解ASP.NET Core WebApi 返回統(tǒng)一格式參數(shù)
- .NET/C#利用反射調(diào)用含ref或out參數(shù)的方法示例代碼
- 淺談Asp.net Mvc之Action如何傳多個參數(shù)的方法
- ASP.NET MVC后臺參數(shù)驗證的幾種方式
- ASP.NET MVC傳送參數(shù)至服務(wù)端詳解及實例
- ASP.NET jquery ajax傳遞參數(shù)的實例
- .Net獲取URL中文參數(shù)值的亂碼問題解決方法總結(jié)
- 在ASP.NET 2.0中操作數(shù)據(jù)之六:編程設(shè)置ObjectDataSource的參數(shù)值
- .net core在服務(wù)器端獲取api傳遞的參數(shù)過程
相關(guān)文章
淺析Ajax后臺success傳來json數(shù)據(jù)的問題
最近在使用JQuery的ajax方法時,需要返回的數(shù)據(jù)為json數(shù)據(jù),在success返回中數(shù)據(jù)處理會根據(jù)返回方式不同會采用不同的方式來生成json數(shù)據(jù)。下面小編給大家介紹下在$.ajax方法中應(yīng)該是如何來處理的2016-10-10