axios({ method: 'get', url: '/BookShopSystem_war/getQueryBook/' + bookName@GetMapping("/getQueryBook/{bookName}") @ResponseBody public Map<String, Object> getQueryBook(@PathVariable("bookName") String bookName) { List<Book> queryBookList = bookService.getQueryBook(bookName); HashMap<String, Object> result = new HashMap<>(); result.put("code", 0); result.put("msg", "success"); result.put("data", queryBookList); return result; }<select id="getQueryBook" parameterType="String" resultMap="bookResult"> select * from book where book_name like CONCAT('%',#{bookName},'%') </select>传递的参数会乱码
时间: 2024-03-23 14:41:33 浏览: 35
这段代码使用了Spring Boot框架和MyBatis进行Web开发,前端使用了Axios库发送了一个GET请求,请求的url中包含了查询的书名参数。后端使用了Spring Boot的注解`@GetMapping`和`@PathVariable`来获取参数值,并将参数值传递给MyBatis的mapper进行数据库查询。
如果参数出现了乱码,可以尝试以下解决方法:
1. 确认前后端字符集是否一致,如果不一致则需要对字符集进行统一。
2. 在前端将查询字符串进行编码,使用encodeURIComponent()函数进行编码。后端在接收到查询字符串后,使用decodeURIComponent()函数进行解码。
3. 在Spring Boot的配置文件中指定字符集,例如:
```
spring.datasource.url=jdbc:mysql://localhost:3306/dbname?useUnicode=true&characterEncoding=utf8
```
这样可以确保Spring Boot和数据库之间使用一致的字符集进行数据传输。
4. 在mapper中使用Java内置的URLEncoder类对参数进行编码,例如:
```
select * from book where book_name like CONCAT('%',#{bookName, jdbcType=VARCHAR},'%')
```
在Java代码中,将参数进行编码:
```
String encodedParam = URLEncoder.encode(bookName, "UTF-8");
```
然后将编码后的参数传递给mapper。
以上任何一种方法都可以解决参数乱码的问题。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
{{ collect.bookName }} ¥{{ collect.bookPrice }} <button @click="delCollect()"> × </button> new Vue({ el: "#app", data: { userId: '', collectBook: [] }, mounted() { var _this = this; axios.get('/BookShopSystem_war/getUserId') .then((response) => { this.userId = response.data; var userId = this.userId; // 将userId赋值给一个变量 axios({ method: 'get', url: 'http://localhost:8080/BookShopSystem_war/getCollectBook/' + userId }).then(function (result) { var code = result.data.code; var data = result.data.data; if (code == 200) { _this.collectBook = data; } console.log(data) }) }) .catch((error) => { console.log(error); }); }, methods: { delCollect() { var _this = this; axios({ method: "delete", url: "http://localhost:8080/BookShopSystem_war/deleteCollect", data: { userId: _this.userId, bookId: _this.collectBook.bookId } }).then(resp => { alert("取消收藏"); }) } }该取消收藏方法有错,给出原因并纠正
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
这是前端代码
{{ collect.bookName }} ¥{{ collect.bookPrice }} <button @click="delCollect(collect.bookId)"> × </button> new Vue({ el: "#app", data: { userId: '', collectBook: [] }, mounted() { var _this = this; axios.get('/BookShopSystem_war/getUserId') .then((response) => { this.userId = response.data; var userId = this.userId; // 将userId赋值给一个变量 axios({ method: 'get', url: 'http://localhost:8080/BookShopSystem_war/getCollectBook/' + userId }).then(function (result) { var code = result.data.code; var data = result.data.data; if (code == 200) { _this.collectBook = data; } console.log(data) }) }) .catch((error) => { console.log(error); }); }, methods: { delCollect(bookId) { var _this = this; axios({ method: "delete", url: "http://localhost:8080/BookShopSystem_war/deleteCollect", data: { userId: _this.userId, bookId: bookId } }).then(resp => { alert("取消收藏"); // 从 collectBook 数组中移除被删除的收藏 _this.collectBook = _this.collectBook.filter(collect => collect.bookId !== bookId); 请分析逻辑是否有误
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)