Updating a store to pass sensitive payment data to the order process

In this lesson, you customize store pages and update store configuration files to pass card verification code information from the Shipping and Billing Method page to the Order Summary page and as parameters of OrderProcess.

Procedure

Configure your site to never persist card verification codes in the WebSphere Commerce database. You can configure this setting, by including the neverPersist parameter with a value of "true" for the card verification code keyword in the PaymentSystemPluginMapping.xml configuration file.
For example, the following configuration ensures that a store does not persist card verification codes, cc_cvc, in the database:
```
<Keyword mask="-" name="cc_cvc" plain="0" neverPersist="true"/>
```
For more information about configuring this file, see PaymentSystemPluginMapping XML file.
Update your store to get the payment instruction ID, paymentInstructionId, and card verification code, cc_cvc, data from the add payment instruction command (PIAdd) response.
1. Go to the workspace_dir\Stores\WebContent\Aurora\javascript\CheckoutArea directory for your store.
2. Open the ShippingAndBillingServicesDeclaration.js file for editing.
3. Find the AjaxAddPaymentInstructionToThisOrder service declaration within the file.
4. Find the following code snippet within the declaration:
```
"CheckoutPayments.setCommonParameters(SBServicesDeclarationJS.langId,SBServicesDeclarationJS.storeId,SBServicesDeclarationJS.catalogId);"
```
5. Add the following lines of code after the code that you found:
```
CheckoutPayments.paymentObjects[1]['piId'] = serviceResponse.paymentInstruction[0].piId;
CheckoutPayments.paymentObjects[1]['cc_cvc'] = serviceResponse.cc_cvc;
```
6. Save and close the file.

Update your store to pass the payment instruction ID and card verification code data to the Order Summary page.

Go to the workspace_dir\Stores\WebContent\Aurora\javascript\CheckoutArea directory for your store.
Open the CheckoutPayments.js file for editing.
Find the showSummaryPage function within the file.

Find the following code snippet within the function:

if(CheckoutHelperJS.getShipmentTypeId() == "1"){
url = "SingleShipmentOrderSummaryView?langId="+this.langId+"&storeId="+this.storeId+"&catalogId="+this.catalogId+"&purchaseorder_id="+po_id+"&quickCheckoutProfileForPayment="+this.quickCheckoutProfileForPaymentFlag;
document.location.href = appendWcCommonRequestParameters(url);
}

Replace the code that you found with the following code snippet:

if(CheckoutHelperJS.getShipmentTypeId() == "1"){
url = "SingleShipmentOrderSummaryView?langId="+this.langId+"&storeId="+this.storeId+"&catalogId="+this.catalogId+"&purchaseorder_id="+po_id+"&quickCheckoutProfileForPayment="+this.quickCheckoutProfileForPaymentFlag+"&paymentInstructionId="+this.paymentObjects[1].piId+"&pay_data_cc_cvc="+this.paymentObjects[1].cc_cvc;
document.location.href = appendWcCommonRequestParameters(url);
}

Save and close the file.

Update your Single Shipment Summary page to retrieve the payment instruction ID and card verification code data from the request parameter and set the values in the checkoutOrder function.
1. Go to the workspace_dir\Stores\WebContent\Aurora\ShoppingArea\CheckoutSection\SingleShipment directory for your store.
2. Open the SingleShipmentSummary.jsp file for editing.
3. Find the following code snippet within the file:
```
CheckoutHelperJS.setCommonParameters('<c:out value='${WCParam.langId}'/>','<c:out value='${WCParam.storeId}'/>','<c:out value='${WCParam.catalogId}'/>');
```
4. Add the following code after the code that you found:
```
CheckoutHelperJS.setPaymentObjects('<c:out value='${WCParam.paymentInstructionId}'/>','<c:out value='${WCParam.pay_data_cc_cvc}'/>');
```
5. Save and close the file.
Pass the payment instruction ID and card verification code data to the request parameters of OrderProcess. OrderProcess is used to submit an order for processing.
1. Go to the workspace_dir\Stores\WebContent\Aurora\javascript\CheckoutArea directory for your store.
2. Open the CheckoutHelper.js file for editing.
3. Find the checkoutOrder function in the file.
4. Add the following lines of code before the checkoutOrder function:
```
paymentInstructionId:"",
pay_data_cc_cvc:"",
	
setPaymentObjects:function(paymentInstructionId,pay_data_cc_cvc){
this.paymentInstructionId = paymentInstructionId;
this.pay_data_cc_cvc = pay_data_cc_cvc;
},
```
5. Find the following line of code within the checkoutOrder function:
```
params["langId"] = this.langId;
```
6. Add the following lines of code after the code that you found:
```
params["paymentInstructionId"] = this.paymentInstructionId;
params["pay_data_cc_cvc"] = this.pay_data_cc_cvc;
```
7. Save the file.
Add the payment instruction ID and card verification code data to the submitOrder method in your REST template configuration file.
1. Go to the workspace_dir\Stores\WebContent\WEB-INF\config\com.ibm.commerce.order-fep directory for your store.
2. Open the rest-template-config.xml file for editing.
3. Find the submitOrder method in the file.
4. Add the following lines of code after the line of code "SMS":"$SMS"
```
"paymentInstructionId" : "$paymentInstructionId",
"pay_data_cc_cvc" : "$pay_data_cc_cvc"
```
  Note: Ensure that you add a comma at the end of the line of code "SMS":"$SMS"
  For example,
