LG-3204: Create Image Upload API

app/controllers/concerns/idv_session.rb

@@ -24,6 +24,14 @@ def liveness_upgrade_required?
     sp_session[:ial2_strict] && !current_user.active_profile&.includes_liveness_check?
   end
 
+  def liveness_checking_enabled?
+    FeatureManagement.liveness_checking_enabled? && (no_sp? || sp_session[:ial2_strict])
+  end
+
+  def no_sp?
+    sp_session[:issuer].blank?
+  end
+
   def confirm_idv_vendor_session_started
     return if flash[:allow_confirmations_continue]
     redirect_to idv_doc_auth_url unless idv_session.proofing_started?

app/controllers/idv/image_upload_controller.rb

@@ -0,0 +1,73 @@
+module Idv
+  class ImageUploadController < ApplicationController
+    include IdvSession
+
+    def upload
+      validation_error = validate_request(request)
+      response = validation_error || upload_and_check_images
+      render json: response
+    end
+
+    private
+
+    def upload_and_check_images
+      doc_response = client.post_images(front_image: @front_image,
+                                        back_image: @back_image,
+                                        selfie_image: @selfie_image,
+                                        liveness_checking_enabled: liveness_checking_enabled?)
+      return error_json(doc_response.errors.first) unless doc_response.success?
+      upload_info = {
+        documents: doc_response.to_h,
+      }
+      store_pii(doc_response)
+      user_session['idv/doc_auth']['api_upload'] = upload_info
+      success_json('Uploaded images')
+    end
+
+    def store_pii(doc_response)
+      user_session['idv/doc_auth'][:pii_from_doc] = doc_response.pii_from_doc.merge(
+        uuid: current_user.uuid,
+        phone: current_user.phone_configurations.take&.phone,
+      )
+    end
+
+    def validate_request(request)
+      steps = %i[check_content_type check_image_fields]
+      steps.each do |step|
+        err = method(step).call(request)
+        return error_json(err) if err
+      end
+      nil
+    end
+
+    def check_content_type(request)
+      "Invalid content type #{request.content_type}" if request.content_type != 'application/json'
+    end
+
+    def check_image_fields(request)
+      data = request.body.read
+      @front_image = data['front']
+      @back_image = data['back']
+      @selfie_image = data['selfie']
+      'Missing image keys' unless [@front_image, @back_image, @selfie_image].all?
+    end
+
+    def error_json(reason)
+      {
+        status: 'error',
+        message: reason,
+      }
+    end
+
+    def success_json(reason)
+      {
+        status: 'success',
+        message: reason,
+      }
+    end
+
+    def client
+      @client ||= DocAuthClient.client
+    end
+  end
+end

app/javascript/app/document-capture/components/documents-step.jsx

@@ -9,8 +9,8 @@ import DeviceContext from '../context/device';
 /**
  * @typedef DocumentsStepValue
  *
- * @prop {DataURLFile=} front_image Front image value.
- * @prop {DataURLFile=} back_image  Back image value.
+ * @prop {DataURLFile=} front Front image value.
+ * @prop {DataURLFile=} back  Back image value.
  */
 
 /**
@@ -46,24 +46,20 @@ function DocumentsStep({ value = {}, onChange = () => {} }) {
         <li>{t('doc_auth.tips.document_capture_id_text3')}</li>
         {!isMobile && <li>{t('doc_auth.tips.document_capture_id_text4')}</li>}
       </ul>
-      {DOCUMENT_SIDES.map((side) => {
-        const inputKey = `${side}_image`;
-
-        return (
-          <AcuantCapture
-            key={side}
-            /* i18n-tasks-use t('doc_auth.headings.document_capture_back') */
-            /* i18n-tasks-use t('doc_auth.headings.document_capture_front') */
-            label={t(`doc_auth.headings.document_capture_${side}`)}
-            /* i18n-tasks-use t('doc_auth.headings.back') */
-            /* i18n-tasks-use t('doc_auth.headings.front') */
-            bannerText={t(`doc_auth.headings.${side}`)}
-            value={value[inputKey]}
-            onChange={(nextValue) => onChange({ [inputKey]: nextValue })}
-            className="id-card-file-input"
-          />
-        );
-      })}
+      {DOCUMENT_SIDES.map((side) => (
+        <AcuantCapture
+          key={side}
+          /* i18n-tasks-use t('doc_auth.headings.document_capture_back') */
+          /* i18n-tasks-use t('doc_auth.headings.document_capture_front') */
+          label={t(`doc_auth.headings.document_capture_${side}`)}
+          /* i18n-tasks-use t('doc_auth.headings.back') */
+          /* i18n-tasks-use t('doc_auth.headings.front') */
+          bannerText={t(`doc_auth.headings.${side}`)}
+          value={value[side]}
+          onChange={(nextValue) => onChange({ [side]: nextValue })}
+          className="id-card-file-input"
+        />
+      ))}
     </>
   );
 }
