[ PROMPT_NODE_24388 ]
实现模式
[ SKILL_DOCUMENTATION ]
# TURN 实现模式
在 WebRTC 应用程序中实现 Cloudflare TURN 的生产级模式。
## 前置条件
在实现这些模式之前,请确保:
- 已创建 TURN 密钥:参考 [api.md#create-turn-key](./api.md#create-turn-key)
- 已配置 Worker:参考 [configuration.md#cloudflare-worker-integration](./configuration.md#cloudflare-worker-integration)
## 基础 TURN 配置(浏览器)
typescript
interface RTCIceServer {
urls: string | string[];
username?: string;
credential?: string;
credentialType?: "password" | "oauth";
}
async function getTURNConfig(): Promise {
const response = await fetch('/api/turn-credentials');
const data = await response.json();
return [
{
urls: 'stun:stun.cloudflare.com:3478'
},
{
urls: [
'turn:turn.cloudflare.com:3478?transport=udp',
'turn:turn.cloudflare.com:3478?transport=tcp',
'turns:turn.cloudflare.com:5349?transport=tcp',
'turns:turn.cloudflare.com:443?transport=tcp'
],
username: data.username,
credential: data.credential,
credentialType: 'password'
}
];
}
// 在 RTCPeerConnection 中使用
const iceServers = await getTURNConfig();
const peerConnection = new RTCPeerConnection({ iceServers });
## 端口选择策略
浏览器客户端的推荐顺序:
1. **3478/udp** (首选,延迟最低)
2. **3478/tcp** (UDP 被阻断时的回退方案)
3. **5349/tls** (企业防火墙,最可靠)
4. **443/tls** (备用 TLS 端口,对防火墙友好)
**避免使用 53 端口**——会被 Chrome 和 Firefox 拦截。
typescript
function filterICEServersForBrowser(urls: string[]): string[] {
return urls
.filter(url => !url.includes(':53')) // 移除 53 端口
.sort((a, b) => {
// 优先 UDP,其次 TCP,最后 TLS
if (a.includes('transport=udp')) return -1;
if (b.includes('transport=udp')) return 1;
if (a.includes('transport=tcp') && !a.startsWith('turns:')) return -1;
if (b.includes('transport=tcp') && !b.startsWith('turns:')) return 1;
return 0;
});
}
## 凭据刷新(会话中)
当凭据在长通话期间过期时:
typescript
async function refreshTURNCredentials(pc: RTCPeerConnection): Promise {
const newCreds = await fetch('/turn-credentials').then(r => r.json());
const config = pc.getConfiguration();
config.iceServers = newCreds.iceServers;
pc.setConfiguration(config);
// 注意:setCon