# Manage payment sources

> For the complete machine-readable documentation index, see [llms.txt](https://apidocs.chargebee.com/llms.txt).


[Idempotency Supported](/docs/api/v2/pcv-1/idempotency)

This API generates a hosted page URL to add new or update existing payment sources for the customer.

Use one of the following methods to open the hosted page:

-   **In-app modal**: Use Chargebee.js [`openCheckout()`](https://www.chargebee.com/checkout-portal-docs/cbinstanceobj-api-ref.html#opencheckout-options) to open the hosted page in a modal popup in your website or application.
-   **Standalone page**: Redirect the customer to the hosted page `url`.

Do not embed the hosted page in your own [iframe](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/iframe).

## Sample Request

#### cURL

```bash
curl  https://{site}.chargebee.com/api/v2/hosted_pages/manage_payment_sources \
     -u {site_api_key}:\
     -d "customer[id]"="__test__KyVnHhSBWmJIX2uE" \
     -d "card[gateway_account_id]"="gw___test__KyVnGlSBWmAIk2Ph"
```

#### .NET

```dotnet
using ChargeBee.Api;
using ChargeBee.Models;

ApiConfig.Configure("{site}","{site_api_key}");
EntityResult result = HostedPage.ManagePaymentSources()
		.CustomerId("__test__KyVnHhSBWmJIX2uE")
		.CardGatewayAccountId("gw___test__KyVnGlSBWmAIk2Ph")
		.Request();

HostedPage hostedPage = result.HostedPage;
```

#### Go

```go
package main
import (
    "fmt"
    "github.com/chargebee/chargebee-go/v3"
    hostedpageAction "github.com/chargebee/chargebee-go/v3/actions/hostedpage"
    "github.com/chargebee/chargebee-go/v3/models/hostedpage"
)
func main() {
    chargebee.Configure("{site_api_key}","{site}");
    res,err := hostedpageAction.ManagePaymentSources(&hostedpage.ManagePaymentSourcesRequestParams{
        Customer : &hostedpage.ManagePaymentSourcesCustomerParams{
            Id : "__test__KyVnHhSBWmJIX2uE",
        },
        Card : &hostedpage.ManagePaymentSourcesCardParams{
            GatewayAccountId : "gw___test__KyVnGlSBWmAIk2Ph",
        },
    }).Request()
    if err != nil {
        fmt.Println(err)
    } else {
        HostedPage := res.HostedPage
    }
}
```

#### Go

```go
package main

import (
  "fmt"
  "github.com/chargebee/chargebee-go/v4"
)

func main() {
  config := &chargebee.ClientConfig{
    SiteName: "{site}",
    ApiKey: "{site_api_key}",
  }    
  client := chargebee.NewClient(config)
  req := &chargebee.HostedPageManagePaymentSourcesRequest{
    Customer : &chargebee.HostedPageManagePaymentSourcesCustomer{
        Id : "__test__KyVnHhSBWmJIX2uE",
    },
    Card : &chargebee.HostedPageManagePaymentSourcesCard{
        GatewayAccountId : "gw___test__KyVnGlSBWmAIk2Ph",
    },
}
  res, err := client.HostedPage.ManagePaymentSources(req)
      if err != nil {
        fmt.Println(err)
    } else {
        HostedPage := res.HostedPage
    }
}
```

#### Java

```java
import com.chargebee.*;
import com.chargebee.ListResult;
import com.chargebee.models.*;
import com.chargebee.models.enums.*;
import java.io.IOException;

public class Sample {

    public static void main(String args[]) throws IOException, Exception {
        Environment.configure("{site}", "{site_api_key}");
        Result result = HostedPage.managePaymentSources()
            .customerId("__test__KyVnHhSBWmJIX2uE")
            .cardGatewayAccountId("gw___test__KyVnGlSBWmAIk2Ph")
            .request();

        HostedPage hostedPage = result.hostedPage();
    }
}
```

#### Java

```java
import com.chargebee.v4.client.ChargebeeClient;
import com.chargebee.v4.models.hostedPage.HostedPage;
import com.chargebee.v4.models.hostedPage.params.HostedPageManagePaymentSourcesParams;
import com.chargebee.v4.models.hostedPage.responses.HostedPageManagePaymentSourcesResponse;

public class HostedPageManagePaymentSources {

    public static void main(String[] args) {
        ChargebeeClient client = ChargebeeClient.builder()
            .apiKey("{site_api_key}")
            .siteName("{site}")
            .build();

        HostedPageManagePaymentSourcesParams.CustomerParams customerParams =
            HostedPageManagePaymentSourcesParams.CustomerParams.builder()
                .id("__test__KyVnHhSBWmJIX2uE")
                .build();

        HostedPageManagePaymentSourcesParams.CardParams cardParams =
            HostedPageManagePaymentSourcesParams.CardParams.builder()
                .gatewayAccountId("gw___test__KyVnGlSBWmAIk2Ph")
                .build();

        HostedPageManagePaymentSourcesParams params = HostedPageManagePaymentSourcesParams.builder()
            .customer(customerParams)
            .card(cardParams)
            .build();

        HostedPageManagePaymentSourcesResponse response = client.hostedPages().managePaymentSources(params);

        HostedPage hostedPage = response.getHostedPage();
    }
}
```

#### Node.js

```node
import Chargebee from "chargebee";

const chargebee = new Chargebee({
    site: "{site}",
    apiKey: "{site_api_key}",
});

try {
    const result = await chargebee.hostedPage.managePaymentSources({
        customer: {
            id: "__test__KyVnHhSBWmJIX2uE"
        },
        card: {
            gateway_account_id: "gw___test__KyVnGlSBWmAIk2Ph"
        }
    });

    console.log(result);
    const hostedPage = result.hosted_page;
} catch (err) {
    console.log(err);
}
```

#### PHP

```php
<?php

require __DIR__ . '/vendor/autoload.php';

use Chargebee\ChargebeeClient;

$chargebee = new ChargebeeClient(options: [
    "site" => "{site}",
    "apiKey" => "{site_api_key}",
]);
$result = $chargebee->hostedPage()->managePaymentSources([
    "customer" => [
        "id" => "__test__KyVnHhSBWmJIX2uE"
    ],
    "card" => [
        "gateway_account_id" => "gw___test__KyVnGlSBWmAIk2Ph"
    ]
]);
$hostedPage = $result->hosted_page;
```

#### Python

```python
from chargebee import Chargebee

cb_client = Chargebee(api_key="{site_api_key}", site="{site}")
response = cb_client.HostedPage.manage_payment_sources(
    cb_client.HostedPage.ManagePaymentSourcesParams(
        customer=cb_client.HostedPage.ManagePaymentSourcesCustomerParams(
            id="__test__KyVnHhSBWmJIX2uE"
        ),
        card=cb_client.HostedPage.ManagePaymentSourcesCardParams(
            gateway_account_id="gw___test__KyVnGlSBWmAIk2Ph"
        )
    )
)
hosted_page = response.hosted_page
```

#### Ruby

```ruby
require 'chargebee'

ChargeBee.configure(:site => "{site}",
  :api_key => "{site_api_key}")

result = ChargeBee::HostedPage.manage_payment_sources({
  :customer => {
    :id => "__test__KyVnHhSBWmJIX2uE"
  },
  :card => {
    :gateway_account_id => "gw___test__KyVnGlSBWmAIk2Ph"
  }
})

hosted_page = result.hosted_page
```

## Sample Response

```json
{
  "hosted_page": {
    "created_at": 1517506015,
    "embed": false,
    "expires_at": 1517592415,
    "id": "__test__LycuLPCkhW3axOiXjHWkOOVl3ZE3yLLni",
    "layout": "in_app",
    "object": "hosted_page",
    "resource_version": 1517506015000,
    "state": "created",
    "type": "manage_payment_sources",
    "updated_at": 1517506015,
    "url": "https://yourapp.chargebee.com/pages/v3/__test__LycuLPCkhW3axOiXjHWkOOVl3ZE3yLLni/"
  }
}
```

## URL Format

**POST** https://[site].chargebee.com/api/v2/hosted_pages/manage_payment_sources

## Input Parameters

- `business_entity_id` (optional, string, max chars=50)
  The ID of the business entity created for the site. For Product Catalog 1.0, all the site data is tied to this business entity.
  
  **Note** [Multiple Business Entities](/docs/api/business_entities) is a feature available only on Product Catalog 2.0.

- `redirect_url` (optional, string, max chars=250)
  The customers will be redirected to this URL upon successful checkout. The hosted page id and state will be passed as parameters to this URL.
  
  **Note** :
  
  -   Although the customer will be redirected to the `redirect_url` after successful checkout, we do not recommend relying on it for completing critical post-checkout actions. This is because redirection may not happen due to unforeseen reasons such as user closing the tab, or exiting the browser, and so on. If there is any synchronization that you are doing after the redirection, you will have to have a backup. Chargebee recommends listening to appropriate webhooks such as [`subscription_created`](/docs/api/events) or [`invoice_generated`](/docs/api/events) to verify a successful checkout.
  -   Redirect URL configured in Settings > Hosted Pages Settings would be overriden by this redirect URL.
  -   _Eg :_ _http://yoursite.com?id=\*\*&state=succeeded_
  -   This parameter is not applicable for iframe messaging.

- `customer` (optional, string)
  Parameters for customer
  - `id` (required, string, max chars=50)
    Identifier of the customer.

- `card` (optional, string)
  Parameters for card
  - `gateway_account_id` (optional, string, max chars=50)
    The gateway account in which this payment source is stored.

## Returns

- `hosted_page` (Hosted page object)
  Resource object representing hosted\_page