Skip to content
Snippets Groups Projects
Commit bd0829fc8a91 authored by Frank Bessou's avatar Frank Bessou :spider_web:
Browse files

refactor: explicitly serialize as multipartformdata in SignedRequestAuthenticator only

parent 698334eef663
No related branches found
No related tags found
1 merge request!105feat: allow to authenticate through an authenticator
Hide whitespace changes
Inline Side-by-side
packages/client/src/Authenticator.ts
+ 2
− 7
View file @ bd0829fc
export type EncodedRequestInit = RequestInit & { body?: Uint8Array | null };
export interface AuthenticatedRequest {
url: string;
......@@ -3,6 +1,6 @@
export interface AuthenticatedRequest {
url: string;
init: EncodedRequestInit;
init: RequestInit;
}
export interface Authenticator {
......@@ -6,8 +4,5 @@
}
export interface Authenticator {
authenticate(
url: string,
init: EncodedRequestInit
): Promise<AuthenticatedRequest>;
authenticate(url: string, init: RequestInit): Promise<AuthenticatedRequest>;
}
packages/client/src/api/Api.ts
+ 23
− 36
View file @ bd0829fc
import type { Authenticator } from "../Authenticator.js";
import { ValidationError } from "../errors.js";
import { formDataToBytes } from "../formDataToBytes.js";
import { RawSchema } from "../schema/raw/Schema.js";
import { getBinariesFromTransaction, serializeQueryParams } from "../utils.js";
import { RQLBinary } from "./binary/RQLBinary.js";
......@@ -284,7 +283,7 @@
* @param init Additional request parameters
* @returns A promise with the non-null fetched result
*/
private async nonNullFetchApi<R = unknown>(url: string, init?: RequestInit) {
private async nonNullFetchApi<R = unknown>(url: string, init: RequestInit) {
const result = await this.fetchApi<R>(url, init);
if (result == null) {
const error: ApiErrorResponse = {
......@@ -308,5 +307,5 @@
*/
private async fetchApi<R = unknown>(
url: string,
init?: RequestInit
init: RequestInit
): Promise<R | null> {
......@@ -312,19 +311,3 @@
): Promise<R | null> {
let headers: HeadersInit = init?.headers || {};
if (init?.method && init.method !== "GET") {
headers = {
// CSRF custom header necessary for POST requests
"X-Client-Name": "XMLHttpRequest",
};
// Browsers will automatically set the multipart content type
// with the right boundary if the body is FormData
if (!(init.body instanceof FormData)) {
headers["Content-Type"] = "application/json;charset=UTF-8";
}
headers = {
...headers,
...init?.headers,
};
}
init = { ...init, headers };
const headers = new Headers(init.headers);
......@@ -330,5 +313,8 @@
function headersHandler(newHeaders: Record<string, string>) {
headers = { ...headers, ...newHeaders };
// Add custom header used as CSRF protection
// note: it is only necessary for non GET requests but can also be useful
// while debugging.
if (!headers.has("X-Client-Name")) {
headers.append("X-Client-Name", "XMLHttpRequest");
}
......@@ -333,13 +319,12 @@
}
// Encode body
let encodedBody: Uint8Array | undefined | null = null;
if (typeof init?.body === "string") {
encodedBody = new TextEncoder().encode(init.body);
} else if (init.body instanceof FormData) {
encodedBody = await formDataToBytes(init.body, headersHandler);
} else if (init.body == null) {
encodedBody = init.body;
} else {
throw new Error("Unexpected body type.");
// Add a "Content-Type" header whenever a body is passed.
// The header might already have been set (either by the caller of this
// function or by and encoder)
if (
init.body &&
!headers.has("Content-Type") &&
!(init.body instanceof FormData)
) {
headers.append("Content-Type", "application/json;charset=UTF-8");
}
......@@ -345,7 +330,6 @@
}
const encodedInit = { ...init, headers, body: encodedBody };
init.headers = headers;
// Authenticate request
if (this._authenticator) {
const authenticatedRequest = await this._authenticator.authenticate(
url,
......@@ -349,9 +333,9 @@
if (this._authenticator) {
const authenticatedRequest = await this._authenticator.authenticate(
url,
encodedInit
init
);
url = authenticatedRequest.url;
init = authenticatedRequest.init;
}
......@@ -353,6 +337,7 @@
);
url = authenticatedRequest.url;
init = authenticatedRequest.init;
}
// Execute request
const response = await fetch(url, init);
......@@ -358,4 +343,6 @@
const response = await fetch(url, init);
// Parse response body and handle errors
const status = response.status;
if (status >= 200 && status < 300) {
if (status === 204) {
......
packages/client/src/api/authenticators/SignedRequestAuthenticator.ts
+ 78
− 28
View file @ bd0829fc
import {
AuthenticatedRequest,
Authenticator,
EncodedRequestInit,
} from "../../Authenticator.js";
import { AuthenticatedRequest, Authenticator } from "../../Authenticator.js";
import { encodeFormData } from "../../encodeFormData.js";
export interface SignedRequestAuthToken {
/**
......@@ -30,6 +27,7 @@
* @param token A {@link SignedRequestAuthToken}. This token must be enabled.
*/
export class SignedRequestAuthenticator implements Authenticator {
private cachedCryptoKey?: CryptoKey;
constructor(private token: SignedRequestAuthToken) {}
......@@ -39,14 +37,29 @@
return hashHex;
}
async authenticate(
url: string,
init: EncodedRequestInit
): Promise<AuthenticatedRequest> {
const headers = new Headers(init?.headers);
const body = init?.body ?? new Uint8Array();
const bodyHash = await this.digestBody(body);
headers.append("Content-SHA512", bodyHash);
const date = new Date();
headers.append("X-Cubicweb-Date", date.toUTCString());
private async encodeBody(
body: RequestInit["body"]
): Promise<{ body: Uint8Array | null; headers: Headers }> {
if (typeof body === "string") {
return {
body: new TextEncoder().encode(body),
headers: new Headers(),
};
} else if (body instanceof FormData) {
return await encodeFormData(body);
} else if (body == null) {
return {
body: null,
headers: new Headers(),
};
} else {
throw new Error("Unexpected body type.");
}
}
private async getCryptoKey() {
if (this.cachedCryptoKey) {
return this.cachedCryptoKey;
}
const textEncoder = new TextEncoder();
......@@ -52,12 +65,5 @@
const textEncoder = new TextEncoder();
const contentToSign =
(init?.method ?? "GET") +
url +
bodyHash +
(headers.get("Content-Type") ?? "") +
(headers.get("X-Cubicweb-Date") ?? "");
const cryptoKey = await crypto.subtle.importKey(
this.cachedCryptoKey = await crypto.subtle.importKey(
"raw",
textEncoder.encode(this.token.token),
{
......@@ -67,4 +73,6 @@
false,
["sign"]
);
return this.cachedCryptoKey;
}
......@@ -70,3 +78,37 @@
const contentSigned = await crypto.subtle.sign(
/**
* Compute headers used to sign the request and encode the content as bytes
*/
private async prepareRequest(
url: string,
init: RequestInit
): Promise<{ contentToSign: string; headers: Headers }> {
const headers = new Headers(init?.headers);
const { body: encodedBody, headers: encodingHeaders } =
await this.encodeBody(init.body || null);
init.body = encodedBody;
encodingHeaders.forEach((value, name) => headers.append(name, value));
const bodyBytes = encodedBody ?? new Uint8Array();
const bodyHash = await this.digestBody(bodyBytes);
headers.append("Content-SHA512", bodyHash);
const date = new Date();
headers.append("X-Cubicweb-Date", date.toUTCString());
return {
contentToSign:
(init?.method ?? "GET") +
url +
bodyHash +
(headers.get("Content-Type") ?? "") +
(headers.get("X-Cubicweb-Date") ?? ""),
headers,
};
}
private async signContent(contentToSign: string): Promise<ArrayBuffer> {
const textEncoder = new TextEncoder();
return await crypto.subtle.sign(
"HMAC",
......@@ -72,4 +114,4 @@
"HMAC",
cryptoKey,
await this.getCryptoKey(),
textEncoder.encode(contentToSign)
);
......@@ -74,4 +116,11 @@
textEncoder.encode(contentToSign)
);
}
async authenticate(
url: string,
init: RequestInit
): Promise<AuthenticatedRequest> {
const { contentToSign, headers } = await this.prepareRequest(url, init);
headers.append(
"Authorization",
......@@ -76,4 +125,6 @@
headers.append(
"Authorization",
`Cubicweb ${this.token.id}:${bytesToHex(contentSigned)}`
`Cubicweb ${this.token.id}:${bytesToHex(
await this.signContent(contentToSign)
)}`
);
......@@ -79,5 +130,4 @@
);
const newInit = { ...init, headers };
return { url, init: newInit };
return { url, init: { ...init, headers } };
}
}
packages/client/src/formDataToBytes.ts → packages/client/src/encodeFormData.ts
+ 11
− 14
View file @ bd0829fc
// Adapted from https://github.com/axios/axios/blob/c6cce43cd94489f655f4488c5a50ecaf781c94f2/lib/helpers/formDataToStream.js#L92
// See https://andreubotella.github.io/multipart-form-data/ for spec and algorithm description
const ALPHA = "abcdefghijklmnopqrstuvwxyz";
const BOUNDARY_ALPHABET = ALPHA + ALPHA.toUpperCase() + "0123456789" + "-_";
......@@ -70,9 +73,7 @@
}
}
type HeadersHandler = (headers: Record<string, string>) => void;
const generateBoundary = () => {
function generateBoundary(): string {
let str = "";
const { length } = BOUNDARY_ALPHABET;
let size = 25;
......@@ -81,5 +82,5 @@
}
return str;
};
}
......@@ -85,8 +86,5 @@
export async function formDataToBytes(
form: FormData,
headersHandler: HeadersHandler
): Promise<Uint8Array> {
export async function encodeFormData(body: FormData) {
const tag = "form-data-boundary";
const boundary = tag + "-" + generateBoundary();
......@@ -94,7 +92,7 @@
const footerBytes = textEncoder.encode("--" + boundary + "--" + CRLF + CRLF);
let contentLength = footerBytes.byteLength;
const parts = Array.from(form.entries()).map(([name, value]) => {
const parts = Array.from(body.entries()).map(([name, value]) => {
const part = new FormDataPart(name, value);
contentLength += part.size;
return part;
......@@ -102,5 +100,5 @@
contentLength += boundaryBytes.byteLength * parts.length;
const computedHeaders: Record<string, string> = {
const computedHeaders = new Headers({
"Content-Type": `multipart/form-data; boundary=${boundary}`,
......@@ -106,4 +104,4 @@
"Content-Type": `multipart/form-data; boundary=${boundary}`,
};
});
if (Number.isFinite(contentLength)) {
......@@ -108,4 +106,4 @@
if (Number.isFinite(contentLength)) {
computedHeaders["Content-Length"] = contentLength.toString();
computedHeaders.append("Content-Length", contentLength.toString());
}
......@@ -111,5 +109,4 @@
}
headersHandler && headersHandler(computedHeaders);
const fullContent = new Uint8Array(contentLength);
let offset = 0;
......@@ -125,5 +122,5 @@
}
fullContent.set(footerBytes, offset);
return fullContent;
return { body: fullContent, headers: computedHeaders };
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment