SpringBoot+Vue进行前后端交互中文为??的问题

弄系统的时候,发现带中文的数据插入数据库时,为??,改bug改了一晚上,最后发现是application.properties文件中,连接数据库的配置没弄好。

一、首先要确定前后端传输的编码一致,需要重写WebMvcConfigurer类的extendMessageConverters()方法

代码如下

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.http.converter.HttpMessageConverter;
import org.springframework.http.converter.StringHttpMessageConverter;
import org.springframework.web.filter.CharacterEncodingFilter;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

import java.nio.charset.StandardCharsets;
import java.util.List;

@EnableWebMvc
@Configuration
public class WebCharacterEncodingFilter implements WebMvcConfigurer {

     /**
     * 乱码处理
     */
    public HttpMessageConverter<String> responseBodyConverter() {
        final StringHttpMessageConverter converter = new StringHttpMessageConverter(StandardCharsets.UTF_8);
        converter.setWriteAcceptCharset(false);
        return converter;
    }

    @Override
    public void extendMessageConverters(List<HttpMessageConverter<?>> converters) {
        if (converters.size() > 0) {
            converters.add(converters.get(0));
            converters.set(0, responseBodyConverter());
        } else {
            converters.add(responseBodyConverter());
        }
    }

}

二、要修改 application.properties文件

spring.datasource.url=jdbc:mysql://localhost:3306/tp_music?serverTimezone=Asia/Shanghai&useUnicode=true&characterEncoding=utf8&useSSL=false

时区和地区后面,要加上&useUnicode=true&characterEncoding=utf8&useSSL=false,这里要看你建的数据库的编码,utf8的话就用这个。

最后完美解决

 

  • 6
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Java后端分离的架构中,前端和后端是独立部署的两个应用程序,因此后端无法直接重定向到前端的Vue页面。通常情况下,前端和后端之间通过RESTful API进行通信,前端通过AJAX请求后端API获取数据并渲染页面。 如果你需要实现后端重定向到前端的Vue页面,可以采取以下两种方式: 1. 通过HTTP代理实现重定向 在这种方式中,你可以在后端应用程序中配置一个HTTP代理,将前端Vue应用程序的URL地址映射到后端应用程序的URL地址。当客户端请求前端Vue页面时,后端应用程序会将请求转发到前端Vue应用程序,并将前端Vue应用程序的响应发送给客户端浏览器。 下面是一个使用Nginx作为HTTP代理的示例配置: ``` location /vue-page { proxy_pass http://localhost:8080; } ``` 在上面的配置中,我们将请求URL地址中包含`/vue-page`的请求转发到`http://localhost:8080`地址。在这里,`http://localhost:8080`是前端Vue应用程序的地址。当客户端请求`/vue-page`时,Nginx会将请求转发到前端Vue应用程序,并将前端Vue应用程序的响应发送给客户端浏览器。 2. 重定向到前端路由地址 在这种方式中,你可以在后端应用程序中将请求重定向到前端Vue应用程序的路由地址。当客户端浏览器接收到重定向响应时,会自动跳转到前端Vue应用程序的路由地址,并显示对应的页面。 下面是一个使用Spring Boot实现后端重定向到前端Vue页面的示例代码: ``` @Controller public class MyController { @RequestMapping("/vue-page") public String vuePage() { // 重定向到前端路由地址 return "redirect:/vue-page/home"; } } ``` 在上面的代码中,我们将请求重定向到前端Vue应用程序的`/vue-page/home`路由地址。当客户端浏览器接收到重定向响应时,会自动跳转到前端Vue应用程序的`/vue-page/home`路由地址,并显示对应的页面。 需要注意的是,在采用这种方式时,前端Vue应用程序必须已经加载并启动,否则客户端浏览器无法跳转到前端Vue应用程序的路由地址。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值