[英]pass base64 string in POST call react native
我正在尝试将世博会的图像选择器返回的 base64 字符串传递给 POST api 调用。 以下是代码片段
var { cancelled, uri, base64 } = await ImagePicker.launchCameraAsync({
mediaTypes: ImagePicker.MediaTypeOptions.Images,
base64: true,
});
const payload = {
File_String: base64,
};
let response = await fetch(route, {
method: "POST",
headers: {
Authorization: token,
Accept: "application/json",
"Content-Type": "application/json",
},
body: JSON.stringify(payload),
});
let responseJson = await response.json();
后端 api 系统已使用 .net 内核开发。 expo 的 imagepicker 返回的 Base64 字符串很长,当使用 fetch 调用发送时,后端没有收到它。 我从客户端到后端的所有其他调用都正常工作,除了这个,唯一的区别是我在有效负载中发送大的 base64 字符串。
我无法弄清楚为什么调用失败以及我是否需要对获取调用(即客户端/api 端即后端)进行任何特殊设置,以便发送 n 接收 base64 字符串值?
谁能指导我关于无法通过 base64 字符串从反应原生到 .net 核心 api 的原因/错误?
问候,
方法一:
var base64Icon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAwBQTFRF7c5J78kt+/Xm78lQ6stH5LI36bQh6rcf7sQp671G89ZZ8c9V8c5U9+u27MhJ/Pjv9txf8uCx57c937Ay5L1n58Nb67si8tVZ5sA68tJX/Pfr7dF58tBG9d5e8+Gc6chN6LM+7spN1pos6rYs6L8+47hE7cNG6bQc9uFj7sMn4rc17cMx3atG8duj+O7B686H7cAl7cEm7sRM26cq/vz5/v767NFY7tJM78Yq8s8y3agt9dte6sVD/vz15bY59Nlb8txY9+y86LpA5LxL67pE7L5H05Ai2Z4m58Vz89RI7dKr+/XY8Ms68dx/6sZE7sRCzIEN0YwZ67wi6rk27L4k9NZB4rAz7L0j5rM66bMb682a5sJG6LEm3asy3q0w3q026sqC8cxJ6bYd685U5a457cIn7MBJ8tZW7c1I7c5K7cQ18Msu/v3678tQ3aMq7tNe6chu6rgg79VN8tNH8c0w57Q83akq7dBb9Nld9d5g6cdC8dyb675F/v327NB6////AAA...AA/LvB3QAAAMFJREFUeNpiqIcAbz0ogwFKm7GgCjgyZMihCLCkc0nkIAnIMVRw2UhDBGp5fcurGOyLfbhVtJwLdJkY8oscZCsFPBk5spiNaoTC4hnqk801Qi2zLQyD2NlcWWP5GepN5TOtSxg1QwrV01itpECG2kaLy3AYiCWxcRozQWyp9pNMDWePDI4QgVpbx5eo7a+mHFOqAxUQVeRhdrLjdFFQggqo5tqVeSS456UEQgWE4/RBboxyC4AKCEI9Wu9lUl8PEGAAV7NY4hyx8voAAAAASUVORK5CYII=;
并以这种方式使用
<Image style={{width: 100, height: 50, resizeMode: Image.resizeMode.contain, borderWidth: 1, borderColor: 'red'}} source={{uri: base64Icon}}/>
方法二:
<Image
source={{
uri: `data:image/jpeg;base64,${this.state.barcodeImage}`,
}}
style={{height: 200, width: 250}}
/>
使用 axios 而不是 fetch 帮助我解决了我的问题。 将header中的 maxBodyLength 设置为更大的 int 值会有所帮助。 以下是代码片段:
const route =
<*your-api-url*>;
const payload = {
caption: "This is image",
imageBase: <*base64String here*>,
};
const resp = await axios.post(route, payload, {
**maxBodyLength: 20000000**,
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.