Propagate server validation errors

package.json

@@ -1,6 +1,6 @@
 {
  "name": "@authsignal/browser",
- "version": "0.4.2",
+ "version": "0.4.3",
  "type": "module",
  "main": "dist/index.js",
  "module": "dist/index.js",

src/api/passkey-api-client.ts

@@ -3,6 +3,7 @@ import {
  AddAuthenticatorResponse,
  AuthenticationOptsRequest,
  AuthenticationOptsResponse,
+ AuthsignalResponse,
  ChallengeResponse,
  PasskeyAuthenticatorResponse,
  RegistrationOptsRequest,
@@ -29,7 +30,7 @@ export class PasskeyApiClient {
  token,
  username,
  authenticatorAttachment,
- }: {token: string} & RegistrationOptsRequest): Promise<RegistrationOptsResponse> {
+ }: {token: string} & RegistrationOptsRequest): Promise<AuthsignalResponse<RegistrationOptsResponse>> {
  const body: RegistrationOptsRequest = Boolean(authenticatorAttachment)
  ? {username, authenticatorAttachment}
  : {username};
@@ -46,7 +47,7 @@ export class PasskeyApiClient {
  async authenticationOptions({
  token,
  challengeId,
- }: {token?: string} & AuthenticationOptsRequest): Promise<AuthenticationOptsResponse> {
+ }: {token?: string} & AuthenticationOptsRequest): Promise<AuthsignalResponse<AuthenticationOptsResponse>> {
  const body: AuthenticationOptsRequest = {challengeId};
 
  const response = fetch(`${this.baseUrl}/client/user-authenticators/passkey/authentication-options`, {
@@ -62,7 +63,7 @@ export class PasskeyApiClient {
  token,
  challengeId,
  registrationCredential,
- }: {token: string} & AddAuthenticatorRequest): Promise<AddAuthenticatorResponse> {
+ }: {token: string} & AddAuthenticatorRequest): Promise<AuthsignalResponse<AddAuthenticatorResponse>> {
  const body: AddAuthenticatorRequest = {
  challengeId,
  registrationCredential,
@@ -82,7 +83,7 @@ export class PasskeyApiClient {
  challengeId,
  authenticationCredential,
  deviceId,
- }: {token?: string} & VerifyRequest): Promise<VerifyResponse> {
+ }: {token?: string} & VerifyRequest): Promise<AuthsignalResponse<VerifyResponse>> {
  const body: VerifyRequest = {challengeId, authenticationCredential, deviceId};
 
  const response = fetch(`${this.baseUrl}/client/verify/passkey`, {
@@ -94,7 +95,7 @@ export class PasskeyApiClient {
  return (await response).json();
  }
 
- async getPasskeyAuthenticator(credentialId: string): Promise<PasskeyAuthenticatorResponse> {
+ async getPasskeyAuthenticator(credentialId: string): Promise<AuthsignalResponse<PasskeyAuthenticatorResponse>> {
  const response = await fetch(`${this.baseUrl}/client/user-authenticators/passkey?credentialId=${credentialId}`, {
  method: "GET",
  headers: this.buildHeaders(),
@@ -107,7 +108,7 @@ export class PasskeyApiClient {
  return response.json();
  }
 
- async challenge(action: string): Promise<ChallengeResponse> {
+ async challenge(action: string): Promise<AuthsignalResponse<ChallengeResponse>> {
  const response = fetch(`${this.baseUrl}/client/challenge`, {
  method: "POST",
  headers: this.buildHeaders(),

src/api/types.ts

@@ -54,3 +54,10 @@ export type PasskeyAuthenticatorResponse = {
 export type ChallengeResponse = {
  challengeId: string;
 };
+
+export type ErrorResponse = {
+ error: string;
+ errorDescription?: string;
+};
+
+export type AuthsignalResponse<T> = T | ErrorResponse;

src/helpers.ts

@@ -1,3 +1,5 @@
+import {AuthsignalResponse, ErrorResponse} from "./api/types";
+
 type CookieOptions = {
  name: string;
  value: string;
@@ -6,7 +8,7 @@ type CookieOptions = {
  secure: boolean;
 };
 
-export const setCookie = ({name, value, expire, domain, secure}: CookieOptions): void => {
+export function setCookie({name, value, expire, domain, secure}: CookieOptions) {
  const expireString = expire === Infinity ? " expires=Fri, 31 Dec 9999 23:59:59 GMT" : "; max-age=" + expire;
  document.cookie =
  encodeURIComponent(name) +
@@ -16,13 +18,13 @@ export const setCookie = ({name, value, expire, domain, secure}: CookieOptions):
  expireString +
  (domain ? "; domain=" + domain : "") +
  (secure ? "; secure" : "");
-};
+}
 
-export const getCookieDomain = (): string => {
+export function getCookieDomain() {
  return document.location.hostname.replace("www.", "");
-};
+}
 
-export const getCookie = (name: string) => {
+export function getCookie(name: string) {
  if (!name) {
  return null;
  }
@@ -36,4 +38,8 @@ export const getCookie = (name: string) => {
  )
  ) || null
  );
-};
+}
+
+export function logErrorResponse(errorResponse: ErrorResponse) {
+ console.error(errorResponse.errorDescription ?? errorResponse.error);
+}

src/passkey.ts

@@ -2,6 +2,7 @@ import {startAuthentication, startRegistration} from "@simplewebauthn/browser";
 
 import {PasskeyApiClient} from "./api";
 import {AuthenticationResponseJSON, RegistrationResponseJSON, AuthenticatorAttachment} from "@simplewebauthn/types";
+import {logErrorResponse} from "./helpers";
 
 type PasskeyOptions = {
  baseUrl: string;
@@ -28,6 +29,11 @@ export class Passkey {
  async signUp({userName, token, authenticatorAttachment = "platform"}: SignUpParams) {
  const optionsResponse = await this.api.registrationOptions({username: userName, token, authenticatorAttachment});
 
+ if ("error" in optionsResponse) {
+ logErrorResponse(optionsResponse);
+ return;
+ }
+
  const registrationResponse = await startRegistration(optionsResponse.options);
 
  const addAuthenticatorResponse = await this.api.addAuthenticator({
@@ -36,11 +42,16 @@ export class Passkey {
  token,
  });
 
- if (addAuthenticatorResponse?.isVerified) {
+ if ("error" in addAuthenticatorResponse) {
+ logErrorResponse(addAuthenticatorResponse);
+ return;
+ }
+
+ if (addAuthenticatorResponse.isVerified) {
  this.storeCredentialAgainstDevice(registrationResponse);
  }
 
- return addAuthenticatorResponse?.accessToken;
+ return addAuthenticatorResponse.accessToken;
  }
 
  async signIn(): Promise<string | undefined>;
@@ -58,11 +69,21 @@ export class Passkey {
 
  const challengeResponse = params?.action ? await this.api.challenge(params.action) : null;
 
+ if (challengeResponse && "error" in challengeResponse) {
+ logErrorResponse(challengeResponse);
+ return;
+ }
+
  const optionsResponse = await this.api.authenticationOptions({
  token: params?.token,
  challengeId: challengeResponse?.challengeId,
  });
 
+ if ("error" in optionsResponse) {
+ logErrorResponse(optionsResponse);
+ return;
+ }
+
  const authenticationResponse = await startAuthentication(optionsResponse.options, params?.autofill);
 
  const verifyResponse = await this.api.verify({
@@ -72,11 +93,16 @@ export class Passkey {
  deviceId: this.anonymousId,
  });
 
- if (verifyResponse?.isVerified) {
+ if ("error" in verifyResponse) {
+ logErrorResponse(verifyResponse);
+ return;
+ }
+
+ if (verifyResponse.isVerified) {
  this.storeCredentialAgainstDevice(authenticationResponse);
  }
 
- return verifyResponse?.accessToken;
+ return verifyResponse.accessToken;
  }
 
  async isAvailableOnDevice() {