vue前端跨域问题解决思路

在前后端分离的开发场景中，我们经常会遇到跨域问题，以下为本人整理的解决方法及思路

一.

如果Content-Type设置为“application/x-www-form-urlencoded;charset=UTF-8”无论是POST请求还是GET请求都是可以通过这种方式成功获取参数，但是如果前端POST请求中的body是Json对象的话，会报上述错误。

解决办法：返回请求参数时更改请求类型及请求头，如下

export function addRegion(params) { // 添加地区数据
  return request({
    url: '/dictionary/item/v1/addAreaItem',
    method: 'post',
    // responseType: 'json',！！
    // headers: { 'Content-Type': 'application/json;charset=UTF-8' },！！
    data : params

  })
}

其他解决方案：vue前端跨域解决方案_小傲哥哥的博客-CSDN博客_vue跨域解决方案

二.如果加上以后报如下错误，一般为后台解析问题(需检查注册中心，配置中心，网关等是否均已开启)

{
    "status":100,
    "msg":"JSON parse error: Unrecognized token 'commLanguageCheck': was expecting ('true', 'false' or 'null'); nested exception is com.fasterxml.jackson.core.JsonParseException: Unrecognized token 'commLanguageCheck': was expecting ('true', 'false' or 'null')  at [Source: (PushbackInputStream); line: 1, column: 19]",
    "pageInfo":null,
    "data":null
}

三、后台处理

可参考此文章：SpringBoot 出现 Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported_feiyst的博客-CSDN博客