Skip to content

fix(http): support binary request bodies #8478

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
iamanaws wants to merge 1 commit into
base: main
Choose a base branch
from
Open

fix(http): support binary request bodies #8478

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
86 changes: 68 additions & 18 deletions android/capacitor/src/main/assets/native-bridge.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,33 @@ var nativeBridge = (function (exports) {
reader.onerror = reject;
reader.readAsBinaryString(file);
});
const readArrayBufferAsBase64 = (arrayBuffer) => {
const bytes = new Uint8Array(arrayBuffer);
const chunkSize = 0x8000;
let binary = '';
for (let i = 0; i < bytes.length; i += chunkSize) {
binary += String.fromCharCode(...bytes.subarray(i, i + chunkSize));
}
return btoa(binary);
};
const readBlobAsBase64 = (blob) => new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = () => {
const result = reader.result;
resolve(result.indexOf(',') >= 0 ? result.split(',')[1] : result);
};
reader.onerror = reject;
reader.readAsDataURL(blob);
});
const readDataViewAsBase64 = (dataView) => readArrayBufferAsBase64(dataView.buffer.slice(dataView.byteOffset, dataView.byteOffset + dataView.byteLength));
const base64StringToArrayBuffer = (base64) => {
const binary = atob(base64);
const bytes = new Uint8Array(binary.length);
for (let i = 0; i < binary.length; i++) {
bytes[i] = binary.charCodeAt(i);
}
return bytes.buffer;
};
const convertFormData = async (formData) => {
const newFormData = [];
for (const pair of formData.entries()) {
Expand All @@ -65,9 +92,38 @@ var nativeBridge = (function (exports) {
return newFormData;
};
const convertBody = async (body, contentType) => {
if (body instanceof ReadableStream || body instanceof Uint8Array) {
if (body instanceof File) {
const fileData = await readFileAsBase64(body);
return {
data: fileData,
type: 'file',
headers: { 'Content-Type': body.type },
};
}
else if (body instanceof Blob) {
return {
data: await readBlobAsBase64(body),
type: 'binary',
headers: { 'Content-Type': contentType || body.type || 'application/octet-stream' },
};
}
else if (body instanceof ArrayBuffer) {
return {
data: readArrayBufferAsBase64(body),
type: 'binary',
headers: { 'Content-Type': contentType || 'application/octet-stream' },
};
}
else if (ArrayBuffer.isView(body)) {
return {
data: readDataViewAsBase64(body),
type: 'binary',
headers: { 'Content-Type': contentType || 'application/octet-stream' },
};
}
if ((typeof ReadableStream !== 'undefined' && body instanceof ReadableStream) || body instanceof Uint8Array) {
let encodedData;
if (body instanceof ReadableStream) {
if (typeof ReadableStream !== 'undefined' && body instanceof ReadableStream) {
const reader = body.getReader();
const chunks = [];
while (true) {
Expand All @@ -87,7 +143,9 @@ var nativeBridge = (function (exports) {
else {
encodedData = body;
}
let data = new TextDecoder().decode(encodedData);
let data = (contentType === null || contentType === void 0 ? void 0 : contentType.startsWith('image')) || contentType === 'application/octet-stream'
? readDataViewAsBase64(encodedData)
: new TextDecoder().decode(encodedData);
let type;
if (contentType === 'application/json') {
try {
Expand All @@ -102,7 +160,7 @@ var nativeBridge = (function (exports) {
type = 'formData';
}
else if (contentType === null || contentType === void 0 ? void 0 : contentType.startsWith('image')) {
type = 'image';
type = 'binary';
}
else if (contentType === 'application/octet-stream') {
type = 'binary';
Expand All @@ -128,14 +186,6 @@ var nativeBridge = (function (exports) {
type: 'formData',
};
}
else if (body instanceof File) {
const fileData = await readFileAsBase64(body);
return {
data: fileData,
type: 'file',
headers: { 'Content-Type': body.type },
};
}
return { data: body, type: 'json' };
};
const CAPACITOR_HTTP_INTERCEPTOR = '/_capacitor_http_interceptor_';
Expand Down Expand Up @@ -535,15 +585,15 @@ var nativeBridge = (function (exports) {
data: requestData,
dataType: type,
headers: nativeHeaders,
responseType: 'arraybuffer',
});
const contentType = nativeResponse.headers['Content-Type'] || nativeResponse.headers['content-type'];
let data = (contentType === null || contentType === void 0 ? void 0 : contentType.startsWith('application/json'))
? JSON.stringify(nativeResponse.data)
: nativeResponse.data;
// use null data for 204 No Content HTTP response
if (nativeResponse.status === 204) {
data = null;
}
const data = nativeResponse.status === 204
? null
: (contentType === null || contentType === void 0 ? void 0 : contentType.startsWith('application/json'))
? JSON.stringify(nativeResponse.data)
: base64StringToArrayBuffer(nativeResponse.data);
// intercept & parse response before returning
const response = new Response(data, {
headers: nativeResponse.headers,
Expand Down
28 changes: 14 additions & 14 deletions android/capacitor/src/main/java/com/getcapacitor/plugin/util/CapacitorHttpUrlConnection.java
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
package com.getcapacitor.plugin.util;

import android.os.Build;
import android.os.LocaleList;
import android.text.TextUtils;
import com.getcapacitor.Bridge;
Expand All @@ -19,7 +18,6 @@
import java.net.URLEncoder;
import java.net.UnknownServiceException;
import java.nio.charset.StandardCharsets;
import java.util.Base64;
import java.util.Iterator;
import java.util.List;
import java.util.Locale;
Expand Down Expand Up @@ -209,13 +207,8 @@ public void setRequestBody(PluginCall call, JSValue body, String bodyType) throw
dataString = call.getString("data");
}
this.writeRequestBody(dataString != null ? dataString : "");
} else if (bodyType != null && bodyType.equals("file")) {
try (DataOutputStream os = new DataOutputStream(connection.getOutputStream())) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
os.write(Base64.getDecoder().decode(body.toString()));
}
os.flush();
}
} else if (bodyType != null && (bodyType.equals("file") || bodyType.equals("binary"))) {
this.writeRequestBody(decodeBase64RequestBody(body.toString()));
} else if (contentType.contains("application/x-www-form-urlencoded")) {
try {
JSObject obj = body.toJSObject();
Expand Down Expand Up @@ -252,6 +245,17 @@ private void writeRequestBody(String body) throws IOException {
}
}

private void writeRequestBody(byte[] body) throws IOException {
try (DataOutputStream os = new DataOutputStream(connection.getOutputStream())) {
os.write(body);
os.flush();
}
}

static byte[] decodeBase64RequestBody(String body) {
return android.util.Base64.decode(body, android.util.Base64.DEFAULT);
}

private void writeObjectRequestBody(JSObject object) throws IOException, JSONException {
try (DataOutputStream os = new DataOutputStream(connection.getOutputStream())) {
Iterator<String> keys = object.keys();
Expand Down Expand Up @@ -296,11 +300,7 @@ private void writeFormDataRequestBody(String boundary, JSArray entries) throws I
os.writeBytes("Content-Transfer-Encoding: binary" + lineEnd);
os.writeBytes(lineEnd);

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
os.write(Base64.getDecoder().decode(value));
} else {
os.write(android.util.Base64.decode(value, android.util.Base64.DEFAULT));
}
os.write(decodeBase64RequestBody(value));

os.writeBytes(lineEnd);
}
Expand Down
2 changes: 1 addition & 1 deletion core/http.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -233,7 +233,7 @@ Make a Http DELETE Request to a server using native libraries.
| **`webFetchExtra`** | <code><a href="#requestinit">RequestInit</a></code> | Extra arguments for fetch when running on the web |
| **`responseType`** | <code><a href="#httpresponsetype">HttpResponseType</a></code> | This is used to parse the response appropriately before returning it to the requestee. If the response content-type is "json", this value is ignored. |
| **`shouldEncodeUrlParams`** | <code>boolean</code> | Use this option if you need to keep the URL unencoded in certain cases (already encoded, azure/firebase testing, etc.). The default is _true_. |
| **`dataType`** | <code>'file' \| 'formData'</code> | This is used if we've had to convert the data from a JS type that needs special handling in the native layer |
| **`dataType`** | <code>'file' \| 'formData' \| 'binary'</code> | This is used if we've had to convert the data from a JS type that needs special handling in the native layer |


#### HttpParams
Expand Down
103 changes: 82 additions & 21 deletions core/native-bridge.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,44 @@ const readFileAsBase64 = (file: File): Promise<string> =>
reader.readAsBinaryString(file);
});

const readArrayBufferAsBase64 = (arrayBuffer: ArrayBufferLike): string => {
const bytes = new Uint8Array(arrayBuffer);
const chunkSize = 0x8000;
let binary = '';

for (let i = 0; i < bytes.length; i += chunkSize) {
binary += String.fromCharCode(...bytes.subarray(i, i + chunkSize));
}

return btoa(binary);
};

const readBlobAsBase64 = (blob: Blob): Promise<string> =>
new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = () => {
const result = reader.result as string;
resolve(result.indexOf(',') >= 0 ? result.split(',')[1] : result);
};
reader.onerror = reject;

reader.readAsDataURL(blob);
});

const readDataViewAsBase64 = (dataView: ArrayBufferView): string =>
readArrayBufferAsBase64(dataView.buffer.slice(dataView.byteOffset, dataView.byteOffset + dataView.byteLength));

const base64StringToArrayBuffer = (base64: string): ArrayBuffer => {
const binary = atob(base64);
const bytes = new Uint8Array(binary.length);

for (let i = 0; i < binary.length; i++) {
bytes[i] = binary.charCodeAt(i);
}

return bytes.buffer as ArrayBuffer;
};

const convertFormData = async (formData: FormData): Promise<any> => {
const newFormData: CapFormDataEntry[] = [];
for (const pair of formData.entries()) {
Expand All @@ -55,11 +93,38 @@ const convertBody = async (
body: Document | XMLHttpRequestBodyInit | ReadableStream<any> | undefined,
contentType?: string,
): Promise<any> => {
if (body instanceof ReadableStream || body instanceof Uint8Array) {
let encodedData;
if (body instanceof ReadableStream) {
if (body instanceof File) {
const fileData = await readFileAsBase64(body);
return {
data: fileData,
type: 'file',
headers: { 'Content-Type': body.type },
};
} else if (body instanceof Blob) {
return {
data: await readBlobAsBase64(body),
type: 'binary',
headers: { 'Content-Type': contentType || body.type || 'application/octet-stream' },
};
} else if (body instanceof ArrayBuffer) {
return {
data: readArrayBufferAsBase64(body),
type: 'binary',
headers: { 'Content-Type': contentType || 'application/octet-stream' },
};
} else if (ArrayBuffer.isView(body)) {
return {
data: readDataViewAsBase64(body),
type: 'binary',
headers: { 'Content-Type': contentType || 'application/octet-stream' },
};
}

if ((typeof ReadableStream !== 'undefined' && body instanceof ReadableStream) || body instanceof Uint8Array) {
let encodedData: Uint8Array;
if (typeof ReadableStream !== 'undefined' && body instanceof ReadableStream) {
const reader = body.getReader();
const chunks: any[] = [];
const chunks: Uint8Array[] = [];
while (true) {
const { done, value } = await reader.read();
if (done) break;
Expand All @@ -73,10 +138,13 @@ const convertBody = async (
}
encodedData = concatenated;
} else {
encodedData = body;
encodedData = body as Uint8Array;
}

let data = new TextDecoder().decode(encodedData);
let data =
contentType?.startsWith('image') || contentType === 'application/octet-stream'
? readDataViewAsBase64(encodedData)
: new TextDecoder().decode(encodedData);
let type;
if (contentType === 'application/json') {
try {
Expand All @@ -88,7 +156,7 @@ const convertBody = async (
} else if (contentType === 'multipart/form-data') {
type = 'formData';
} else if (contentType?.startsWith('image')) {
type = 'image';
type = 'binary';
} else if (contentType === 'application/octet-stream') {
type = 'binary';
} else {
Expand All @@ -110,13 +178,6 @@ const convertBody = async (
data: await convertFormData(body),
type: 'formData',
};
} else if (body instanceof File) {
const fileData = await readFileAsBase64(body);
return {
data: fileData,
type: 'file',
headers: { 'Content-Type': body.type },
};
}

return { data: body, type: 'json' };
Expand Down Expand Up @@ -577,17 +638,17 @@ const initBridge = (w: any): void => {
data: requestData,
dataType: type,
headers: nativeHeaders,
responseType: 'arraybuffer',
});

const contentType = nativeResponse.headers['Content-Type'] || nativeResponse.headers['content-type'];
let data = contentType?.startsWith('application/json')
? JSON.stringify(nativeResponse.data)
: nativeResponse.data;

// use null data for 204 No Content HTTP response
if (nativeResponse.status === 204) {
data = null;
}
const data =
nativeResponse.status === 204
? null
: contentType?.startsWith('application/json')
? JSON.stringify(nativeResponse.data)
: base64StringToArrayBuffer(nativeResponse.data);

// intercept & parse response before returning
const response = new Response(data, {
Expand Down
2 changes: 1 addition & 1 deletion core/src/core-plugins.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -245,7 +245,7 @@ export interface HttpOptions {
* This is used if we've had to convert the data from a JS type that needs
* special handling in the native layer
*/
dataType?: 'file' | 'formData';
dataType?: 'file' | 'formData' | 'binary';
}

export interface HttpParams {
Expand Down
Loading