```
"SMS":"$SMS",
"paymentInstructionId" : "$paymentInstructionId",
"pay_data_cc_cvc" : "$pay_data_cc_cvc"
```
5. Save the file.
Clear your browser cache and restart your WebSphere Commerce server.
Test your customization by verifying that the card verification code that is passed to your payment plug-in is the same code that a shopper enters on the storefront.
1. Get the payment instruction ID and card verification code data within your payment plug-in bean.
  Refer to the following sample code to help you determine how to retrieve this information:
```
PaymentInstruction pi = approveTransaction.getPayment().getPaymentInstruction();
String piId = pi.getId();
String cc_cvc = pi.getExtendedData().getString("cc_cvc");
```
2. Print the card verification code ("cc_cvc") to the log file or use the Debug mode to verify the result. If you print the information, review the log file to ensure that the information is correct and then remove the code that prints the information to the log.
  
  Important: To ensure the security of card verification code information if you print the result, ensure that you remove any code that prints the information after you complete your testing.

Optional: If you want to pass the CVC value through HTML form using the POST method, replace Step 2 and 3 with the following steps:

Update your store to get the payment instruction ID (paymentInstructionId) and card verification code (cc_cvc), data from the add payment instruction command (PIAdd) response, then POST them to Order Summary page.

Go to the workspace_dir\Stores\WebContent\Aurora\javascript\CheckoutArea directory for your store.
        Open the ShippingAndBillingServicesDeclaration.js file for editing.
        Find the AjaxAddPaymentInstructionToThisOrder service declaration within the file.
        Find the following code snippet within the declaration:

        "CheckoutPayments.setCommonParameters(SBServicesDeclarationJS.langId,SBServicesDeclarationJS.storeId,SBServicesDeclarationJS.catalogId);"

        Add the following lines of code after the code that you found:

        document.getElementById("formCVC_piId").value = serviceResponse.paymentInstruction[0].piId;
        document.getElementById("formCVC_cc_cvc").value = serviceResponse.cc_cvc;
        document.getElementById("formCVC_langId").value = SBServicesDeclarationJS.langId;
        document.getElementById("formCVC_storeId").value = SBServicesDeclarationJS.storeId;
        document.getElementById("formCVC_catalogId").value = SBServicesDeclarationJS.catalogId;
        document.getElementById("formCVC").submit();
       
        Then comment out or remove this line:
        CheckoutPayments.showSummaryPage();

        Save and close the file.

Update the Payment Method Display page to compose a form for passing CVC parameters.

Go to the workspace_dir\Stores\WebContent\Aurora\ShoppingArea\CheckoutSection\
        Open CheckoutPaymentsAndBillingAddress.jspf for editing.
        Find the following line:
                        </form>
        Add following code after above line you found:
		<form action='SingleShipmentOrderSummaryView' method='post' name='formCVC' id='formCVC' style='display:none'>
		<input type='hidden' name='paymentInstructionId' id='formCVC_piId' value='000' />
		<input type='hidden' name='pay_data_cc_cvc' id='formCVC_cc_cvc' value='000' />
		<input type='hidden' name='langId' id='formCVC_langId' value='000'/>
		<input type='hidden' name='storeId' id='formCVC_storeId' value='000'/>
		<input type='hidden' name='catalogId' id='formCVC_catalogId' value='000'/>
		</form>