jQueryがAJAXを呼び出したときのGetとpostの共通の文字化けし解決方法

6402 ワード
以前、新浪ブログでjsがAJAXを呼び出す際のGetとpostの文字化けしの解決策を書いたことがありますが、jsコードを使うのは煩雑で、ajaxを使ってデータのインタラクションを行う際にjsの成熟したフレームワークであるjQueryを使うことができます.
登録ログインにしてもページング検索にしても、必要なページデータを得るためにサーバにパラメータをコミットする必要があるWebサイトの設計.ユーザーがページをリフレッシュすることによる苦しみを減らすためにajaxが誕生した.しかし、初心者がプロジェクト開発を行うと、中国語の文字化けして煩わしい問題に直面します.
次に、文字化けしてしまう可能性のある場所、どのような方法で解決する必要があるかを簡単な例で説明します.
 
この例では、主にユーザ登録時にユーザ名が正しいか(既存)を実装し、フォーカスがusernameテキストtextを移動すると、usernameを非同期でコミットし、servletによって抽出判断し、結果をページに戻してヒントを与える.
最初のステップでは、jQuery_Ajaxという名前のWebプロジェクト(デフォルトのGBK形式)を新規作成します.WebRootディレクトリの下にjsファイルパッケージを新規作成し、jquery-1.4.4.jsを配置します.
ステップ2では、srcの下にservletパッケージを作成し、Valiを作成します.java 
  
package servlet;
 
import java.io.IOException;
import java.io.PrintWriter;
import java.net.URLDecoder;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
importjavax.servlet.http.HttpServletRequest;
importjavax.servlet.http.HttpServletResponse;
 
public class Vali extends HttpServlet {
         @Override
         protectedvoid service(HttpServletRequest request, HttpServletResponse response)
                            throwsServletException, IOException {
                   StringuserName = URLDecoder.decode(request.getParameter("userName"),"utf-8");
                   System.out.println(userName);
                response.setContentType("text/html;charset=utf-8");
 PrintWriter pw =response.getWriter();
if(userName.equals("  ")){
pw.println("  ");
}else{
pw.println("  ");
}
}
}

コードから分かるように、符号化フォーマットを含む文は乱符号化を解決する方法の一つである.
コードでの注意:1.URLDecoder.decode(request.getParameter(「userName」)、「utf-8」)-ページから送信されたデータをフォーマット変換して抽出
                                   2.response.setContentType(「text/html;charset=utf-8」)-応答戻り値をutf-8符号化してページに戻る
                                    3.特に2の変換は、本方法内のすべてのresponseの前に書く必要があります.そうしないと、失効する可能性があります.
                                    4.本servletのデータに対するフォーマット符号化はPostメソッドにのみ適しており、提出方式がGETであればページデータを抽出するコードは以下の通りである.
     
     request.setCharacterEncoding("utf-8");
                   StringuserName = request.getParameter("userName");
                   userName= new String(userName.getBytes("iso-8859-1"),"utf-8");

第3歩は、簡単な登録ページajaxを作成する.jsp 
 <%@ page language="java"import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath =request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
 
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTDHTML 4.01 Transitional//EN">
<html>
 <head>
   <base href="<%=basePath%>">
   
   <title>My JSP 'ajax.jsp' starting page</title>
   
         <metahttp-equiv="pragma" content="no-cache">
         <metahttp-equiv="cache-control" content="no-cache">
         <metahttp-equiv="expires" content="0">   
         <metahttp-equiv="keywords"content="keyword1,keyword2,keyword3">
         <metahttp-equiv="description" content="This is my page">
         <!--
         <linkrel="stylesheet" type="text/css"href="styles.css">
         -->
         <scripttype="text/javascript"src="js/jquery-1.4.4.js"></script>
         <scripttype="text/javascript">
          function vali(){
          $.ajax({
       type:"POST",
       url:"/jQuery_Ajax/Vali",
       data:encodeURI(encodeURI("userName="+$(":text").val())),
        success:function(data){
                $("span").text(data);
       }
    });
          }
         </script>
 </head>
 
 <body>
       :<inputtype="text" name="userName"onblur="vali();"/><span></span><br/>
      :<inputtype="password" name="password" />
 </body>
</html>

コードでの注意:1.ページをutf-8に設定、jquery-1.4を導入する.4.js
                                     2.ajaxはPOSTメソッドでデータを転送し、dataの設定に注意します.戻りデータがspanラベルに入力されます.
GETメソッドを使用してページデータを渡す場合、jsコードは次のとおりです.
  
function vali(){
          $.ajax({
       type:"GET",
       url:"/jQuery_Ajax/Vali",
       data:encodeURI("userName="+$(":text").val()),
       success:function(data){
                $("span").text(data);
       }
    });
}

 
最後のステップはwebです.xml構成servletとマッピング
 <servlet>
   <description>This is the description of my J2EEcomponent</description>
   <display-name>This is the display name of my J2EEcomponent</display-name>
   <servlet-name>Vali</servlet-name>
   <servlet-class>servlet.Vali</servlet-class>
 </servlet>
 
 <servlet-mapping>
   <servlet-name>Vali</servlet-name>
   <url-pattern>/Vali</url-pattern>
 </servlet-mapping>

 
以上のコードの作成により、本登録検証のプロジェクトは完了し、tomcatに配備され、Webページからアクセスされます.
最後に大神のjQuery文字化けし問題解決方法をまとめます.
1.ページコードをチェックし、次のようにページコードをutf 8に設定します.

2.servletをチェックし、doPostメソッドまたはdoGetメソッドに次のコードを追加します.
response.setContentType("text/xml;charset=utf-8");
3.tomcatファイルを変更し、TOMCAT_HOME/conf/server.xmlファイルにURIEncoding="utf 8"を追加:

4.工程でフィルタを追加し、符号化方式をutf 8に設定
以上の4ステップの操作を経ても、問題は依然として発生しています.
5.ieのhttpヘッダを確認し、contentTypeフィールドを以下のように表示します.
contentType:"application/x-www-form-urlencoded"
6.firefoxのhttpヘッダを確認し、contentTypeフィールドを次のように表示します.
contentType:"application/x-www-form-urlencoded;charset=UTF-8"
5,6の2ステップを比較すると、問題が発生します.
7.jQuery-1を修正する.x.x.jsファイル、
contentType:「アプリケーション/x-www-form-urlencoded」を次のコードに変更
contentType:"application/x-www-form-urlencoded;charset=UTF-8"
                                    
 
アルゴリズム:Same Tree
TensorFlow > Variables > regular variables / local (transient) variables