Subscriptions
Manage subscriptions and control coupon and ribbon UI elements.
Note: Subscriptions JavaScript APIs are supported starting from TikTok version 40.3.0. Please use .canIUse for version compatibility before using them.
.canIUse(schema)
const result = TTMinis.canIUse('createSubscription');
if (result) {
TTMinis.createSubscription((res: Result) => {
// xxx
}, options: Options)
} else {
// xxx
}Schema
schema: string
TTMinis.canIUse(`${api}.${method}.${param}.${option}`);
- api: API name
- method: call mode, valid values are return, object, callback
- params: parameter or return value
- options: valid values of parameters or attributes of return valuesTTMinis.createSubscription(callback, options)
Creates a subscription.
Parameters
Field | Type | Description | Required |
|
| The associated order ID. | Yes |
Callback parameters
Field | Type | Description |
|
| Whether the operation succeeded. |
|
| The order ID. |
|
| The subscription ID. |
|
| Returned on failure. |
Example
TTMinis.createSubscription(
function (res) {
if (res.error) {
console.error('createSubscription failed', res.error);
return;
}
console.log('subscription id:', res.subscription_id);
},
{
trade_order_id: 'order_123456',
},
);TTMinis.changeSubscription(callback, options)
Changes an existing subscription.
Parameters
Field | Type | Description | Required |
|
| The associated order ID. | Yes |
Callback parameters
Field | Type | Description |
|
| Whether the operation succeeded. |
|
| The order ID. |
|
| The subscription ID. |
|
| Returned on failure. |
Example
TTMinis.changeSubscription(
function (res) {
if (res.error) {
console.error('changeSubscription failed', res.error);
return;
}
console.log('changeSubscription result:', res);
},
{
trade_order_id: 'order_123456',
},
);errorCode | errorMsg |
118101 | Required params empty |
118502 | Client Internal Error |
118600 | User Error |
118601 | User Cancel |
118602 | Third party error |
118302 | reactivate subscription timeout |
TTMinis.showSurfaceCoupon(callback)
Displays the floating coupon entry. Used to display the prompt page for users who have received the initial subscription discount. The timing for the call happens before displaying the product list page. The API currently does not display the style effect during the integration. A return value of success indicates success.
Illustrated below is what a user sees when they receive a coupon:
Shown below is an example of a product listing page, where the pinned ribbon at the top is implemented by TikTok and requires the user to manually close it or your platform to call hideRibbon to close it when the user exits the product page.
TTMinis.showSurfaceCoupon((res: Result) => {
// xxx
})
interface Result {
is_success: boolean;
error?: {
error_code: string;
error_msg: string;
}
}Callback
TTMinis.showSurfaceCoupon(callback)
interface Result {
is_success: boolean;
error?: {
error_code: string;
error_msg: string;
}
}Example
TTMinis.showSurfaceCoupon(function({ is_success }) => {
if (is_success) {
// Display successful
}
})
TTMinis.showSurfaceCoupon(function (res) {
console.log('showSurfaceCoupon:', res);
});TTMinis.hideRibbon(callback)
Hides the page ribbon.
When users receive a coupon, TikTok will display a pinned ribbon at the top of the product page showing the discount. This ribbon must be hidden when the user leaves the product list page. There are two ways to hide it:
- The user can click the 'x' on the ribbon to close it
- Call the
hideRibbonAPI to close it when the product list page is closed
TTMinis.showSurfaceCoupon(function (res) {
console.log('showSurfaceCoupon:', res);
});
interface Result {
is_success: boolean;
error?: {
error_code: string;
error_msg: string;
}
}Note: The showSurfaceCoupon and hideRibbon APIs share the same callback structure.
Callback parameters
Field | Type | Description |
|
| Whether the operation succeeded. |
|
| Returned on failure. |
Example
TTMinis.hideRibbon(function({ is_success }) => {
if (is_success) {
// Closed successfully
}
})