mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
fix(ui): fix image upload
`openapi-fetch` does not handle non-JSON `body`s, always stringifying them, and sets the `content-type` to `application/json`. The patch here does two things: - Do not stringify `body` if it is one of the types that should not be stringified (https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#body) - Do not add `content-type: application/json` unless it really is stringified JSON. Upstream issue: https://github.com/drwpow/openapi-typescript/issues/1123 I'm not a bit lost on fixing the types and adding tests, so not raising a PR upstream.
This commit is contained in:
parent
e076231398
commit
8e724b5abe
55
invokeai/frontend/web/patches/openapi-fetch+0.4.0.patch
Normal file
55
invokeai/frontend/web/patches/openapi-fetch+0.4.0.patch
Normal file
@ -0,0 +1,55 @@
|
||||
diff --git a/node_modules/openapi-fetch/dist/index.js b/node_modules/openapi-fetch/dist/index.js
|
||||
index cd4528a..8976b51 100644
|
||||
--- a/node_modules/openapi-fetch/dist/index.js
|
||||
+++ b/node_modules/openapi-fetch/dist/index.js
|
||||
@@ -1,5 +1,5 @@
|
||||
// settings & const
|
||||
-const DEFAULT_HEADERS = {
|
||||
+const CONTENT_TYPE_APPLICATION_JSON = {
|
||||
"Content-Type": "application/json",
|
||||
};
|
||||
const TRAILING_SLASH_RE = /\/*$/;
|
||||
@@ -29,18 +29,29 @@ export function createFinalURL(url, options) {
|
||||
}
|
||||
return finalURL;
|
||||
}
|
||||
+function stringifyBody(body) {
|
||||
+ if (body instanceof ArrayBuffer || body instanceof File || body instanceof DataView || body instanceof Blob || ArrayBuffer.isView(body) || body instanceof URLSearchParams || body instanceof FormData) {
|
||||
+ return;
|
||||
+ }
|
||||
+
|
||||
+ if (typeof body === "string") {
|
||||
+ return body;
|
||||
+ }
|
||||
+
|
||||
+ return JSON.stringify(body);
|
||||
+ }
|
||||
+
|
||||
export default function createClient(clientOptions = {}) {
|
||||
const { fetch = globalThis.fetch, ...options } = clientOptions;
|
||||
- const defaultHeaders = new Headers({
|
||||
- ...DEFAULT_HEADERS,
|
||||
- ...(options.headers ?? {}),
|
||||
- });
|
||||
+ const defaultHeaders = new Headers(options.headers ?? {});
|
||||
async function coreFetch(url, fetchOptions) {
|
||||
const { headers, body: requestBody, params = {}, parseAs = "json", querySerializer = defaultSerializer, ...init } = fetchOptions || {};
|
||||
// URL
|
||||
const finalURL = createFinalURL(url, { baseUrl: options.baseUrl, params, querySerializer });
|
||||
+ // Stringify body if needed
|
||||
+ const stringifiedBody = stringifyBody(requestBody);
|
||||
// headers
|
||||
- const baseHeaders = new Headers(defaultHeaders); // clone defaults (don’t overwrite!)
|
||||
+ const baseHeaders = new Headers(stringifiedBody ? { ...CONTENT_TYPE_APPLICATION_JSON, ...defaultHeaders } : defaultHeaders); // clone defaults (don’t overwrite!)
|
||||
const headerOverrides = new Headers(headers);
|
||||
for (const [k, v] of headerOverrides.entries()) {
|
||||
if (v === undefined || v === null)
|
||||
@@ -54,7 +65,7 @@ export default function createClient(clientOptions = {}) {
|
||||
...options,
|
||||
...init,
|
||||
headers: baseHeaders,
|
||||
- body: typeof requestBody === "string" ? requestBody : JSON.stringify(requestBody),
|
||||
+ body: stringifiedBody ?? requestBody,
|
||||
});
|
||||
// handle empty content
|
||||
// note: we return `{}` because we want user truthy checks for `.data` or `.error` to succeed
|
@ -151,6 +151,8 @@ export const imageUploaded = createAppAsyncThunk<
|
||||
is_intermediate,
|
||||
session_id,
|
||||
} = arg;
|
||||
const formData = new FormData();
|
||||
formData.append('file', file);
|
||||
const { data, error, response } = await post('/api/v1/images/', {
|
||||
params: {
|
||||
query: {
|
||||
@ -161,8 +163,7 @@ export const imageUploaded = createAppAsyncThunk<
|
||||
},
|
||||
// TODO: Proper handling of `multipart/form-data` is coming soon, will fix type issues
|
||||
// https://github.com/drwpow/openapi-typescript/issues/1123
|
||||
// @ts-ignore
|
||||
body: file,
|
||||
body: formData,
|
||||
});
|
||||
|
||||
if (error || !data) {
|
||||
|
Loading…
Reference in New Issue
Block a user