@@ -75,6 +71,6 @@ function DocumentsStep({ value = {}, onChange = () => {} }) {
  *
  * @return {boolean} Whether step is valid.
  */
-export const isValid = (value) => Boolean(value.front_image && value.back_image);
+export const isValid = (value) => Boolean(value.front && value.back);
 
 export default DocumentsStep;

app/javascript/app/document-capture/context/upload.jsx

@@ -0,0 +1,30 @@
+import React, { createContext } from 'react';
+import defaultUpload from '../services/upload';
+
+const UploadContext = createContext(defaultUpload);
+
+/** @typedef {import('react').ReactNode} ReactNode */
+
+/**
+ * @typedef {(payload:Record<string,any>,csrf?:string)=>Promise<any>} UploadImplementation
+ */
+
+/**
+ * @typedef UploadContextProviderProps
+ *
+ * @prop {UploadImplementation=} upload   Custom upload implementation.
+ * @prop {string=}               csrf     CSRF token to send as parameter to upload implementation.
+ * @prop {ReactNode}             children Child elements.
+ */
+
+/**
+ * @param {UploadContextProviderProps} props Props object.
+ */
+function UploadContextProvider({ upload = defaultUpload, csrf, children }) {
+  const uploadWithCSRF = (payload) => upload(payload, csrf);
+
+  return <UploadContext.Provider value={uploadWithCSRF}>{children}</UploadContext.Provider>;
+}
+
+export default UploadContext;
+export { UploadContextProvider as Provider };

app/javascript/app/document-capture/services/upload.js

@@ -1,8 +1,30 @@
-function upload(payload) {
-  return new Promise((resolve, reject) => {
-    const isFailure = window.location.search === '?fail';
-    setTimeout(isFailure ? reject : () => resolve({ ...payload, saved: true }), 2000);
-  });
+/**
+ * Endpoint to which payload is submitted.
+ *
+ * @type {string}
+ */
+const ENDPOINT = '/api/verify/upload';
+
+/**
+ * @type {import('../context/upload').UploadImplementation}
+ */
+function upload(payload, csrf) {
+  return fetch(ENDPOINT, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      'X-CSRF-Token': csrf,
+    },
+    body: JSON.stringify(payload),
+  })
+    .then((response) => response.json())
+    .then((result) => {
+      if (!['success', 'error'].includes(result.status)) {
+        throw Error('Malformed response');
+      }
+
+      return result;
+    });
 }
 
 export default upload;

app/javascript/packs/document-capture.jsx

@@ -5,6 +5,7 @@ import AssetContext from '../app/document-capture/context/asset';
 import I18nContext from '../app/document-capture/context/i18n';
 import DeviceContext from '../app/document-capture/context/device';
 import { Provider as AcuantProvider } from '../app/document-capture/context/acuant';
+import { Provider as UploadContextProvider } from '../app/document-capture/context/upload';
 
 const { I18n: i18n, assets } = window.LoginGov;
 
