Que faire si les paramètres jquery ajax transmettent des caractères tronqués

Avec le développement de la technologie Internet, de plus en plus de sites Web utilisent la technologie Ajax pour réaliser une interaction dynamique sur les pages Web. jQuery, la bibliothèque JavaScript la plus populaire, est également le premier choix de nombreux sites Web. Cependant, lorsqu'ils utilisent l'Ajax de jQuery pour envoyer des requêtes POST, de nombreux développeurs seront confrontés à un problème très embarrassant : des paramètres chinois tronqués. Cet article parlera des causes et des solutions à ce problème.

Cause du problème

Lors de l'envoi d'une requête POST, la méthode Ajax de jQuery sérialise les paramètres au format "application/x-www-form-urlencoded" par défaut et les envoie au backend. Ce format est relativement simple et offre la meilleure compatibilité entre les navigateurs. Cependant, lorsque les paramètres contiennent des caractères chinois, cela entraînera des caractères tronqués. En effet, ce format ne prend pas en charge le chinois et le chinois nécessite un codage d'URL et un échappement pour une transmission correcte.

Afin de résoudre ce problème, nous pouvons envisager d'utiliser un autre format de données fourni par jQuery - "multipart/form-data". Ce format prend en charge le chinois, mais il convient de noter que lors de l'utilisation de ce format, l'en-tête de la requête contiendra "Content-Type: multipart/form-data; border=----XXXXXX", ce qui entraînera l'ajout automatique par le navigateur d'un délimiteur qui pourrait interférer avec le backend analysant la valeur du paramètre.

Solution

Pour résoudre les problèmes ci-dessus, nous pouvons utiliser les trois solutions suivantes :

Méthode 1 : effectuer manuellement l'encodage d'URL

Lors de la transmission des paramètres, nous pouvons effectuer manuellement l'encodage d'URL, puis le décoder sur le backend. Les paramètres peuvent être codés à l’aide de la méthode encodeURIComponent() de JavaScript. Par exemple :

$.ajax({
  type:'POST',
  url:url,
  data: {'name':encodeURIComponent('张三'),'age':20},
  success:function(data){
    console.log(data);
  }
});

Dans le backend, utilisez la méthode URLDecoder.decode() de Java pour décoder :

String name = URLDecoder.decode(request.getParameter("name"), "UTF-8");
int age = Integer.parseInt(request.getParameter("age"));

Cette méthode est plus gênante et nécessite des opérations d'encodage et de décodage à la fois sur le front-end et le back-end.

Méthode 2 : Modifier l'en-tête de la requête

Nous pouvons modifier l'en-tête de la requête, changer "Content-Type" en "application/json;charset=utf-8" et utiliser le format JSON pour transmettre les données. Par exemple :

$.ajax({
  type:'POST',
  url:url,
  contentType: "application/json;charset=utf-8",
  data: JSON.stringify({'name':'张三','age':20}),
  success:function(data){
    console.log(data);
  }
});

Dans le backend, utilisez JsonParser de Java pour analyser JSON :

JsonParser parser = new JsonParser();
JsonObject object = parser.parse(json).getAsJsonObject();
String name = object.get("name").getAsString();
int age = object.get("age").getAsInt();

Cette méthode est relativement simple, mais elle ne convient que pour transmettre des données au format JSON.

Méthode 3 : Modifier le code du backend

Si le backend utilise PHP, vous pouvez directement utiliser $_POST ou $_REQUEST pour obtenir les valeurs des paramètres sans encodage ni décodage. Par exemple :

$name = isset($_POST['name']) ? $_POST['name'] : '';
$age = isset($_POST['age']) ? intval($_POST['age']) : 0;

Si le backend utilise Java, vous pouvez utiliser la méthode getInputStream() de HttpServletRequest pour obtenir la valeur du paramètre. Par exemple :

StringBuilder sb = new StringBuilder();
BufferedReader bufferedReader = null;
try {
  InputStream inputStream = request.getInputStream();
  bufferedReader = new BufferedReader(new InputStreamReader(inputStream));
  String line = null;
  while((line = bufferedReader.readLine()) != null) {
    sb.append(line);
  }
} catch (IOException e) {
  e.printStackTrace();
} finally {
  if(bufferedReader != null) {
    try {
      bufferedReader.close();
    } catch (IOException e) {
      e.printStackTrace();
    }
  }
}

Ensuite, nous pouvons utiliser JsonParser pour analyser les données au format JSON, ou analyser manuellement les données au format application/x-www-form-urlencoded.

En bref, chaque méthode a ses propres avantages et inconvénients, et nous pouvons choisir la méthode qui nous convient le mieux en fonction de la situation spécifique. Quelle que soit la méthode utilisée, vous devez faire attention à l’encodage et au décodage des paramètres chinois pour éviter les caractères tronqués.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!