html图片文件如何不通过file来post到服务器?

一般上传文件就是利用 浏览器自带的 type=file实现上传,
但是我想问下,能否不通过选择图片,然后发送form表单的方式来上传文件。

之前已经通过该方式上传过图片,页面上图片为以下格式

clipboard.png

所以我想问下 能否带着 src里面的那一串 直接去请求服务器,代替之前的那张图片.
可以的话 麻烦讲个思路或者贴下代码.

我看了下百度的实现方式是第一次后端返回一个url地址,后续就带着url地址去处理.

阅读 3.6k
4 个回答

可以,img中的src对应的值是 经过DataURL编码后的图片,关于DataURL编码,可以先了解下 Data URLs

DataURL中包括的数据本身就是经过Base64编码后的图片,如果你想上传经过Base64编码的图片,需要后端处理,把上传的Base64编码的图片进行解码,写入文件,通过DataURL中的MIME类型,保存对应扩展名就可以了

首先,请问你那一串是怎么来的
其次,若你要上传本地的图片,浏览器是不允许你直接读取的,而是需要你使用它提供的接口;然而它提供的接口之一就是file

FormData了解一下?blob了解一下?

这个时候就要推荐一下我自己的文章了前端文件上传-javascript-ajax

我先来帮你分析一番。现在普遍分为两种情况。
古老型,图标和内容一起提交。前端不需要关注地址是什么传到哪里,后端每次都需要自己接收图片,存图片。
分离型,专门的图片上传服务。图片可以分用途传到对应后台、模块、CDN上。后端不关注传什么图片,图片怎么传,只需要图片的url。

可以构造一个form,把src的数值post过去.

let f=$('form').attr('method','post').attr('src','http://scooterlabs.com/echo');
f.append('input').attr('name','file').attr('value',$('img').attr('src'));
f.submit();

服务器那边接收解析一下就好了.

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题