@@ -27,11 +28,13 @@ render(
     endpoint={getMetaContent('acuant-sdk-initialization-endpoint')}
   >
     <I18nContext.Provider value={i18n.strings}>
-      <AssetContext.Provider value={assets}>
-        <DeviceContext.Provider value={device}>
-          <DocumentCapture isLivenessEnabled={isLivenessEnabled} />
-        </DeviceContext.Provider>
-      </AssetContext.Provider>
+      <UploadContextProvider csrf={getMetaContent('csrf-token')}>
+        <AssetContext.Provider value={assets}>
+          <DeviceContext.Provider value={device}>
+            <DocumentCapture isLivenessEnabled={isLivenessEnabled} />
+          </DeviceContext.Provider>
+        </AssetContext.Provider>
+      </UploadContextProvider>
     </I18nContext.Provider>
   </AcuantProvider>,
   appRoot,

app/services/idv/steps/doc_auth_base_step.rb

@@ -2,6 +2,8 @@
 module Idv
   module Steps
     class DocAuthBaseStep < Flow::BaseStep
+      include IdvSession
+
       def initialize(flow)
         super(flow, :doc_auth)
       end
@@ -97,13 +99,13 @@ def post_back_image
         result
       end
 
-      def post_images
+      def post_images(front, back, selfie)
         return throttled_response if throttled_else_increment
 
         result = DocAuthClient.client.post_images(
-          front_image: front_image.read,
-          back_image: back_image.read,
-          selfie_image: selfie_image&.read,
+          front_image: front,
+          back_image: back,
+          selfie_image: selfie,
           liveness_checking_enabled: liveness_checking_enabled?,
         )
         # DP: should these cost recordings happen in the doc_auth_client?
@@ -171,14 +173,6 @@ def mark_document_capture_or_image_upload_steps_complete
         end
       end
 
-      def liveness_checking_enabled?
-        FeatureManagement.liveness_checking_enabled? && (no_sp? || sp_session[:ial2_strict])
-      end
-
-      def no_sp?
-        sp_session[:issuer].blank?
-      end
-
       def mobile?
         client = DeviceDetector.new(request.user_agent)
         client.device_type != 'desktop'

app/services/idv/steps/document_capture_step.rb

@@ -2,18 +2,28 @@ module Idv
   module Steps
     class DocumentCaptureStep < DocAuthBaseStep
       def call
-        response = post_images
-        if response.success?
+        api_upload = flow_session['api_upload']
+        response = (api_upload && api_upload['documents']) || post_form_images
+        handle_response(response)
+      end
+
+      private
+
+      def post_form_images
+        selfie = selfie_image ? selfie_image.read : nil
+        post_images(front_image.read, back_image.read, selfie)
+      end
+
+      def handle_response(response)
+        if response.to_h[:success]
           save_proofing_components
-          extract_pii_from_doc(response)
+          extract_pii_from_doc(response) unless flow_session[:pii_from_doc]
           response
         else
           handle_document_verification_failure(response)
         end
       end
 
-      private
-
       def handle_document_verification_failure(response)
         mark_step_incomplete(:document_capture)
         notice = if liveness_checking_enabled?

app/services/idv/steps/selfie_step.rb

@@ -46,6 +46,7 @@ def handle_selfie_step_failure(failure_response)
         failure(failure_response.errors.first, failure_response.to_h)
       end
 
+      # rubocop:disable Naming/AccessorMethodName
       def results_response
         @results_response ||= DocAuthClient.client.get_results(
           instance_id: flow_session[:instance_id],

config/routes.rb

@@ -20,6 +20,9 @@
   # Twilio Request URL for inbound SMS
   post '/api/sms/receive' => 'sms#receive'
 
+  # Image upload API for doc auth
+  post '/api/verify/upload' => 'idv/image_upload#upload'
+
   post '/api/service_provider' => 'service_provider#update'
   match '/api/voice/otp' => 'voice/otp#show',
         via: %i[get post],