Present a W3C VC

Present a Credential with OID4VP

This guide is for iOS applications. Building for Android? Look here: Present a W3C VC

To present a Credential over OID4VP, you will need to retrieve the correct credential from storage, and obtain permission from the user to share said credential, before relaying any information to a verifier. We have abstracted a lot of the OID4VP work for you. That leaves you to deal with only a PermissionRequest and PermissionResponse.

The PermissionRequest is the structure that you use to interface with the user to obtain permission for the sharing of one or more credentials. Here, the user would also choose which credential to share if there is more than one appropriate credential present in the wallet. The PermissonResponse represents the outcome of that interaction, and holds the vp_token, which contains the verifiable presentation.

1. Create a PermissionRequest

import SpruceIDMobileSdkRs
import SpruceIDMobileSdk
import SwiftUI

// 1. Define a function to present a Credential that results in a PermissionRequest
func presentCredential(url: String) async {
    do {
        // Load your CredentialPacks using your storageManager
        let storageManager = StorageManager()
        credentialPacks = try CredentialPack.loadAll(storageManager: storageManager)
        var credentials: [ParsedCredential] = []
        credentialPacks.forEach { credentialPack in
            credentials += credentialPack.list()
            credentialClaims = credentialClaims.merging(
                credentialPack.findCredentialClaims(claimNames: ["name", "type"])
            ) { (_, new) in new }    
        }

        // Instantiate a signer based on a KeyId
        let signer = try Signer(keyId: "KeyID")

        // Define your holder component with context
        // In this example, we use a function that sets context for VC Playground credentials
        holder = try await Holder.newWithCredentials(
            providedCredentials: credentials,
            trustedDids: trustedDids,
            signer: signer,
            contextMap: getVCPlaygroundOID4VCIContext()
        )

        // Create a permission Request
        permissionRequest = try await holder!.authorizationRequest(url: Url(url))
    } catch {
        err = error.localizedDescription
    }
}

Here is an example value, pulled from VC Playground, of the url scanned in an oid4vp QR code. This one in particular is for a VCDM 1.1 Driver's License credential with the veresexchanger verifier.

openid4vp://authorize?client_id=https%3A%2F%2Fqa.veresexchanger.dev%2Fexchangers%2Fz19vRLNoFaBKDeDaMzRjUj8hi%2Fexchanges%2Fz19jRTd4zJFwDJ9hph9A4Ujv7%2Fopenid%2Fclient%2Fauthorization%2Fresponse&request_uri=https%3A%2F%2Fqa.veresexchanger.dev%2Fexchangers%2Fz19vRLNoFaBKDeDaMzRjUj8hi%2Fexchanges%2Fz19jRTd4zJFwDJ9hph9A4Ujv7%2Fopenid%2Fclient%2Fauthorization%2Frequest

2. The user selects the credential (and data fields)

Once you have a PermissionRequest, you can implement a CredentialSelector and a DataFieldSelector. The CredentialSelector should let the user pick which of their credentials to present. A DataFieldSelector can select/unselect which attributes within a credential should be shared or not.

How you implement your Selector code determines the UX in your mobile application. We give an example of what that could look like in our example application.

3. Create and Submit a PermissionResponse

// 2. Obtain permission from the user, after which you can create a PermissionResponse

// Assuming succesfull credential selection, plug them into the
// createPermissionResponse method to create your PermissionResponse
permissionResponse = try await permissionRequest!
    .createPermissionResponse(
    selectedCredentials: selectedCredentials
)

// Finally, submit your PermissionResponse. 
_ = try await holder.submitPermissionResponse(
    response: permissionResponse!)

Last updated

Was this helpful?