iOS Native App Integration

[akozlik]

Has anyone been able to get this to work with a native iOS app? The challenge in the clientDataJSON property that's sent back after creating a credential is base64 encoded by Apple but this library's validation seems to expect it to be decoded.

Are there any good docs for integrating with this natively? All the resources I've found are all over the place and nothing seems consistent.

[MasterKale]

Hmm, I've not come across this issue for all the iPhone registration I see at my day job. Perhaps the challenge is being double-encoded somewhere so what seems like the challenge in the response being sent back is base64-encoded is actually an erroneous additional base64 encoding of the challenge prior to handing it to the authenticator. 🤔

[MasterKale]

And this yielded c3RhZ2VhcGkuZ2V0c2VjcmV0c3Rhc2guY29t which doesn't match. However, I believe in your example we needed to SHA 256 the string first before comparing to the authData bytes since authData houses the hashed value.

I can't believe I forgot to hash the RP ID, it's been a long week 🤦

That aside I think I figured it out: the native attestationObject is base64-encoded, while SimpleWebAuthn expects base64url when parsing the attestation object. When I decode the attestation object as base64 then the native app response validates the RP ID just fine:

(async () => {
  // Native
  const attestationObject = 'o2NmbXRkbm9uZWdhdHRTdG10oGhhdXRoRGF0YViYJ866+kjUxhRaMzvhk44/SsqORt5NEfJw9wpQrj05h+ldAAAAAAAAAAAAAAAAAAAAAAAAAAAAFDs0aGW2IFefWp2YBTnMF3frtuDqpQECAyYgASFYIEdsXfmoFVtAxie5WbvcSZBbL/XIvpzRFx7VdoY3S1Q4IlggB/+Nb7vAg4sKmDF79GMTdTmxn0CFhZxpKV74WuTuFbc=';

  console.log('\nParsing native attestation object as base64url')
  const decoded1 = decodeAttestationObject(isoBase64URL.toBuffer(attestationObject));
  const parsedAuthData1 = parseAuthenticatorData(decoded1.get('authData'));
  console.log('response hex RP ID hash:', isoUint8Array.toHex(parsedAuthData1.rpIdHash));
  console.log(
    'computed hex RP ID hash:',
    isoUint8Array.toHex(
      await isoCrypto.digest(isoUint8Array.fromUTF8String('stageapi.getsecretstash.com'), COSEALG.ES256),
    ),
  );

  try {
    await matchExpectedRPID(parsedAuthData1.rpIdHash, ['stageapi.getsecretstash.com']);
    console.log('found match');
  } catch (err) {
    console.error(err);
  }

  console.log('\nParsing native attestation object as base64')
  const decoded2 = decodeAttestationObject(isoBase64URL.toBuffer(attestationObject, 'base64'));
  const parsedAuthData2 = parseAuthenticatorData(decoded2.get('authData'));
  console.log('response hex RP ID hash:', isoUint8Array.toHex(parsedAuthData2.rpIdHash));
  console.log(
    'computed hex RP ID hash:',
    isoUint8Array.toHex(
      await isoCrypto.digest(isoUint8Array.fromUTF8String('stageapi.getsecretstash.com'), COSEALG.ES256),
    ),
  );

  try {
    await matchExpectedRPID(parsedAuthData2.rpIdHash, ['stageapi.getsecretstash.com']);
    console.log('found match');
  } catch (err) {
    console.error(err);
  }
})();

The output:

Parsing native attestation object as base64url
response hex RP ID hash: 27ceba0248d4c6145a333be1938e004aca8e46de4d11f270f70a50ae3d398409
computed hex RP ID hash: 27cebafa48d4c6145a333be1938e3f4aca8e46de4d11f270f70a50ae3d3987e9
UnexpectedRPIDHash: Unexpected RP ID hash
    at matchExpectedRPID (/Users/matt/Developer/simplewebauthn/packages/server/src/helpers/matchExpectedRPID.ts:30:13)
    at async /Users/matt/Developer/simplewebauthn/packages/server/attestationobject.ts:32:5

Parsing native attestation object as base64
response hex RP ID hash: 27cebafa48d4c6145a333be1938e3f4aca8e46de4d11f270f70a50ae3d3987e9
computed hex RP ID hash: 27cebafa48d4c6145a333be1938e3f4aca8e46de4d11f270f70a50ae3d3987e9
found match

Give me a sec to think of a path forward for you...

[MasterKale]

One thing you can do is use isoBase64URL.isBase64url(attestationObject) to determine if attestationObject is a base64url string or not. If it isn't, then convert it to base64url before feeding the response into verifyRegistrationResponse():

(async () => {
  // Native
  let attestationObject = 'o2NmbXRkbm9uZWdhdHRTdG10oGhhdXRoRGF0YViYJ866+kjUxhRaMzvhk44/SsqORt5NEfJw9wpQrj05h+ldAAAAAAAAAAAAAAAAAAAAAAAAAAAAFDs0aGW2IFefWp2YBTnMF3frtuDqpQECAyYgASFYIEdsXfmoFVtAxie5WbvcSZBbL/XIvpzRFx7VdoY3S1Q4IlggB/+Nb7vAg4sKmDF79GMTdTmxn0CFhZxpKV74WuTuFbc=';

  if (!isoBase64URL.isBase64url(attestationObject)) {
    console.log('converting base64 attestationObject to base64url');

    const atteObjBytes = isoBase64URL.toBuffer(attestationObject, 'base64');
    attestationObject = isoBase64URL.fromBuffer(atteObjBytes);
  }

  console.log('\nParsing native attestation object as base64url')
  const decoded1 = decodeAttestationObject(isoBase64URL.toBuffer(attestationObject));
  const parsedAuthData1 = parseAuthenticatorData(decoded1.get('authData'));
  console.log('response hex RP ID hash:', isoUint8Array.toHex(parsedAuthData1.rpIdHash));
  console.log(
    'computed hex RP ID hash:',
    isoUint8Array.toHex(
      await isoCrypto.digest(isoUint8Array.fromUTF8String('stageapi.getsecretstash.com'), COSEALG.ES256),
    ),
  );

  try {
    await matchExpectedRPID(parsedAuthData1.rpIdHash, ['stageapi.getsecretstash.com']);
    console.log('found match');
  } catch (err) {
    console.error(err);
  }
})();

