React Native如何将文件URL转为二进制并通过Form Data上传至后端？

file: (binary) 本质是要求把本地文件以二进制流形式封装到multipart/form-data格式的请求体中，和id字段一起发送到后端。下面分几种常用开发场景说明具体操作：

Python 实现（基于requests库） #

• 先把file://var/mobile/...路径去掉前缀，拿到真实本地路径，比如file://var/mobile/xx/yy.jpg转成/var/mobile/xx/yy.jpg
• 用requests.post构造请求，通过files参数传递二进制文件，data参数传递id字段：

import requests

# 处理后的本地文件路径
file_path = "/var/mobile/your_target_file"
upload_url = "你的后端上传接口地址"

# 以二进制模式读取文件，构造请求数据
files = {"file": open(file_path, "rb")}
data = {"id": "45451683"}

# 发送上传请求
response = requests.post(upload_url, files=files, data=data)
print(response.status_code)
print(response.text)

JavaScript（Node.js 环境，基于axios库） #

• 先去掉file://前缀转换为本地路径，用fs模块读取二进制文件流：

const axios = require('axios');
const fs = require('fs');
const FormData = require('form-data');

const fileUrl = "file://var/mobile/your_target_file";
const localPath = fileUrl.replace('file://', '');
const uploadUrl = "你的后端上传接口地址";

// 创建文件读取流
const fileStream = fs.createReadStream(localPath);

// 构造Form Data
const formData = new FormData();
formData.append('file', fileStream);
formData.append('id', '45451683');

// 发送请求，自动设置multipart/form-data头部
axios.post(uploadUrl, formData, {
  headers: formData.getHeaders()
})
.then(res => console.log(res.data))
.catch(err => console.error(err));

Swift（iOS 环境） #

• 直接将file://路径转为URL，读取文件二进制数据后构造请求：

import Foundation
import Alamofire

let fileUrl = URL(string: "file://var/mobile/your_target_file")!
let uploadUrl = URL(string: "你的后端上传接口地址")!
let fileData = try! Data(contentsOf: fileUrl)

// 用Alamofire快速实现上传
AF.upload(multipartFormData: { multipartFormData in
    multipartFormData.append(fileData, withName: "file")
    multipartFormData.append("45451683".data(using: .utf8)!, withName: "id")
}, to: uploadUrl)
.response { response in
    debugPrint(response)
}

关键注意事项 #

• 无需手动设置Content-Type: multipart/form-data，大部分HTTP库会在使用Form Data时自动配置
• 读取文件必须用二进制模式，避免编码转换导致文件损坏
• 务必正确处理file://前缀，否则文件读取API无法识别有效路径

内容的提问来源于stack exchange，提问作者coder03