사전 반품

진행하기 전에 다음이 제자리에 있는지 확인하십시오.

1. Direct Line Secret :

2. 원시 개발 환경에 반응 : 작동하는 React Native Project를 설정합니다.

3. Axios 라이브러리 설치 : NPM 설치 Axios 또는 원사 추가 Axios를 사용하여 프로젝트 종속성에 Axios 추가.

4. WebSocket 지원 : WebSocket API가 응용 프로그램 환경과 호환되도록합니다.

5. 기본 지식 : JavaScript, React Native 및 Restful API에 대한 친숙 함.

목차

1. 토큰 생성

2. 토큰을 새로 고칩니다

3. 대화 시작

4. 대화를 다시 연결

5. 봇에 활동을 보내는

6. 봇에서 활동받는 활동

7. 대화 끝

8. 연결 상태 모니터링 및 재 연결

9. 참조

10. 1. 인증

Direct Line API는 인증하기 위해 비밀이 필요합니다. Azure Bot Service Portal에서 비밀을 얻으십시오.

2. 토큰 생성

토큰은 안전한 의사 소통을 시작하기 위해 비밀을 사용하여 생성됩니다.

코드 예 :

'axios'에서 axios 가져 오기; const generateToken = async (Secret) => { const url = 'https://directline.botframework.com/v3/directline/tokens/generate'; 노력하다 { const response = await axios.post (url, {}, { 헤더 : { 승인 :`Bearer $ {Secret}`, }, }); return response.data.token; } catch (오류) { console.error ( '오류 생성 토큰 :', 오류); 던지기 오류; } };
3. 토큰을 상쾌하게합니다

import axios from 'axios';

const generateToken = async (secret) => {
    const url = 'https://directline.botframework.com/v3/directline/tokens/generate';
    try {
        const response = await axios.post(url, {}, {
            headers: {
                Authorization: `Bearer ${secret}`,
            },
        });
        return response.data.token;
    } catch (error) {
        console.error('Error generating token:', error);
        throw error;
    }
};

코드 예 :

const RefreshToken = async (토큰) => { const url = 'https://directline.botframework.com/v3/directline/tokens/refresh'; 노력하다 { const response = await axios.post (url, {}, { 헤더 : { 승인 :`Bearer $ {Token}`, }, }); return response.data.token; } catch (오류) { Console.error ( '오류 새로 고침 토큰 :', 오류); 던지기 오류; } };
4. 대화 시작

const refreshToken = async (token) => {
    const url = 'https://directline.botframework.com/v3/directline/tokens/refresh';
    try {
        const response = await axios.post(url, {}, {
            headers: {
                Authorization: `Bearer ${token}`,
            },
        });
        return response.data.token;
    } catch (error) {
        console.error('Error refreshing token:', error);
        throw error;
    }
};

코드 예 :

const startConversation = async (Token) => { const url = 'https://directline.botframework.com/v3/directline/conversations'; 노력하다 { const response = await axios.post (url, {}, { 헤더 : { 승인 :`Bearer $ {Token}`, }, }); 반환 응답 .Data; } catch (오류) { Console.error ( '오류 시작 대화 :', 오류); 던지기 오류; } };
5. 대화를 다시 연결합니다

const startConversation = async (token) => {
    const url = 'https://directline.botframework.com/v3/directline/conversations';
    try {
        const response = await axios.post(url, {}, {
            headers: {
                Authorization: `Bearer ${token}`,
            },
        });
        return response.data;
    } catch (error) {
        console.error('Error starting conversation:', error);
        throw error;
    }
};

코드 예 :

const reconnectConversation = async (confertionId, token) => { const url =`https://directline.botframework.com/v3/directline/conversations/$ {convermitid}? watermark = 0`; 노력하다 { const response = await axios.get (url, { 헤더 : { 승인 :`Bearer $ {Token}`, }, }); 반환 응답 .Data; } catch (오류) { console.error ( '오류 재 연결 대화 :', 오류); 던지기 오류; } };
6. 봇에 활동을 보내기

