前言

忘了在哪里看到的这个题目,觉得挺有意思,来说下我的答案及思考过程。

首先,我们要知道的是,图片一般有两种传输方式:base64 和 file 对象。

base64 图片

图片的base64编码想必大家都见过:

base64 的本质是字符串,而 GET 请求的参数在 url 里面,所以直接把图的 base64 数据放到 url 里面,就可以实现 GET请求传图片。

input 输入框拿到的图是 file 对象,图片 file 对象转 base64 :

// img参数: file文件或者blobconst getBase64 = img => {  return new Promise((resolve,reject) => {    const reader = new FileReader();    reader.onload = e => {      resolve(e.target.result);    };    reader.onerror = e => reject(e);    reader.readAsDataURL(img);  })}

问题来了,GET 请求的 url 长度是有限制的,不同的浏览器长度限制不一样,最长的大概是 10k 左右,根据 base64 的编码原理,base64 图片大小比原文件大小大 1/3,所以说 base64 只能传一些非常小的小图,大图的 base64 太长会被截断。

但其实这个长度限制是浏览器给的,而不是 GET 请求本身,也就说,在服务端,GET 请求长度理论上无限长,也就是可以传任意大小的图片。

file 对象

我们来看看这个场景:

    

选择图片,然后提交表单,能提交成功,但是接口收不到文件。请求的 url 会变成 http://localhost:8080/?logo=xxx.png ,但是不会携带图片数据。

正常情况,file 对象数据是放在 POST 请求的 body 里面,并且是 form-data 编码。

那么 GET 请求能否有 body 体呢?答案是可以有。

GET 和 POST 并没有本质上的区别,他们只是 HTTP 协议中两种请求方式,仅仅是报文格式不同(或者说规范不同)。

做过底层开发的同事可能比较熟悉,之前我们C语言的同事和我讲,我们的 HTTP 请求,他们收到是这样子的:

举个例子, 一个普通的 GET 请求,他们收到是这样的:

GET /test/?sex=man&name=zhangsan HTTP/1.1Host: http://localhost:8080Accept: application/json, text/plain, */*Accept-Encoding: gzip, deflateAccept-Language: zh-CN,zh;q=0.9Connection: Keep-Alive

POST 请求长这样:

POST /add HTTP/1.1Host: http://localhost:8080Content-Type: application/x-www-form-urlencodedContent-Length: 40Connection: Keep-Alivesex=man&name=Professional 

同样,DELETE、PUT、PATCH 请求,也都是这样的报文。底层解析这个报文的时候,并不关心是什么请求,所以说 GET 请求也可以有 body 体,也可以传 form-data 数据。

有兴趣的可以拿 postman 试一下,看看 GET 请求传图片,接口能不能收到图片文件:

结尾

综上所述,GET 请求是可以传图片的,但是 GET 和 POST 的规范还是要遵守的,如果有后台让你这么做,锤他就行了!

