前端-fetch-后台：整理笔记

最新推荐文章于 2024-08-02 11:18:39 发布

huas_mcfeng

最新推荐文章于 2024-08-02 11:18:39 发布

阅读量441

点赞数

分类专栏： fetch 文章标签：前端与后台的连接

本文链接：https://blog.csdn.net/qq_41592652/article/details/86482545

版权

fetch 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

前端页面：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
<div class="container">
	<form action="" id="form1" method="get">
	     <label for="name">Name</label>
		 <input type="text" name="name" placeholder="name" value="name">
		 <br>
		 <label for="sex">sex</label>
		 <input type="radio" name="sex" value="男">男
		  <input type="radio" name="sex" value="女">女
		  <br>
		 <label for="addr">Address</label>
		 <input type="text" name="addr" placeholder="addr">
		 <input type="button" value="submit" onclick="tijiao()">
   </form>
</div>
<script>
function tijiao(){
     var fd=new FormData(document.getElementById("form1"));
     fetch('/change/yu?'+encodeURI(Array.from
     (fd.entries()).map(el=>el.join("=")).join("&"))
     ).then(function (aaa){return        
     aaa.text();}).then(function(bb){console.log(bb);});
}

</script>
</body>
</html>

部署到tomacat中：
在文件D:\apache-tomcat-7.0.92\conf\Catalina\localhost\yu.xml（
也就是配置tomacat的xml）
代码如下

<Context docBase="C://Users/mcfeng/Desktop/html"></Context>

复制html上一层的目录；
启动服务器：
访问地址：
localhost:8080/yu(配置xml的名字)/demo.html(前端名字)；
提交表单后
fetch: 跳转到localhost:8080/change/yu（tomacat-path/url-pattern）;
解决编码（有点复杂）：
只有初步的解决方案：

 String a=request.getParameter("name");
	     System.out.println(new String(a.getBytes("ISO-8859-1"),"utf-8"));

在这里插入图片描述
有点麻烦；

huas_mcfeng

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录