0
点赞
收藏
分享

微信扫一扫

【话题】评价GPT-4o:从革命性技术到未来挑战

软件共享软件 06-16 14:00 阅读 3

使用原生 java 与原生 js 

html部分

<!DOCTYPE html>

<!-- 来源 -->
<!-- https://cloud.tencent.com/developer/article/1705089 -->
<!-- https://geek-docs.com/ajax/ajax-questions/19_ajax_javascript_send_json_object_with_ajax.html -->
<!-- 配合java后端可以监听 -->
<!-- //原文链接:https://blog.csdn.net/xietansheng/article/details/78704783 -->

<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Title</title>
		<script>
			function fun() {
				// 创建XMLHttpRequest对象
				var xhr = new XMLHttpRequest();

				// 设置请求类型和URL
				// xhr.open('POST', 'http://example.com/api', true);
				// xhr.open('POST', 'http://localhost:8080/aa', true);
				// xhr.open('POST', '/aa', true);
				// xhr.open('POST', 'http://localhost:8080/aa', true);
				xhr.open('POST', 'http://localhost:8080', true);
				// 内网穿透之后可响应
				// xhr.open('POST', 'http://mygamefoundation.all123.net:8080/', true);
				// xhr.open('POST', 'https://cn-sx-bgp-tmp1.natfrp.cloud:20504/', true);
				// xhr.open('POST', 'www.baidu.com', true);
				// 设置请求头
				xhr.setRequestHeader('Content-Type', 'application/json');

				console.log("请求头已设置\n");
				// 监听服务器响应

				// 构建JSON对象
				var data = {
					name: 'John',
					age: 25,
					email: 'john@example.com'
				};

				// 将JSON对象转换为字符串
				var jsonData = JSON.stringify(data);

				// 发送数据
				// xhr.send(jsonData);
				// 所有的 send 注释掉就会爆 POST 错误提示
				// xhr.send("6655ookk\n");
				let sendText = document.getElementById("message").value
				
				xhr.send(sendText);
				
				//4、接收及处理响应结果,当服务器响应成功了再获取
				xhr.onreadystatechange = function() { //当xmlhttp对象就绪状态改变时会触发事件
					if (xhr.readyState == 4 && xhr.status == 200) { //请求已完成且响应就绪,响应状态码为200
						alert(xhr.responseText);
						console.log(xhr.responseText);
						console.log("检测的正确的返回\n");
						// 把数据写进网页里,动态增加数据
						// https://blog.csdn.net/jerrcy_fly/article/details/69367264
						// document.write(xhr.responseText);
						// document.write("<h1 id=\"h2\">通过document.write输出内容</h1>");

						// 动态追加数据
						// https://segmentfault.com/q/1010000007420031
						var element = document.getElementById("div1");
						var para = document.createElement("p");
						var node = document.createTextNode("这是新段落。");
						var nodev2 = document.createTextNode(xhr.responseText);
						para.appendChild(node);
						para.appendChild(nodev2);
						element.appendChild(para);

					} else {
						console.log("检测到错误的返回\n");
					}
					console.log("检测到返回函数\n");
				};

			}
		</script>
		
<!-- 这里注释的脚本不会执行 -->
<!-- 	<script>
		var para = document.createElement("p");
		var node = document.createTextNode("这是新段落。");
		para.appendChild(node);

		var element = document.getElementById("div1");
		element.appendChild(para);
	</script> -->

	</head>
	<body>
		<input type="button" value="发送异步请求" onclick="fun();">
		<input type="text" id="message">
		<div id="div1">
			<p>old</p>
		</div>
	</body>
	<!-- 在nody之后放置脚本就会在后面增加数据 可见在body之后执行数据-->
	<script>
		var para = document.createElement("p");
		var node = document.createTextNode("这是新段落。");
		para.appendChild(node);

		var element = document.getElementById("div1");
		element.appendChild(para);
	</script>
</html>

java服务器部分

package Httpv3;

import java.io.IOException;
import java.net.InetSocketAddress;
import java.nio.charset.StandardCharsets;
import java.util.Arrays;

import com.sun.net.httpserver.HttpExchange;
import com.sun.net.httpserver.HttpHandler;
import com.sun.net.httpserver.HttpServer;

public class freshHttp {
	public static void main() throws IOException {
//		创建服务器,绑定端口
		HttpServer httpServer = HttpServer.create(new InetSocketAddress(8080), 0);
//		绑定消息检测,"/"表示接收所有来源的消息,例如"/aa"是接收aa开头的消息
		httpServer.createContext("/", new MyHttpHandler());
		// 启动服务
		httpServer.start();
	}
//	只有在内部static 才行
	static class MyHttpHandler implements HttpHandler {
		@Override
		public void handle(HttpExchange httpExchange) throws IOException {
//			打印请求头数据
			System.out.println("addr: " + httpExchange.getRemoteAddress() + // 客户端IP地址
					"; protocol: " + httpExchange.getProtocol() + // 请求协议: HTTP/1.1
					"; method: " + httpExchange.getRequestMethod() + // 请求方法: GET, POST 等
					"; URI: " + httpExchange.getRequestURI()); // 请求 URI
			// 获取请求头
			String userAgent = httpExchange.getRequestHeaders().getFirst("User-Agent");
			System.out.println("User-Agent: " + userAgent);

			byte[] respContents = ("<?xml version=\"1.0\" encoding=\"UTF-8\"?>\r\n" + "<note>\r\n" + "  <to>Tove</to>\r\n"
					+ "  <from>Jani</from>\r\n" + "  <heading>Reminder</heading>\r\n"
					+ "  <body>Don't forget me this weekend!</body>\r\n" + "</note>" + "小白同学和哲同学的秘密基地").getBytes("UTF-8");
			httpExchange.getResponseHeaders().add("Access-Control-Allow-Origin", "*");
			httpExchange.getResponseHeaders().add("Access-Control-Allow-Headers", "*");
//			httpExchange.getResponseHeaders().add("Access-Control-Allow-Headers", "Content-Type");
			httpExchange.getResponseHeaders().add("Content-Type", "text/html; charset=UTF-8");
			// 设置响应code和内容长度
			httpExchange.sendResponseHeaders(200, respContents.length);

			// 设置响应内容
			httpExchange.getResponseBody().write(respContents);
//			接收请求数据
			byte[] receivev3 = httpExchange.getRequestBody().readAllBytes();
			System.out.println(Arrays.toString(receivev3));

//	         字节流转字符流
			String utf_8 = new String(receivev3, StandardCharsets.UTF_8);
			System.out.println(utf_8);

			// 关闭处理器
			httpExchange.close();
		}
	}
}
举报

相关推荐

0 条评论