后端接口测试正常,前端Ajax数据传输到后端数据类型不匹配的问题后遇到的一系列问题

标题form表单post到后端数据类型为x-www-form-urlencoded,后端显示not support

我的解决办法:
在前端ajax属性中加
contentType:“application/json;charset=utf-8”,

后端方法中参数的注解为@Responsbody

但紧接而来跨域问题:
跨域问题截图
我不禁疑问:为什么会出现跨域问题呢?

	浏览器同源策略:协议、域名、端口都要一致。不然容易收到xss、CSFR等攻击
	(我的在前端测试是8848 ~~疑惑.jpg~~ ,后端接口8080。接口不一致,跨域问题出现)
	因同源策略限制的行为:
	1、cookie、local storage和indexdb不能读取。
	2、dom和js对象不能获取,
	3、Ajax请求不能发送(我的问题就这)。

跨域解决方案:
1、jsonp,只支持get,不支持post
2、后端HTTP client转发,两次请求
3、服务器设置相应,允许跨域(可能不安全),以下:

1、后端加上注解@crossorigin(注解用法百度一哈,我就是用的这种方式,从后端解决跨域问题,
	controller层的类都加一个吧。)
2、后端用上token,防止跨站请求(增加安全系数):
	后端token怎么写百度
	前端token存在localstoage或者sessionstorage,一个存储长期,一个在会话期间存储
	(关闭浏览器就自动clean存储的token)。
	sessionStorage.变量名 = 变量值	// 保存数据
    sessionStorage.变量名	// 读取数据
    sessionStorage.clear()	// 清除所有

好了,Ajax可以和后端交互数据了,前端也接收到后端传来的html格式的数据
后端设置的交互到前端的数据类型
那前端怎么使用这些数据呢?
1、将后端传输类型改为json,就能愉快的使用Ajax里success(data),然后data.属性。
2、用var jdata = json.parse(data),转换一下,然后就又可以愉快的jdata.属性了。
3、在Ajax里定义属性dataType:“json”,就会把响应数据转化为json对象,和上面的2一样的。

暂时就先到这里,后面继续补充。。。。。。。。。

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值