2018-10-12

作者: 轩爱青 | 来源:发表于2018-10-12 14:38 被阅读0次

    产投集团APP-智慧党建系统
    1、会议创建会议数据提交业务对接

    学习
    1、JS变量作用域提升
    2、HTTP协议之Content-type
    经常使用的Content-type有三种:application/x-www-form-urlencoded | application/json | multipart/form-data

    是因为我不止一次遇到一个问题:前端传了参数(浏览器里面可以看见是传了的),但是后端没有接收到。一开始我用axios和写go的后端遇到过,后来我用vue-resource和写java的后端又遇到了。奇怪的是我用原生的ajax来请求又没了问题。后来在使用postman来测试的时候,发现好像他们的Content-type有一些区别,大概知道了原因,但是因为懒也没有去深究,但是最近我同事又遇到了,又让我勤快了一些
    经常使用的Content-type有三种:application/x-www-form-urlencoded | application/json | multipart/form-data

    先通过浏览器来看看他们传输数据时候的样子

    application/x-www-form-urlencoded 如图:

    image

    application/json 如图:

    image

    比较这两个地方可以发现他们传输数据的方式是不同的。前者是使用 urlencoded 的方式,也就是 'msg=send&id=1';

    后者是使用json格式,直接是json字符串,也就是JSON.stringify({msg: "send json"});

    //urlencoded格式

    xmlHttp.send(``'msg=send&id=1'``)

    //json格式

    xmlHttp.send(JSON.stringify({msg: ``"send json"``}));

    通过form表单不设置enctype属性提交的时候,默认就是****application/x-www-form-urlencoded** 。**

    之所以,浏览器看见前端传了数据后端接受不到;主要原因是前后端没有约定好数据的格式,或者是忽略掉了。我之前遇到的问题出现的原因是:使用的axios和vue-resoure传的是json字符串给后端,但是后端又是用的 urlencoded 格式来接收的。所以出现了使用axios请求不行,但是自己写了个原生的ajax也可以正常访问。

    以node为例:

    app.use(bodyParser.json()); ``// for parsing application/json

    app.use(bodyParser.urlencoded({ extended: ``true })); ``// for parsing application/x-www-form-urlencoded

    它针对于web页面上传过来的 不同content-type 的数据都作出了相应的处理,否则是接收不到数据的。(其他语言又不同的处理方式。。。。嗯。。具体怎么我就不太清楚了)

    总之,最好事先沟通好这个部分(虽然一般情况都是不会出问题的,因为前端可以通过设置Content-type来调整),这样严谨一些。

    最后、multipart/form-data:

    用来上传文件,可以将文件以“流”的形式传给后端,后端通过流去接收。

    如图:

    image

    相关文章

      网友评论

        本文标题:2018-10-12

        本文链接:https://www.haomeiwen.com/subject/dycgaftx.html