本地图片转base64_从一道面试题说起:GET 请求能传图片吗?相关推荐

  1. 阿里二面:GET 请求能传图片吗?

    欢迎关注方志朋的博客,回复"666"获面试宝典 从一道面试题说起:GET 请求能传图片吗? 「前言」 曾经遇到的面试题,觉得挺有意思,来说下我的答案及思考过程. 首先,我们要知道的 ...

  2. base64转图片_从一道面试题说起:GET 请求能传图片吗?

    前言 忘了在哪里看到的这个题目,觉得挺有意思,来说下我的答案及思考过程. 首先,我们要知道的是,图片一般有两种传输方式:base64 和 file 对象. base64 图片 图片的base64编码想 ...

  3. GET 请求能传图片吗?

    程序员的成长之路 互联网/程序员/技术/资料共享 关注 阅读本文大概需要 2.4 分钟. 作者:沉末 原文地址:https://juejin.im/post/6860253625030017031 前 ...

  4. 每日一道面试题(第7期)---Android补间动画与属性动画的区别

    零零碎碎的东西总是记不长久,仅仅学习别人的文章也只是他人咀嚼后留下的残渣.无意中发现了这个每日一道面试题,想了想如果只是简单地去思考,那么不仅会收效甚微,甚至难一点的题目自己可能都懒得去想,坚持不下来 ...

  5. h5 bootstrap 小程序模板_一道面试题小程序与H5的区别

    抛砖 此文是一道面试题,又不仅仅是一道面试题 面试题,在各个技术社区里都是一个永不落伍的话题,好像大多数人临面试前都会狂刷面试题,恨不得把所有面试题都看一遍,要说有用没,当然有用,因为大部分面试题确实 ...

  6. android 属性动画 补间动画,每日一道面试题(第7期)---Android补间动画与属性动画的区别...

    零零碎碎的东西总是记不长久,仅仅学习别人的文章也只是他人咀嚼后留下的残渣.无意中发现了这个每日一道面试题,想了想如果只是简单地去思考,那么不仅会收效甚微,甚至难一点的题目自己可能都懒得去想,坚持不下来 ...

  7. 「一道面试题」输入URL到渲染全面梳理中-页面渲染篇

    前置知识 此文是一道面试题,又不仅仅是一道面试题,不过这道题共分了三篇来说,嗯..可想而知 接上文,上文我们讲了网络通信的部分,详细请看「一道面试题」输入URL到渲染全面梳理上-网络通信篇, 那么该说 ...

  8. 从一道面试题谈谈一线大厂码农应该具备的基本能力

    作者:Yura Shevchenko 来源:skypixel.com 关于一线码农的面试,我想说 求职面试在绝大部分人来说都是必不可少的,自己作为求职者也参与了不少面试(无论成功或者失败),作为技术面 ...

  9. 有的线程它死了,于是它变成一道面试题

    来自:why不止技术 有些线程它活着,但它躺在池中碌碌无为: 有的线程它死了,于是它变成一道面试题. 这次的文章,要从一次阿里巴巴的面试说起. 我记得那天是周一,刚刚经历过周末过的放松,干劲十足的我正 ...

最新文章

  1. 区分真实模式的两个标准
  2. 机器学习实战读书笔记--朴素贝叶斯
  3. BSS段,数据段,代码段,堆内存和栈
  4. vue 源码学习(一) 目录结构和构建过程简介
  5. 改善代码可读性的5种方法
  6. CNN中全连接层是什么样的
  7. win10共享打印错误0x0000006_Win7打印机无法共享提示错误代码0x000006d9的解决方法...
  8. 你知道怎么用Python发送邮件吗?
  9. c++ 宏 stdin 和 STDIN_FILENO 区别
  10. multipartfile获取文件路径_已知路径,通用获取文件名、后缀、类型
  11. 机器人学导论学习笔记(持续更新)
  12. VB程序设计教程(第四版) 龚沛曾
  13. h3c交换机配置教程命令(新手配置交换机详细教程)
  14. 雷达原理---时频分析--1.基本概念
  15. linux权限管理的设计,Linux权限管理漫谈之用户切换
  16. three.js实现3D室内全景看房
  17. 【转帖】赤壁之战,曹操大败只因缺了Service Mesh
  18. 结束拒绝访问的进程 cmd下结束进程 强行结束进程
  19. dcs常用的冗余方式_DCS的冗余
  20. NodeJs模块化(KPD)

热门文章

  1. 计算机二级2021辅导书,2021该如何准备计算机二级考试?
  2. 我对模板模式和策略模式的理解
  3. [Swift]LeetCode781. 森林中的兔子 | Rabbits in Forest
  4. 使用docker中mysql镜像
  5. 官方一步解决各种Windows更新问题
  6. python 学习笔记十九 django深入学习四 cookie,session
  7. chapter16 计算机体系结构基础
  8. Linux 指令篇:档案目录管理--chown
  9. C#下把txt文件数据读进sql server中存储所遇到的乱码问题
  10. 几个不错的自己到的少的游戏站