And the output:

converting base64 attestationObject to base64url
Parsing native attestation object as base64url
response hex RP ID hash: 27cebafa48d4c6145a333be1938e3f4aca8e46de4d11f270f70a50ae3d3987e9
computed hex RP ID hash: 27cebafa48d4c6145a333be1938e3f4aca8e46de4d11f270f70a50ae3d3987e9
found match

[akozlik]

Awesome, I'm going to give this a shot. Now to just figure out how to access that isoBase64URL function outside of the library. I'll keep you up to date!

[akozlik]

LET'S GOOOOOOOOOO!!!!!!!

Thank you so much for the advice! I needed to use the HexagonBase64 library directly to do the translation from base64 to base64url

let attestationObject = body.attResp.response.attestationObject;
    var testObject = attestationObject.replace(/=/g, '');

    if (!HexagonBase64.validate(testObject, true)) {
        console.log('converting base64 attestationObject to base64url');
    
        const _buffer = HexagonBase64.toArrayBuffer(attestationObject, false);
        const atteObjBytes = new Uint8Array(_buffer);
        attestationObject = HexagonBase64.fromArrayBuffer(atteObjBytes, true);
        body.attResp.response.attestationObject = attestationObject;
      } else {
        console.log("Valid base 64");
      }

Passing that through to the validator worked!

Big lesson here that Apple uses Base64 natively but uses Base64URL through Safari. Converting from Base64 to Base64URL is exactly what was needed.

Matt I cannot tell you enough how much I appreciate your help this week. Please let me know if I can send some money your way through Venmo or something. Thank you so much! Heading into the weekend in a great mood!

[MasterKale]

Now to just figure out how to access that isoBase64URL function outside of the library.

There are a lot of "helpers", like isoBase64URL (and isoUint8Array, isoCrypto, decodeAttestationObject(), parseAuthenticatorData(), and many more) that are available for you to use for things like this. The trick is that you have to import them from @simplewebauthn/server/helpers instead:

import { isoBase64URL, isoUint8Array } from '@simplewebauthn/server/helpers';

Check those out, you can probably replace some dependencies with them.

Matt I cannot tell you enough how much I appreciate your help this week. Please let me know if I can send some money your way through Venmo or something. Thank you so much! Heading into the weekend in a great mood!

Happy to help! And I'm always grateful for any support people like you throw my way. Here are the two ways I've got set up for people to financially support me and my work:

• Github: https://github.com/sponsors/MasterKale
• Buy Me a Coffee: https://www.buymeacoffee.com/iamkale

Both support monthly or one-time contributions for whatever level of support you deem appropriate 🙇

[spendres]

Try passing in "com.domain.stageapi" to the iOS library. I ran into a similar problem where their documentation said one form in one place and reverse domain in another. The iOS library may simply be verifying your plist entry and complaining that "com.domain.stageapi" != to "stageapi.domain.com";

[akozlik]

Interesting idea. We'll try it out but I'm not too confident. The odd thing is that the bytes look correct when we decide everything. It's a mystery for sure.

[akozlik]

No luck on this one. The reverse domain throws an error so it doesn't seem to be the culprit.

[LondonAtlas]

Thank you for the idea but this didn't work. Apple errored out saying
The operation couldn’t be completed. Application with identifier teamId.com.domain.appName is not associated with domain com.domain.stageapi

[spendres]

Have you tried corbado's flutter iOS/app. At this point you need another native iOS library to compare. See:
https://github.com/corbado/example-passkeys-api-flutter

I was able to use the demo with a domain configured on apple developer, so it would help to eliminate your library – unless you are currently using it.

[DePasqualeOrg]

I'm trying to use this library with my native iOS app, and I'm passing the following data to the server for registration:

type RequestData = {
  email?: string, // Base-64 encoded, the value the user enters in the email/user ID field
  credentialID: string, // Base-64 encoded
  clientDataJSON: string, // Base-64-encoded JSON, challenge also base-64 encoded: {"type":"webauthn.create","challenge":"cGFzc2tleSBjaGFsbGVuZ2U","origin":"https://<RPID>"}
  attestationObject: string, // Base-64 encoded
};

After looking at the examples in the documentation and trying the provided methods, I can't figure out how to use the server library to validate the registration. Could you provide an example?

[DePasqualeOrg]

Also it would be helpful to see an example of authentication with this data sent from an iOS app:

type RequestData = {
  email?: string, // undefined
  userID: string, // Base-64 encoded, the value the user enters in the email/user ID field
  credentialID: string, // Base-64 encoded
  authenticatorData?: string, // Base-64 encoded
  clientDataJSON: string, // Base-64 encoded JSON, challenge base-64 encoded: {"type":"webauthn.get","challenge":"cGFzc2tleSBjaGFsbGVuZ2U","origin":"https://<RPID>"}
  signature?: string // Base-64 encoded
};