由于浏览器的安全限制，通过js的onchange事件获取上传文件的路径时，返回的是C:fakepath文件名，隐藏了真实的物理路径，可以使用window.URL.createObjectURL()返回一个Blob对象，Blob对象就是二进制数据，它是一个包含有只读原始数据的类文件对象
组件upload：
当点击按钮时触发SendDocument方法
this.$refs.upload.submit();会触发beforeUpload方法
打印结果如下：
就可以把blob对象传给extrinsicFileName（表单里的一个字段）
这样可以把表单的数据提交给后台了
那么重点是，你为什么要获取上传文件的路径？
我是一个初学者，刚刚开始学习做上传文件这个功能，简单以为要把文件路径返回给后台，通过他们去获取上传文件的数据。
那么上传文件功能实际上是不需要获取文件路径的，而是通过二进制流传过去的，上面的blob对象其实就是表示文件的二进制数据，通过文件流的方式传输，在计算机里所有的对象都是通过二进制流传输的。Blob对象是File类型的父类型，就是Flie对象通过slice（）读取整个文件的部分数据。File包含name、size、type等属性，Blob有size、type属性。所以上传文件是直接把客户端的文件数据发送到服务端，不是文件路径，而是整个文件的数据，客户端下载服务端的就可以通过服务端的路径找到服务端的文件，服务端是没有办法通过路径访问客户端文件的。
除非是，服务端返回一个路径，比如“c:/aa.txt”，然后客户端收到这个路径，通过代码找到这个文件，之后再把这个aa.txt整个文件数据发送给服务端，其实说到底还是客户端把整个文件数据发送给服务端。
基础没打牢就开始学习框架，我开始怀疑自己是不是走错路线了，不过学习总是一个循序渐进的过程，不可能是直线式的，想和大家多交流，所以以后还请大家多多指教。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/107106.html
摘要：对于前端人员来说，图片处理是一个很常见的需求，由于图片稍微特殊，现在多数做法都是使用调用接口通过方法来提交，例如方法提交，后台处理后返回一个图片路径给前端，前端根据这个路径写入标签，但是基于当前的前后端分离的开发模式下，前后端代码往往不在同 对于前端人员来说，图片处理是一个很常见的需求，由于图片稍微特殊，现在多数做法都是使用调用ajax接口通过http方法来提交，例如post方法提交，...
摘要：以下中使用浏览器端上传图片到七牛云，下面只是做一些简单的流程实例。你的控制器地址请求成功之后，调用刚刚写好的方法，把传入过去让页面初始化的时候就请求这里差不多就可以啦，更多的操作参考文档七牛云官方文档 以下Laravel中使用浏览器端上传图片到七牛云，下面只是做一些简单的流程实例。详情请看官方文档七牛云官方js文档 1. 首先引入相应的js文件，下面是通过CDN引入的Staticfi...
摘要：以下中使用浏览器端上传图片到七牛云，下面只是做一些简单的流程实例。你的控制器地址请求成功之后，调用刚刚写好的方法，把传入过去让页面初始化的时候就请求这里差不多就可以啦，更多的操作参考文档七牛云官方文档 以下Laravel中使用浏览器端上传图片到七牛云，下面只是做一些简单的流程实例。详情请看官方文档七牛云官方js文档 1. 首先引入相应的js文件，下面是通过CDN引入的Staticfi...
摘要：后来查阅了资料后自己手动实现了文件切片上传到服务器基本需求已经实现，但由于效率及稳定性问题后来决定还是直传文件到七牛云。总结起来七牛云上传的套路就是后台为你提供或者获取的接口地址之后上传的时候要带上这个。 起因 最近在工作中有个上传大文件的需求，原先咨询过组里的大佬给我推荐了百度的webupload，但后来引入之后发现它是基于jquery封装的。由于本身项目是基于vue开发的所以与j...
阅读 856·2023-04-26 03:02
阅读 937·2023-04-25 19:18
阅读 2386·2021-11-23 09:51
阅读 2398·2021-11-11 16:55
阅读 2422·2021-10-21 09:39
阅读 1503·2021-10-09 09:59
阅读 1786·2021-09-26 09:55
阅读 3264·2021-09-26 09:55
