当前位置 博文首页 > 使用AJAX实现UTF8编码表单提交到GBK编码脚本无乱码的解决方法

    使用AJAX实现UTF8编码表单提交到GBK编码脚本无乱码的解决方法

    作者:苗启源 时间:2021-08-16 18:49

    1、表单项目1 GBK编码格式

    用户采集单是GBK编码,通过GET/POST提交上来的数据也是GBK格式,无需做任何处理

    测试源码

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
    <meta charset="GB2312">
    </head>
    <body>
    <li><a href="gbkForm.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >GBK同编码表单不乱码</a>
    <li><a href="utf8Form.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >UTF8表单修改前乱码</a>
    <li><a href="utf8FormRepair.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >UTF8表单修改为AJAX方案后不乱码</a>
    <li><a href="otherForm.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >其他GBK同编码表单不乱码</a>
    <li><a href="http://www.miaoqiyuan.cn/p/utf8-submit-gbk-ajax-autocharset" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >测试程序说明</a></a>
    <hr />
    <h2>GET:</h2>
    <form action="gbkSubmit.asp" method="GET" >
    QQ:<input name="qq" value="QQ" /><br />
    姓名:<input name="name" value="姓名"/><br />
    地址:<input name="address" value="地址地址地址"/><br />
    <button type="submit">GBK表单提交到GBK脚本后不会乱码</button>
    </form>
    <h2>POST:</h2>
    <form action="gbkSubmit.asp" method="POST" >
    QQ:<input name="qq" value="QQ" /><br />
    姓名:<input name="name" value="姓名"/><br />
    地址:<input name="address" value="地址地址地址"/><br />
    <button type="submit">GBK表单提交到GBK脚本后不会乱码</button>
    </form>
    </body>
    </html>

    2、表单项目2 UTF8编码格式(可以在不同的域名下)

    用户采集单是UTF8编码,通过GET/POST提交上来的数据也是UTF8格式,用表单项目1中的程序接收到的是乱码

    测试代码(修改前,提交乱码):

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
    <meta charset="UTF8">
    </head>
    <body>
    <li><a href="gbkForm.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >GBK同编码表单不乱码</a>
    <li><a href="utf8Form.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >UTF8表单修改前乱码</a>
    <li><a href="utf8FormRepair.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >UTF8表单修改为AJAX方案后不乱码</a>
    <li><a href="otherForm.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >其他GBK同编码表单不乱码</a>
    <li><a href="http://www.miaoqiyuan.cn/p/utf8-submit-gbk-ajax-autocharset" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >测试程序说明</a></a>
    <hr />
    <h2>GET:</h2>
    <form action="gbkSubmit.asp" method="GET" >
    QQ:<input name="qq" value="QQ" /><br />
    姓名:<input name="name" value="姓名"/><br />
    地址:<input name="address" value="地址地址地址"/><br />
    <button type="submit">UTF8表单提交到GBK脚本后会乱码</button>
    </form>
    <h2>POST:</h2>
    <form action="gbkSubmit.asp" method="POST" >
    QQ:<input name="qq" value="QQ" /><br />
    姓名:<input name="name" value="姓名"/><br />
    地址:<input name="address" value="地址地址地址"/><br />
    <button type="submit">UTF8表单提交到GBK脚本后会乱码</button>
    </form>
    </body>
    </html>

    不需要改变页面编码,只需要修改表单Action地址,增加name=”ConvertCallBack” value=”ProjectA/FormGBK”、name=”ConvertItems” value=”name,qq,bb” 的两个 input即可,不用对页面进行其他调整
    编码设置,转换器自动操作。

    <form action="convert/utf8.asp"...
    <input name="ConvertCallBack" value="ProjectA/FormGBK">
    <input name="ConvertItems" value="name,qq,address"/>
    <!-- 根据表单实际情况,修改表单项目 -->

    测试代码(修改后)

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
    <meta charset="UTF8">
    </head>
    <body>
    <li><a href="gbkForm.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >GBK同编码表单不乱码</a>
    <li><a href="utf8Form.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >UTF8表单修改前乱码</a>
    <li><a href="utf8FormRepair.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >UTF8表单修改为AJAX方案后不乱码</a>
    <li><a href="otherForm.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >其他GBK同编码表单不乱码</a>
    <li><a href="http://www.miaoqiyuan.cn/p/utf8-submit-gbk-ajax-autocharset" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >测试程序说明</a></a>
    <hr />
    <h2>GET:</h2>
    <form action="convert/utf8.asp" method="GET" >
    QQ:<input name="qq" value="QQ" /><br />
    姓名:<input name="name" value="姓名"/><br />
    地址:<input name="address" value="地址地址地址"/><br />
    <input name="ConvertCallBack" value="../gbkSubmit.asp" />
    <input name="ConvertItems" value="name,qq,address" />
    <button type="submit">AJAX转码方案</button>
    </form>
    <h2>POST:</h2>
    <form action="convert/utf8.asp" method="POST" >
    QQ:<input name="qq" value="QQ" /><br />
    姓名:<input name="name" value="姓名"/><br />
    地址:<input name="address" value="地址地址地址"/><br />
    <input name="ConvertCallBack" value="../gbkSubmit.asp" />
    <input name="ConvertItems" value="name,qq,address" />
    <button type="submit">AJAX转码方案</button>
    </form>
    </body>
    </html>

    3、表单项目3 GBK编码格式(可以在不同的域名下)

    没有任何影响,只要按照表单1的标准编写 参数即可
    测试代码:

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
    <meta charset="GB2312">
    </head>
    <body>
    <li><a href="gbkForm.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >GBK同编码表单不乱码</a>
    <li><a href="utf8Form.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >UTF8表单修改前乱码</a>
    <li><a href="utf8FormRepair.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >UTF8表单修改为AJAX方案后不乱码</a>
    <li><a href="otherForm.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >其他GBK同编码表单不乱码</a>
    <li><a href="http://www.miaoqiyuan.cn/p/utf8-submit-gbk-ajax-autocharset" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >测试程序说明</a></a>
    <hr />
    <h2>GET:</h2>
    <form action="gbkSubmit.asp" method="GET" >
    QQ:<input name="qq" value="QQ" /><br />
    姓名:<input name="name" value="姓名"/><br />
    地址:<input name="address" value="地址地址地址"/><br />
    Other1:<input name="other1" value="Other1"/><br />
    Other2:<input name="other2" value="Other2"/><br />
    Other3:<input name="other3" value="Other3"/><br />
    Other4:<input name="other4" value="Other4"/><br />
    Other5:<input name="other5" value="Other5"/><br />
    Other6:<input name="other6" value="Other6"/><br />
    Other7:<input name="other7" value="Other7"/><br />
    Other8:<input name="other8" value="Other8"/><br />
    Other9:<input name="other9" value="Other9"/><br />
    <button type="submit">GBK表单提交到GBK脚本后不会乱码</button>
    </form>
    <h2>POST:</h2>
    <form action="gbkSubmit.asp" method="POST" >
    QQ:<input name="qq" value="QQ" /><br />
    姓名:<input name="name" value="姓名"/><br />
    地址:<input name="address" value="地址地址地址"/><br />
    Other1:<input name="other1" value="Other1"/><br />
    Other2:<input name="other2" value="Other2"/><br />
    Other3:<input name="other3" value="Other3"/><br />
    Other4:<input name="other4" value="Other4"/><br />
    Other5:<input name="other5" value="Other5"/><br />
    Other6:<input name="other6" value="Other6"/><br />
    Other7:<input name="other7" value="Other7"/><br />
    Other8:<input name="other8" value="Other8"/><br />
    Other9:<input name="other9" value="Other9"/><br />
    <button type="submit">GBK表单提交到GBK脚本后不会乱码</button>
    </form>
    </body>
    </html>

    全部测试包下载地址 anycharset_jb51.rar

    utf8.asp

    <% @codepage=936 %>
    <%
      CallBack = Server.Htmlencode(Request("ConvertCallBack"))
      Items = Split(Request("ConvertItems"),",")
      if len(request.form) > 0 then
        method = "POST"
      else
        method = "GET"
      end if
    %><!DOCTYPE html>
    <html lang="zh-CN">
    <head>
    <meta charset="GB2312">
    <script src="http://www.miaoqiyuan.cn/wp-includes/js/jquery/jquery.js"></script>
    </head>
    <body>
    <form action="<%=CallBack%>" method="<%=method%>" >
    <%
      for each Item in Items
        if trim(Item) <> "" then
          Item = Server.Htmlencode(Item)
    %><% = Item %> : <textarea name="<% = Item %>" ></textarea><br />
    <script>
    jQuery.post("utf8_convert.asp?MiaoQiYuanAutoConvertItem=<%=Item%>&<%=Request.QueryString%>","<%=Request.Form%>",function(res){
      jQuery("#<% = Item %>").val(res);
    });
    </script>
    <%
        end if
      next
    %>
    <button type="submit">Waiting...</button>
    <script type="text/javascript">
    setTimeout(function(){
      jQuery("#AutoPOST").submit();
    },200);
    </script>
    </body>
    </html>

    utf8_convert.asp

    <% @codepage=65001 %>
    <%
      function NotXSS(html)
        NotXSS = html
        NotXSS = replace(NotXSS, "<", "&lt;")
        NotXSS = replace(NotXSS, ">", "&gt;")
        NotXSS = replace(NotXSS, """", "&quote;")
      end function
       
      '防止参数冲突,使用了 MiaoQiYuanAutoConvertItem
      Response.Write NotXSS(Request(Request.QueryString("MiaoQiYuanAutoConvertItem")))
    %>
    jsjbwy