const reconnectConversation = async (conversationId, token) => {
    const url = `https://directline.botframework.com/v3/directline/conversations/${conversationId}?watermark=0`;
    try {
        const response = await axios.get(url, {
            headers: {
                Authorization: `Bearer ${token}`,
            },
        });
        return response.data;
    } catch (error) {
        console.error('Error reconnecting conversation:', error);
        throw error;
    }
};

코드 예 :

const sendActivity = async (conversatiD, 토큰, 활동) => { const url =`https://directline.botframework.com/v3/directline/conversations/$ {ConfertentId}/activity`; 노력하다 { const response = await axios.post (url, activity, { 헤더 : { 승인 :`Bearer $ {Token}`, }, }); 반환 응답 .Data; } catch (오류) { Console.error ( '오류 전송 활동 :', 오류); 던지기 오류; } };
7. 봇으로부터 활동 받기

const sendActivity = async (conversationId, token, activity) => {
    const url = `https://directline.botframework.com/v3/directline/conversations/${conversationId}/activities`;
    try {
        const response = await axios.post(url, activity, {
            headers: {
                Authorization: `Bearer ${token}`,
            },
        });
        return response.data;
    } catch (error) {
        console.error('Error sending activity:', error);
        throw error;
    }
};

코드 예 :

const connectwebsocket = (streamurl, onmessage) => { const 소켓 = 새로운 WebSocket (streamUrl); socket.onopen = () => { Console.Log ( 'WebSocket Connection.'); }; socket.onmessage = (이벤트) => { const data = json.parse (event.data); Console.log ( '메시지 수신 :', 데이터); OnMessage (data.activities); }; socket.onerror = (오류) => { Console.error ( 'WebSocket Error :', 오류); }; socket.onclose = (이벤트) => { Console.warn ( 'WebSocket Connection 닫혀 :', 이벤트); }; 리턴 소켓; };
8. 대화 종료

const connectWebSocket = (streamUrl, onMessage) => {
    const socket = new WebSocket(streamUrl);

    socket.onopen = () => {
        console.log('WebSocket connection established.');
    };

    socket.onmessage = (event) => {
        const data = JSON.parse(event.data);
        console.log('Message received:', data);
        onMessage(data.activities);
    };

    socket.onerror = (error) => {
        console.error('WebSocket error:', error);
    };

    socket.onclose = (event) => {
        console.warn('WebSocket connection closed:', event);
    };

    return socket;
};

9. 연결 상태 모니터링 및 재 연결

WebSocket 상태를 모니터링하고 연결이 끊어지면 폴링으로의 폴백.

코드 예 :

const monitorconnection = (소켓, 폴백 트토 폴링) => { socket.onclose = () => { Console.warn ( 'WebSocket Connection이 닫혔습니다. 폴링으로 돌아 가기'); FallbackTopolling (); }; }; const pollforactivities = async (confertionId, token) => { const url =`https://directline.botframework.com/v3/directline/conversations/$ {ConfertentId}/activity`; 노력하다 { const response = await axios.get (url, { 헤더 : { 승인 :`Bearer $ {Token}`, }, }); return response.data.activities; } catch (오류) { Console.error ( '활동에 대한 오류 폴링 :', 오류); 던지기 오류; } };
10. 참조

const monitorConnection = (socket, fallbackToPolling) => {
    socket.onclose = () => {
        console.warn('WebSocket connection closed. Falling back to polling.');
        fallbackToPolling();
    };
};

const pollForActivities = async (conversationId, token) => {
    const url = `https://directline.botframework.com/v3/directline/conversations/${conversationId}/activities`;
    try {
        const response = await axios.get(url, {
            headers: {
                Authorization: `Bearer ${token}`,
            },
        });
        return response.data.activities;
    } catch (error) {
        console.error('Error polling for activities:', error);
        throw error;
    }
};

WebSocket API

axios 문서
기본 문서 반응
• 결론
• 이 문서는 Direct Line API를 Axios 및 WebSocket을 사용하여 React Native 응용 프로그램에 통합하기위한 완전한 안내서를 제공합니다. Copilot Agent Bot을 사용하여 설명 된 단계를 따르고 대화를 관리하고 대화를 관리하며 커뮤니케이션을 안정적으로 처리하십시오.