Home Web Front-end JS Tutorial How to handle html tag submission failure when Ajax submits parameters

How to handle html tag submission failure when Ajax submits parameters

Apr 02, 2018 pm 05:23 PM
ajax html Label

This time I will bring you the html tag when Ajax submits parameters How to handle the submission failure, what are the things to pay attention to when handling the html tag submission failure when handling Ajax submission parameters, the following is the actual combat Let’s take a look at the case.

Recently, I encountered a small problem in the company's resource and article upload function, and I was stuck for a long time.

This function is similar to using rich text

Editor to publish information, but uses Ajax to submit data, so the submitted parameter value inevitably contains html tags.

There has been no problem running the code locally and the submission can always be successful. However, when the code is deployed online, the data cannot be submitted successfully. I was stuck for a long time and it took me a long time to find the problem.

The reason why the submission was unsuccessful is because my submission data contains html tags, and my target address cannot be directly requested.

# Then the solution is as follows:

1. Use JS's base64 coding (similar to encrypted) on the page with the parameter value of HTML tags.

2. After obtaining the data at the target address, use the background Base64 decoding method to decode the obtained data.

The following is the Base64 encoding and decoding method code of my JS:

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

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

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

//下面是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;

  }

Copy after login
The page calls the JS method to perform Base64 encoding code as follows:

1

2

 var articleContent = editor.getContent();

   articleContent = base64encode(utf16to8(articleContent));

Copy after login
But, I encountered another one New problem. After using JS to Base64 encode the data, JS actually replaced the plus sign (+) with a space, causing the data decoded by my background method to be incorrect.

The solution is as follows:

I first used the JS method replace() method to replace, but there was an error. JS just replaced my first A space is replaced with a plus sign (+). The final solution is as follows.

In the background (under the target receiving address), replace the spaces with the plus sign (+) for the obtained data. The code is as follows:        

1

2

3

4

5

6

7

8

9

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解码

Copy after login
                                                                                      ‐                                                                                      to  to  be encrypted  and  to  be encrypted  –                                                                      Other related articles online!

Recommended reading:

Asynchronous file or image upload ajax


Based on Ajax technology to achieve refresh-free user login ( Code attached)

The above is the detailed content of How to handle html tag submission failure when Ajax submits parameters. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Table Border in HTML Table Border in HTML Sep 04, 2024 pm 04:49 PM

Guide to Table Border in HTML. Here we discuss multiple ways for defining table-border with examples of the Table Border in HTML.

Nested Table in HTML Nested Table in HTML Sep 04, 2024 pm 04:49 PM

This is a guide to Nested Table in HTML. Here we discuss how to create a table within the table along with the respective examples.

HTML margin-left HTML margin-left Sep 04, 2024 pm 04:48 PM

Guide to HTML margin-left. Here we discuss a brief overview on HTML margin-left and its Examples along with its Code Implementation.

HTML Table Layout HTML Table Layout Sep 04, 2024 pm 04:54 PM

Guide to HTML Table Layout. Here we discuss the Values of HTML Table Layout along with the examples and outputs n detail.

HTML Input Placeholder HTML Input Placeholder Sep 04, 2024 pm 04:54 PM

Guide to HTML Input Placeholder. Here we discuss the Examples of HTML Input Placeholder along with the codes and outputs.

Moving Text in HTML Moving Text in HTML Sep 04, 2024 pm 04:45 PM

Guide to Moving Text in HTML. Here we discuss an introduction, how marquee tag work with syntax and examples to implement.

HTML Ordered List HTML Ordered List Sep 04, 2024 pm 04:43 PM

Guide to the HTML Ordered List. Here we also discuss introduction of HTML Ordered list and types along with their example respectively

HTML onclick Button HTML onclick Button Sep 04, 2024 pm 04:49 PM

Guide to HTML onclick Button. Here we discuss their introduction, working, examples and onclick Event in various events respectively.

See all articles