RTC Engine
  • 개요
  • Web
    • Demo 실행
    • SDK 빠른 실행
    • 기본 기능
      • 화면 공유
      • 라이브 방송
      • 미디어 장치
      • 볼륨
      • 인코딩 구성 파일 설정
      • 네트워크 품질 검사
      • 검출 능력
    • 고급 기능
      • AI 노이즈 캔슬링 활성화
      • 오디오 믹싱 활성화
      • 워터마크 활성화
      • Enable Virtual Background
      • 뷰티 및 특수효과 활성화
      • 데이터 메시지
      • 사용자 정의 수집 및 렌더링
    • 인터페이스 목록
    • 배포 설명
    • 플랫폼 지원
    • Web 관련 자주 받는 질문
      • 다중 사용자 비디오 통화 최적화
      • 자동 재생 제한 처리
      • 방화벽 제한 대응
      • 기타
  • Android
    • Run Sample Code
    • Integration
    • 통합
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 비디오 품질 설정
      • 10. 비디오 회전
    • Advanced Features
      • 네트워크 품질 테스트
      • 사용자 정의 수집 및 렌더링
      • 사용자 정의 오디오 수집 및 재생
    • 고객 인터페이스
      • 개요
      • TRTCCloud
      • TRTCStatistics
      • TRTCCloudListener
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • 유형 정의
      • 인터페이스 폐기
      • 에러코드
    • 솔루션
      • 실시간 합창 (TUIKaraoke)
        • 빠른 통합
        • 실시 절차
        • 노래 동기화
        • 가사 동기화
        • 음성 동기화
        • 혼합 스트림 솔루션
        • TRTCKaraoke 관련 인터페이스
        • 자주 받는 질문들
    • 배포 설명
  • iOS
    • Run Sample Code
    • Integration
    • 통합
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 비디오 품질 설정
      • 10. 비디오 회전
    • Advanced Features
      • 네트워크 품질 테스트
      • 사용자 정의 수집 및 렌더링
      • 사용자 정의 오디오 수집 및 재생
    • 고객 인터페이스
      • 개요
      • TRTCCloud
      • TRTCCloudDelegate
      • TRTCStatistics
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • 유형 정의
      • 인터페이스 폐기
      • ErrorCode
    • 솔루션
      • 빠른 통합
      • 실시 절차
      • 노래 동기화
      • 가사 동기화
      • 음성 동기화
      • 혼합 스트림 솔루션
      • TRTCKaraoke 관련 인터페이스
      • 자주 받는 질문들
    • 배포 설명
  • macOS
    • Run Sample Code
    • Integration
    • 통합
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 컴퓨터 소리 공유
      • 10. 비디오 품질 설정
      • 11. 비디오 회전
    • Advanced Features
      • 하드웨어 장치 테스트
      • 네트워크 품질 테스트
      • 사용자 정의 수집 및 렌더링
      • 사용자 정의 오디오 수집 및 재생
    • 고객 인터페이스
      • 개요
      • TRTCCloud
      • TRTCCloudDelegate
      • TRTCStatistics
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • 유형 정의
      • 인터페이스 폐기
      • ErrorCode
      • 배포 설명
    • 배포 설명
  • Windows
    • Run Sample Code
    • Integration
    • 통합
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 비디오 품질 설정
      • 10. 비디오 회전
    • Advanced Features
      • 하드웨어 장치 테스트
      • 네트워크 품질 테스트
      • 사용자 정의 수집 및 렌더링
      • 사용자 정의 오디오 수집 및 재생
    • 고객 인터페이스
      • 개요
      • ITRTCCloud
      • ITRTCStatistics
      • TRTCCloudCallback
      • ITXAudioEffectManager
      • ITXDeviceManager
      • 유형 정의
      • 인터페이스 폐기
      • 에러코드
    • 배포 설명
  • Electron
    • 통합
      • 1. 인터페이스 예시
      • 2. SDK 가져오기
      • 3. 룸 들어가기
      • 4. 오디오/비디오 스트림 구독
      • 5. 오디오/비디오 스트림 배포
      • 6. 룸 퇴출
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 컴퓨터 소리 공유
      • 10. 비디오 품질 설정
      • 11. 비디오 회전
    • 고객 인터페이스
      • 개요
      • 에러코드
  • Flutter
    • 통합
      • 1. 인터페이스 예시
      • 2. SDK 가져오기
      • 3. 룸 들어가기
      • 4. 오디오/비디오 스트림 구독
      • 5. 오디오/비디오 스트림 배포
      • 6. 룸 퇴출
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 컴퓨터 소리 공유
      • 10. 비디오 품질 설정
      • 11. 비디오 회전
    • 고객 인터페이스
      • 개요
      • 에러코드
  • Unity
    • 통합
      • 1. 인터페이스 예시
      • 2. SDK 가져오기
    • 고객 인터페이스
      • 개요
      • 에러코드
  • QT
    • 통합
      • 1. SDK 가져오기
  • 개요
    • 개요
  • 개념
  • Features
  • 성능 통계
  • 가격
    • 무료시간
    • RTC-Engine 패키지
    • 구독 패키지 기간 과금 설명
    • 종량제
      • 오디오 및 비디오 시간 과금 설명
      • 클라우드 녹화 과금 설명
      • 믹스 트랜스코딩 및 CDN 중계 과금 설명
  • 자주 받는 질문들
    • 자주 받는 질문들
    • 마이그레이션 가이드
      • Twilio Video에서 TRTC로의 마이그레이션
      • 과금
      • Features
      • UserSig
      • 방화벽 제한
      • 설치 패키지 축소 방법
      • TRTCCalling Web 관련
      • 오디오/비디오 품질
      • 기타
