最近入了一台高拍仪,供应商给的API文档中的demo是使用jq写的,基本都是通过操作dom实现的调用方法,想修改为自己熟悉的使用方法调用的方式,以便在vue中可以更好的使用。
在自己的vue项目中单独调用高拍仪给的API时,简单的图片显示(通过img的src拼接url)都可以很方便的从jq的操作dom,转换为vue的响应式方式展示。
但是复杂一点的动作,像拍照、修改分辨率等API使用自己封装的axios请求就会报响应为空的错误。
现在需求就是:jq、ajax、dom的项目demo --> vue、axios、响应式。
出现的问题:请求响应为空。
解决方案:
经过与供应商提供的demo中请求的比对,发现是我自己的请求中缺少Connection: keep-alive
试着添加后,受自己已经封装的请求文件request.js影响,所以单独在页面中引入axios修改请求参数,按照demo中的参数形式传参调用API。然后发请求,响应200,OK了!
但是新出现了一个问题,查了一下是因为在HTTP/1.1协议中,Connection头部字段已经成为一个保留字段。这意味着它只能由浏览器和服务器自己使用,并且不能由JavaScript代码手动设置。
出于安全考虑,最后没采用修改connection:keep-alive的方法,也不建议修改。
baidu了好久最后是新封装了一个axios方法调用也OK,可以成功调用API。
查看禁止修改的请求头:禁止修改的标头 - MDN Web 文档术语表:Web 相关术语的定义 | MDN
记录下自己遇到的小问题,如有问题,请各位大佬批评指正。🙆