Watch Condition Module
观看条件模块(auth) is primarily responsible for watch condition authorization. Before a viewer enters the live streaming page, they must complete watch condition authorization. Developers can use the watchCore.auth.isAuthorized method to obtain the viewer's authorization status:
- Unauthorized: Display a guide/authorization page for authorization. After authorization, re-
watchCore.setupthe core instance of the watch page and callwatchCore.connectto connect to the chat room. Once connected, display the live streaming watch page. - Authorized: Directly call
watchCore.connectto connect to the chat room. Once connected, display the live streaming watch page.
Example:
// 观众未进行观看条件授权
if (!watchCore.auth.isAuthorized()) {
// TODO:显示引导/授权页
// 观众点击观看页入口或执行观看条件授权,如:无条件授权
const result = await watchCore.auth.verifyNoneAuth();
if (!result.success) {
console.error('授权失败了!!', result.failReason);
return;
}
// 当观众执行观看条件授权成功,需要重新安装 watchCore
await watchCore.setup();
}
// 当完成观看条件授权后,即可连接聊天室进入直播观看页
await watchCore.connect();
// TODO:连接成功,显示直播观看页
For details on each watch condition, please refer to the development documentation for this module.
1. Watch Condition Types
Enum: AuthType
| Constant | Enum Member | Description | Setting Information |
|---|---|---|---|
'none' |
AuthType.None |
Unconditional Watch / Public Watch | AuthSettingItemNone |
'pay' |
AuthType.Pay |
Paid Watch | AuthSettingItemPay |
'phone' |
AuthType.Phone |
Whitelist Watch | AuthSettingItemPhone |
'info' |
AuthType.Info |
Registration Watch | AuthSettingItemInfo |
'code' |
AuthType.Code |
Verification Code Watch | AuthSettingItemCode |
'custom' |
AuthType.Custom |
Custom Authorization | AuthSettingItemCustom |
'external' |
AuthType.External |
External Authorization | AuthSettingItemExternal |
'direct' |
AuthType.Direct |
Direct Authorization | AuthSettingItemDirect |
'enterpriseWeChat' |
AuthType.EnterpriseWeChat |
WeCom Authorization | AuthSettingItemEnterpriseWeChat |
'inviteWatch' |
AuthType.InviteWatch |
Invitation Watch | AuthSettingItemInviteWatch |
2. Usage
2.1 Get Watch Condition Settings List
Refer to the corresponding documentation for details on each watch condition's settings.
- When no watch restrictions are enabled in the backend, the settings list returns [Unconditional Authorization].
- When watch restrictions are enabled in the backend, the settings list returns [Primary Watch Condition, Secondary Watch Condition].
API Method: getAuthSettings(): AuthSettingItem[]
Return Value Description: Watch condition settings list, type AuthSettingItem[]
Example:
const authSettings = watchCore.auth.getAuthSettings();
authSettings.forEach(settingItem => {
console.log('设置类型信息', settingItem);
console.log('设置类型', settingItem.authType);
});
2.2 Check if the Current User Has Completed Watch Condition Authorization
API Method: isAuthorized(): boolean
Return Value Description: Whether authorization is complete
Example:
const isAuthorized = watchCore.auth.isAuthorized();
if (isAuthorized) {
console.log('观众已进行观看条件授权,进入观看页');
} else {
console.log('观众未进行观看条件授权,进入引导页进行授权');
}
3. Verifying Watch Conditions
The watch page SDK provides verification APIs for each watch condition. Developers can use the corresponding API to verify the watch condition. Once verification is successful, the live streaming watch page can be displayed.
3.1 Execute a Single Watch Condition Verification
Regardless of whether the verification is successful or not, the Promise for all watch condition verification methods will return the verification result result, which is of type AuthVerifyResult. When result.success is true, it indicates successful watch condition verification; false indicates failure. For specific failures, see Watch Condition Verification Failure Handling.
Code example:
/**
* 验证白名单观看
* @param phone 白名单
*/
async function verifyPhoneAuth(phone) {
const result = await watchCore.auth.verifyPhoneAuth({
phone,
});
if (result.success) {
// 验证成功
handleAuthVerifySuccess(result);
} else {
// 验证失败
handleAuthVerifyFail(result);
}
}
/**
* 统一处理验证观看条件成功
*/
async function handleAuthVerifySuccess(successResult) {
if (!successResult.success) {
return;
}
// 重新安装观看页
await watchCore.setup();
console.log(watchCore.auth.isAuthorized()); // 此时返回 true
console.log('验证成功,进入观看页');
}
AuthVerifyResult Type
/** 观看条件验证结果 */
type AuthVerifyResult<T extends AuthType> = AuthVerifyResultSuccess<T> | AuthVerifyResultFail<T>;
/** 观看条件验证结果(成功) */
interface AuthVerifyResultSuccess<T extends AuthType = AuthType> {
/** 观看条件类型 */
authType: T;
/** 成功状态 */
success: true;
}
/** 观看条件验证结果(失败) */
interface AuthVerifyResultFail<T extends AuthType = AuthType> {
/** 观看条件类型 */
authType: T;
/** 成功状态 */
success: false;
/** 失败原因 */
failReason: AuthVerifyError;
/** 失败信息 */
failMessage?: string;
/** 获取重定向跳转地址 */
getRedirectUrl?: () => string;
}
3.2 Verification Failure Handling
When watch condition verification fails (i.e., result.success is false), the failure reason can be obtained via result.failReason. Then, error prompts or other handling can be performed on the page. This field is of type AuthVerifyError enum. Example code:
/**
* 处理观看条件失败
* @param failResult 失败结果
*/
function handleAuthVerifyFail(failResult) {
switch (failResult.failReason) {
// 未知原因
case AuthVerifyError.Unknow:
toast.error('验证失败:未知原因');
break;
// 白名单不存在
case AuthVerifyError.PhoneNotExist:
toast.error('验证失败:白名单不存在');
break;
// 需要重定向
case AuthVerifyError.RedirectUrl:
if (failResult.getRedirectUrl) {
const redirectUrl = failResult.getRedirectUrl();
toast.error('验证失败,需要重定向', redirectUrl);
}
break;
// ...其他错误处理
}
}
3.3 Watch Condition Verification Failure Reasons
Enum: AuthVerifyError
| Constant | Enum Member | Description | Scenario |
|---|---|---|---|
'Unknown' |
AuthVerifyError.Unknown |
Unknown Error | General |
'RedirectUrl' |
AuthVerifyError.RedirectUrl |
Redirect Required | General |
'ImageCodeError' |
AuthVerifyError.ImageCodeError |
CAPTCHA Error | General |
'SystemException' |
AuthVerifyError.SystemException |
System Exception | General |
'InvalidWatchAuth' |
AuthVerifyError.InvalidWatchAuth |
Invalid Watch Condition | General |
'PhoneEmpty' |
AuthVerifyError.PhoneEmpty |
Whitelist Member Code is Empty | Whitelist Watch |
'PhoneUsed' |
AuthVerifyError.PhoneUsed |
Whitelist Member Code Already Used | Whitelist Watch |
'PhoneNotExist' |
AuthVerifyError.PhoneNotExist |
Whitelist Member Code Does Not Exist | Whitelist Watch |
'SmsCodeError' |
AuthVerifyError.SmsCodeError |
SMS Verification Code Error | Registration Watch |
'PhoneNotRegister' |
AuthVerifyError.PhoneNotRegister |
Phone Number Not Registered | Registration Watch |
'CodeEmpty' |
AuthVerifyError.CodeEmpty |
Watch Verification Code is Empty | Verification Code Watch |
'CodeError' |
AuthVerifyError.CodeError |
Watch Verification Code Error | Verification Code Watch |
'CodeNeedVerify' |
AuthVerifyError.CodeNeedVerify |
Watch Verification Code Requires Verification | Verification Code Watch |
'CustomSignParamsMiss' |
AuthVerifyError.CustomSignParamsMiss |
Missing Custom Authorization Parameters | Custom Authorization |
'ExternalError' |
AuthVerifyError.ExternalError |
External Authorization Failed | External Authorization |
'SameViewer' |
AuthVerifyError.SameViewer |
Same Viewer | Direct Authorization / External Authorization |
4. API Method Overview
| API Method | Description |
|---|---|
| isAuthorized | Check if the current user has completed watch condition authorization |
| getAuthSettings | Get the watch condition settings list |
| verifyNoneAuth | Verify unconditional watch / public watch |
| verifyPhoneAuth | Verify whitelist watch |
| getAuthPayData | Get payment information for paid watch |
| checkPayStatus | Get the payment status for paid watch |
| startCheckPayStatusPolling | Start polling for payment status check |
| closeCheckPayStatusPolling | Stop polling for payment status check |
| getWechatPayCheckData | Get WeChat scan-to-watch information |
| checkWechatPayStatus | Get WeChat scan-to-watch status |
| startCheckWechatPayStatusPolling | Start polling for WeChat payment status check |
| closeCheckWechatPayStatusPolling | Stop polling for WeChat payment status check |
| verifyCodeAuth | Verify verification code watch |
| getAuthInfoFields | Get the registration watch form settings list |
| verifyInfoAuth | Verify registration watch |
| loginInfoAuth | Login for registration watch |
| getCustomAuthUrl | Get the URL for custom authorization |
| redirectCustomAuthUrl | Redirect to the custom authorization URL |
| allowAutoRedirectCustomAuthUrl | Allow automatic redirect to the custom authorization URL |
| allowToVerifyCustomAuth | Allow verification of custom authorization |
| verifyCustomAuth | Verify custom authorization signature parameters |
| getExternalAuthButtonEnabled | Check if the external authorization login button is enabled |
| allowToVerifyExternalAuth | Allow verification of external authorization |
| verifyExternalAuth | Verify external authorization signature parameters |
| getExternalAuthFailUrl | Get the URL for external authorization failure |
| redirectExternalAuthFailUrl | Redirect to the external authorization failure URL |
| allowAutoRedirectExternalAuthFailUrl | Allow automatic redirect to the external authorization failure page |
| allowToVerifyDirectAuth | Allow verification of direct authorization |
| verifyDirectAuth | Verify direct authorization signature parameters |
| getDirectAuthFailUrl | Get the URL for direct authorization failure |
| redirectDirectAuthFailUrl | Redirect to the direct authorization failure URL |
| allowAutoRedirectDirectAuthFailUrl | Allow automatic redirect to the direct authorization failure page |
| getInviteWatchAuthAuditStatus | Get the audit status for invitation watch authorization |
| allowInviteWatchAuth | Check if invitation watch authorization verification is allowed |
| verifyInviteWatchAuth | Verify invitation watch authorization |
| getInviteWatchAuthInfo | Get invitation watch authorization information |