RTC Engine
이 페이지는 현재 영어로만 제공되며 한국어 버전은 곧 제공될 예정입니다. 기다려 주셔서 감사드립니다.

오디오 믹싱 활성화

This article will introduce how to add background music during a call.

Demo



Prerequisites

TRTC version 5.1+
The following platforms support adding background music during a call:
Operating System
Browser Type
Minimum Browser Version
Mac OS
Desktop Chrome
56+
Desktop Safari
11+
Desktop Firefox
56+
Desktop Edge
80+
Windows
Desktop Chrome
56+
Desktop QQ Browser
10.4+
Desktop Firefox
56+
Desktop Edge
80+
iOS
Mobile Safari
14+
WeChat Embedded Web
Android
Mobile Chrome
81+
WeChat Embedded Web
Mobile QQ Browser

Implementation Process

Start Background Music

When playing online sound effect files, the sound effect files must support CORS and the access protocol must be https.
Supported formats include MP3, AAC (and other audio formats supported by browsers).
Before any user interaction, browsers prohibit web pages from playing media with sound. It is recommended to guide users to perform a click action before calling this interface.
Reference: Autoplay_guide.
await trtc.startPlugin('AudioMixer', {
id: 'count',
url: '../assets/count.mp3',
loop: true,
volume: 0.2
})

Update Background Music

Perform operations on the background music.
// disable loop playback
await trtc.updatePlugin('AudioMixer', {
id: 'count',
loop: false
})
// volume setting
await trtc.updatePlugin('AudioMixer', {
id: 'count',
volume: 1
})
// pause music `count`
await trtc.updatePlugin('AudioMixer', {
id: 'count',
loop: true,
volume: 0.2,
operation: 'pause'
})
// resume music `count`
await trtc.updatePlugin('AudioMixer', {
id: 'count',
operation: 'resume'
})
// play `count` from 5s
await trtc.updatePlugin('AudioMixer', {
id: 'count',
seekFrom: 5
})

Stop Background Music

Stop a background music that is not needed.
await trtc.stopPlugin('AudioMixer', {
id: 'count'
})

API

trtc.startPlugin('AudioMixer', options)

Start background music.

options

Name
Type
Required
Description
id
string
Yes
Set a unique ID for each incoming music URL
url
string
Yes
Music file URL.

One of url and track must be passed in. If both are passed in, the url will be selected first.
track
MediaStreamAudioTrack
Yes
Music mediaStreamTrack.

One of url and track must be passed in. You can pass in a track extracted from the <audio/> tag. If both are passed in, the url will be selected first.
loop
boolean
No
Whether to loop play, default is false
volume
number
No
Set the initial volume, default is 1 (0-1)
await trtc.startPlugin('AudioMixer', {
id: 'count',
url: '../assets/count.mp3',
loop: true,
volume: 0.2
})

trtc.updatePlugin('AudioMixer', options)

Update background music.

options

Name
Type
Required
Description
id
string
Yes
The unique ID for each incoming music URL you set when call startPlugin
loop
boolean
No
Whether to loop play, default is false
volume
number
No
Set the initial volume, default is 1 (0-1)
seekFrom
number
No
Start seeking playback from which second, this parameter requires the music resource file to support HTTP range requests.
operation
number
No
Operation on the background music: 'pause' | 'resume' | 'stop'
Example:
await trtc.updatePlugin('AudioMixer', {
id: 'count',
loop: true,
volume: 0.2,
operation: 'pause'
})

trtc.stopPlugin('AudioMixer', options)

Stop a background music that is not needed.

options

Name
Type
Required
Description
id
string
Yes
The unique ID for each incoming music URL you set when call startPlugin
Example:
await trtc.stopPlugin('AudioMixer', {
id: 'count'
})

FAQs

1. Cross-Origin Error?
For example: Access to audio at XXX from origin XXX has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Solution: You need to configure the CORS protocol for your online music files.
2. Incorrect Audio Format, Unable to Play in Browser?
For example: NotSupportedError: The operation is not supported.
Solution: You need to use an audio format supported by the browser.