# `Laravel` 和 `Vue.js` 使用 `Axios` 通过 `Put` 请求上传文件 获取不到 `Request` 数据,通过 post 传递 form 表单添加隐藏方法 `_method='put'` 解决(踩坑记录)

LaravelVue.js 使用 Axios 通过 Put 请求上传文件 获取不到 Request 数据,通过 post 传递 form 表单添加隐藏方法 _method='put' 解决(踩坑记录)

说明:上传 Excel 文件做了两天了,卡在了获取上传文件数据这里,采用了 Vue.js 作为前端技术栈,通过 Axios 进行接口数据请求,所以查到 Axios 官方提供了上传文件示例

问题出现

通过官方 put 方式提交数据,获取不到 Request 信息,直接 Log 中打印出来是空数组(后悔当初没使用 post)

下面为犯错步骤还原:

在 Vue 组件中采用 Axios 官方是上传文件示例

在 Vue 组件中采用 Axios 官方是上传文件示例.png

Laravel路由方式采用 put

Laravel路由方式采用 put.png

使用 chrome Dev Tools 查看 put 请求

使用 chrome Dev Tools 查看 put 请求.png

控制上传方法,这里主要想在 laravel 日志中打印上传的数据,判断服务器是否成功获取上传数据

判断服务器是否成功获取上传数据.png

Log 中并没有数据

Log 中并没有数据.png

中间就是漫长的 2B 试错之旅了

我开始想的问题是:

1.是不是 new formData()这个对象出了问题,然后去查 官方文档,最后发现这是 H5.js 中的也就是 javascript 原生的对象,不应该出问题。。。

2.之后又联想到只传递普通键值对 formdata 试试,发现仍然不能获取到数据:
只上传键值对

只上传键值对.png

Log 依然没有数据

Log 依然没有数据.png

3.没办法了,换成 post 上传试试,结果发现有数据了。。。
修改为post 路由

修改为post 路由.png

Controller 方法修改显示请求方式

Controller 方法修改显示请求方式.png

Log 有数据

Log 有数据.png

至此,试错完毕


问题解决,想想就知道可能是 put 方法并没有被 laravel 正确解读,官方文档中也有 form-method-spoofing 说明,按部就班:

web.php 路由

web.php 路由.png

Controller 方法

Controller 方法.png

Vue 组件 Axios

Vue 组件 Axios.png

Log 有数据

Log 有数据.png

至此,数据获取成功。

总结

归根结底是我没有想到 axios其实也是 ajax 提交,需要 _method 隐藏方法提交,最关键的是我被 laravel 日志误导了,当我使用 put 方法直接提交的时候是可以出发控制器方法的(也就是可以打印出空数组),所以我会当成其实请求发送成功并且成功提交的控制器方法中。。。。。。。。。。。。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,911评论 5 460
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 82,014评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 142,129评论 0 320
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,283评论 1 264
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,159评论 4 357
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,161评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,565评论 3 382
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,251评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,531评论 1 292
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,619评论 2 310
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,383评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,255评论 3 313
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,624评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,916评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,199评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,553评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,756评论 2 335

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,497评论 18 139
  • 原文链接 必备品 文档:Documentation API:API Reference 视频:Laracasts ...
    layjoy阅读 8,593评论 0 121
  • 医院,再也不见! 寒风瑟瑟的天气,关节又在隐隐作痛,办公室里的咳嗽声也此起彼伏。怎样保养才能缓解不适,远离医院?让...
    纳谷nakko阅读 2,648评论 10 45
  • 今年我24生活在二三先线城市,前23年过得也还算平淡,辗转努力打拼进了一家医院当护士,那年20岁。我不知道我以后还...
    以西小卒阅读 167评论 1 0
  • 昨天的我一整天都有些精神恍惚,因为上海携程亲子园的事件。说实话,我根本不敢点开视频,只看了几张图片和描述...
    瞳小甜Rosie阅读 260评论 0 0