# Fraud Detection

## Introduction

Every transaction needs to go through risk control. Integrating Fraud Detection can prevent and reduce fraud rates, significantly improving your transaction success rate.

## Using with Checkout Component

If you are using our checkout component, you don't need to manually import the SDK. The component itself has already integrated the SDK, and you **don't need to do any additional configuration** as the component has already configured the environment for you.

> For checkout component integration, refer to: [PayKKa Checkout UI Component Documentation](/payments/docs/developer-resources/checkout-ui-component).


## Integrating with API Payment

If you are integrating with API payment, you need to manually import the SDK.

### Import

Import the Fraud Detection SDK separately via CDN.

Here's how to import the SDK for Hong Kong and European merchants:

Europe

```html html
<script src="https://checkout.eu.paykka.com/cp/fraud-detection.js"></script>
```

Hong Kong

```html html
<script src="https://checkout.aq.paykka.com/cp/fraud-detection.js"></script>
```

Sandbox

```html html
<script src="https://checkout-sandbox.aq.paykka.com/cp/fraud-detection.js"></script>
```

## Usage

When initializing Fraud Detection, you need to set the environment first.

### Environment Configuration

The configuration for Fraud Detection integration is different for different environments (Hong Kong/Europe), so you need to **configure the corresponding environment**.

Currently supported environments are:

| Environment | Description |
|  --- | --- |
| **eu** | Default value, available for European merchants |
| **hk** | Available for Hong Kong merchants |
| **us** | Available for US merchants, currently not open |


After successfully importing and loading the SDK link, the variable `PayKKaFraudDetection` will be exposed. You need to pass the environment when calling `PayKKaFraudDetection`.


```typescript
const paykkaFraudDetection = PayKKaFraudDetection('hk')
```

PayKKaFraudDetection is a **singleton**, so multiple calls return the same instance. You don't need to worry about duplicate requests.

#### createFraudDetection

You need to call `paykkaFraudDetection.createFraudDetection()` to create Fraud Detection. At this time, it will start initializing and requesting the fraudDetectionID. This method caches the requested result, so multiple calls won't update it.

#### fraudDetectionID

You can get the `fraudDetectionID` by calling `paykkaFraudDetection.fraudDetectionID`.

Requesting the fraudDetectionID takes some time, but you **don't need to wait for the request to complete to initiate payment**. You can pass it directly whether the fraudDetectionID is empty or not.

#### Example


```html html
<!-- Import Fraud Detection SDK -->
<script src="https://checkout-sandbox.aq.paykka.com/cp/fraud-detection.js"></script>
<!-- Payment button -->
<button onclick="handleClickPay()">Pay</button>
```


```javascript javascript
// Set Fraud Detection environment (assuming Hong Kong)
const paykkaFraudDetection = PayKKaFraudDetection('hk')

paykkaFraudDetection.createFraudDetection()

// Click payment button
const handleClickPay = () => {
  // Get fraudDetectionID
  const fraudDetectionID = paykkaFraudDetection.fraudDetectionID
  const requestParams = {
    browser: {
      // Pass fraudDetectionID, whether empty or not
      fraud_detection_id: fraudDetectionID,
      ...otherBrowserInfo
    },
    ...otherParams
  }

  // Send request
}
```

## Sandbox Environment Integration

If you want to use the Fraud Detection SDK in the Sandbox environment, here's an example:


```html html
<!-- Import Fraud Detection SDK -->
<script src="https://checkout-sandbox.aq.paykka.com/cp/fraud-detection.js"></script>
<!-- Payment button -->
<button onclick="handleClickPay()">Pay</button>
```


```javascript javascript
// Configure environment
const paykkaFraudDetection = PayKKaFraudDetection({
  SR: pk_test_51QaC2P5VarcojPHdg13yagk5TqrGkIkeK8I21BgQUZe8BzyRmbtmOg3dKsXjkxt6JlsjyjJMTvBH9dFMCZWRxOkt00tWQ1eHFU
})

// Create Fraud Detection
paykkaFraudDetection.createFraudDetection()

// Click payment button
const handleClickPay = () => {
  const fraudDetectionID = paykkaFraudDetection.fraudDetectionID
  const paymentParams = {
    browser: {
      // Pass fraudDetectionID, whether empty or not
      fraud_detection_id: fraudDetectionID,
      ...otherBrowserInfo
    },
    ...otherPaymentParams
  }

  // Send payment request...
}
```