首页 > 图灵资讯 > 技术篇>正文
ajax乱码问题和异步同步问题
2023-05-28 09:29:51
1.测试内容:201.1发送ajaxget请求
将数据发送到服务器，服务器获取的数据是否乱码？
-服务器响应前端的中文，会不会乱码？
1.2发送ajaxpost请求-将数据发送到服务器，服务器获取的数据是否乱码？
-服务器响应前端的中文，会不会乱码？
1.3包括测试tomcat服务器的版本：-测试tomcat10和tomcat9。
2.测试结果：20-对于tomcat10，我们程序员不需要干涉字符集，也不需要乱码。
tomcat9呢？
-响应中文时，会出现乱码。如何解决？
response.setContentType("text/html;charset=UTF-8");
-发送ajaxpost请求时，发送给服务器的数据，服务器接收后的乱码，如何解决？
request.setCharacterEncoding("UTF-8");
com中的代码.bjpowernode.ajax.servletAjaxrequest7Servlet
package com.bjpowernode.ajax.servlet;import jakarta.servlet.ServletException;import jakarta.servlet.annotation.WebServlet;import jakarta.servlet.http.HttpServlet;import jakarta.servlet.http.HttpServletRequest;import jakarta.servlet.http.HttpServletResponse;import java.io.IOException;import java.io.PrintWriter;///测试ajax乱码问题 20@WebServlet(/ajaxrequest7)public class Ajaxrequest7Servlet extends HttpServlet { @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { ////接收的中文会有乱码问题吗？ String username = request.getParameter("username"); System.out.println(username); ///响应中文会有乱码吗？ ///get请求tomcat9和之前的版本，这一行代码是必要的 //response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); out.print(username); } @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { ////接收的中文会有乱码问题吗？ ///post请求 tomcat9和之前的版本，这一行代码是必要的 //request.setCharacterEncoding("UTF-8"); String username = request.getParameter("username"); System.out.println(username); ///响应中文会有乱码吗？ PrintWriter out = response.getWriter(); out.print(username); }}
E:\java学习Ajax\course\course6webajax8.html
<!--测试ajax乱码问题 20--><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>测试ajax乱码问题</title></head><body><script type="text/javascript"> window.onload = function (){ document.getElementById(btn1).onclick = function (){ var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function (){ if (this.readyState==4) { if(this.status==200){ document.getElementById("myp").innerHTML = this.responseText } } } var username = document.getElementById("username").value xhr.open("GET","/ajax/ajaxrequest7username="+username+"&t="+new Date().getTime(),true) xhr.send() } document.getElementById(btn2).onclick = function (){ var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function (){ if (this.readyState==4) { if(this.status==200){ document.getElementById("myp").innerHTML = this.responseText } } } xhr.open("POST","/ajax/ajaxrequest7，true) xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded") var username = document.getElementById("username").value xhr.send("username="+username) } }</script><input type="text" id="username"><button id="btn1">发送ajax get请求，测试乱码问题</button><button id="btn2">发送ajax post请求，测试乱码问题</button><p id="myp"></p></body></html>
3.AJAX的异步和同步213.1什么是异步？什么是同步？21
-ajax请求1和ajax请求2同时并发，没有人需要等待任何人，这就是异步。(a不等b，b不等a)
-如果ajax请求1在发送时需要等待ajax请求2结束后才能发送，那么这就是同步。(a等待b或b等待a，只要等待发生，就是同步。)
代码上如何实现3.2异步和同步？213.2.假设ajax要求121如果第三个参数是false：这意味着“ajax请求1”不支持异步，也就是说，ajax请求1发送后，会影响其他ajax请求的发送。只有当我的请求结束时，你的其他ajax请求才能发送。
false说不支持异步。我的请求发出后，你的其他请求都要靠边站。等着。别动，等我结束了再说。
xhr1.open(“请求方式”URL",false)
xhr1.send()
3.2.假设这是ajax请求221如果第三个参数是true：这意味着“ajax请求2”支持异步请求，即ajax请求2发送后，其他ajax请求的发送不受影响。
xhr2.open(“请求方式”URL",true)
xhr2.send()
com中的代码.bjpowernode.ajax.servlet21Ajaxrequest8Servlet
package com.bjpowernode.ajax.servlet;import jakarta.servlet.ServletException;import jakarta.servlet.annotation.WebServlet;import jakarta.servlet.http.HttpServlet;import jakarta.servlet.http.HttpServletRequest;import jakarta.servlet.http.HttpServletResponse;import java.io.IOException;import java.io.PrintWriter;///演示ajax的同步或异步 21@WebServlet(/ajaxrequest8)public class Ajaxrequest8Servlet extends HttpServlet { @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { try { //设定睡眠时间 Thread.sleep(10*1000); } catch (InterruptedException e) { e.printStackTrace(); } response.setContentType("text/html;chaset=UTF-8"); PrintWriter out = response.getWriter(); out.print(ajax请求1); }}
Ajaxrequest9Servlet
package com.bjpowernode.ajax.servlet;import jakarta.servlet.ServletException;import jakarta.servlet.annotation.WebServlet;import jakarta.servlet.http.HttpServlet;import jakarta.servlet.http.HttpServletRequest;import jakarta.servlet.http.HttpServletResponse;import java.io.IOException;import java.io.PrintWriter;///演示ajax的同步或异步 21@WebServlet(/ajaxrequest9)public class Ajaxrequest9Servlet extends HttpServlet { @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); out.print(ajax请求2); }}
E:\java学习Ajax\course\course6webajax9.html
<!--演示ajax的同步或异步 21--><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>演示ajax的同步或异步</title></head><body><script type="text/javascript"> window.onload = function (){ document.getElementById(btn1).onclick = function (){ var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function (){ if(this.readyState==4){ if(this.status==200){ document.getElementById("p1").innerHTML = this.responseText }else { alert(this.status) } } } //xhr.open("GET","/ajax/ajaxrequest8t="+new Date().getTime(),true) // 我不支持异步。只要我发这个请求，你就得靠边站。t="+new Date().getTime(),true) // 我不支持异步。只要我发送这个请求，你就必须站在一边。你必须等我结束才能发送请求。 xhr.open("GET", "/ajax/ajaxrequest8t=" + new Date().getTime(), false) xhr.send() } document.getElementById(btn2).onclick = function (){ var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function (){ if (this.readyState == 4) { if (this.status == 200) { document.getElementById("p2").innerHTML = this.responseText }else{ alert(this.status) } } } xhr.open("GET", "/ajax/ajaxrequest9t=" + new Date().getTime(), true) xhr.send() } }</script><button id="btn1">ajax请求1</button><p id="p1"></p><button id="btn2">ajax请求2</button><p id="p2"></p></body></html>