Question

我在将图片发送到服务器时遇到问题，这类似于默认方法，但似乎不起作用。

var source = '/Users/alexx/Library/Developer/CoreSimulator/Devices/44F0FA92-4898-4CFB-862E-4E5EC4C8AB28/data/Containers/Bundle/Application/34BCE695-4B4F-472F-AB5C-F2336AC45273/DoorLock.app/123.jpg';
const form = new FormData();
form.append('image', {
  uri: source,
  type: 'image/jpg',
  name: '123.jpg',
});

const data = () => {
    fetch(api ,{
      method: 'POST',
      body: form,
    })

那是我从服务器得到的响应：

{
  "_bodyBlob": {
    "_data": {
      "__collector": [
        Object
      ],
      "blobId": "78B18938-15BF-4F18-B3C8-1EB30A24D9F8",
      "name": "test.html",
      "offset": 0,
      "size": 192,
      "type": "text/html"
    }
  },
  "_bodyInit": {
    "_data": {
      "__collector": [
        Object
      ],
      "blobId": "78B18938-15BF-4F18-B3C8-1EB30A24D9F8",
      "name": "test.html",
      "offset": 0,
      "size": 192,
      "type": "text/html"
    }
  },
  "bodyUsed": false,
  "headers": {
    "map": {
      "connection": "keep-alive",
      "content-length": "192",
      "content-type": "text/html",
      "date": "Mon, 02 Nov 2020 22:57:21 GMT",
      "server": "PythonAnywhere"
    }
  },
  "ok": false,
  "status": 400,
  "statusText": undefined,
  "type": "default",
  "url": api
}

尽管此python代码可完美运行并获得正确的响应

img = {'file':('123.png', open('the path to the pic/123.png', 'rb'), 'image/png)}
post(api, files = img)

有什么办法可以解决这个问题，或者服务器端无法接收正确参数的问题？

Answer 1

在Formdata中传递文件时，您需要传递3个参数，其中

密钥（在您的情况下为image）。
这将是一个对象，它具有三个名为name，type和uri的属性，其中类型为mime type（例如：image/jpeg）。
文件名

例如：

data.append（“ FilePath”，{ 名称：“ image.png”，类型：“ image / png”， uri：“ content：//com.camera/image.png” }，image.png）

Answer 2

在源字符串的开头添加“ file：//”可解决此问题。所以src看起来像

textContent

然后它可以完美地获取，希望它可以帮助尝试使用formdata发送本地图像的任何人，摘要现在看起来像这样

value

使用formdata将本机发送图像发送到服务器

2 个答案: