매일 노드를 배치하다.즉시 js 백엔드 서버

만약 당신이 우리를 계속 지켜보고 있다면, 바울이 그의 게시물에서 구축에 관한 것을 알아차렸을 것이다.
"실제 운영 코드에서는 클라이언트 JavaScript에 API 키를 저장하지 않도록 백엔드 서버에서 일일 REST API를 호출하여 채팅방을 만들고자 합니다."
미래에 우리는 서버 사이드 코드를 어떻게 실현하는지 상세하게 소개할 것이지만, 현재 우리는 당신에게 가능한 한 빨리 시작하고 실행할 수 있도록 구축 블록을 제공하기를 원합니다.

뭐 공부 해요?


우리는 Node.js에 실시간 Glitch 서버를 설치할 것이다.Glitch는 아이디어를 얻기 위해 처음부터 프로젝트를 만들거나 다른 프로젝트를 혼합할 수 있는 우호적인 개발 도구입니다.모든 프로젝트는 진정한 서버를 지원하기 때문에 시작과 확장에 필요한 모든 것을 가지고 있습니다.

뭐 공부 해요?


  • 일일 계정 및 API 키: Sign up, 아직 없으면.

  • 장애 계정: 시간이 지남에 따라 서버를 조정할 계획이라면 signing up for Glitch을 강력히 권장합니다.단, 당신은 여전히 계정을 만들지 않은 상황에서 본 강좌를 배울 수 있습니다!
  • 시작하다


    아래의 Remix button을 클릭합니다.

    이제 매일 API를 통해 데이터를 반환하는 공용 API 노드를 포함한 서버의 편집 가능한 사본을 보유해야 합니다.웹 기반 개발 환경도 편리할 것입니다.

    키 추가


    매일 API 키를 추가하면 개발자 부분의 dashboard에서 이 키를 얻을 수 있습니다.
    클립보드에 복사하여 엽니다.고장 편집기의 env 파일입니다.여기에 붙여넣기 (변수 값 대체):

    언제든지 서비스 제공


    서버 코드(server.js)를 보고 예시 요청을 보냅니다.
    먼저 로그 보기 (도구 > 로그, 왼쪽 아래에 있음) 를 열면 다음과 같이 표시됩니다.💗🌴 Your app is listening on port 3000이것은 express 서버가 실행 중이며 전송 요청 [0]을 정탐하고 있음을 의미합니다.
    코드를 보면 세 부분을 볼 수 있습니다.
    첫 번째 절에서 우리는 의존항을 가져오고 유용한 상수를 제거하며 axios 실례를 설정하여 매일 API를 인용합니다.
    const express = require("express");
    const axios = require("axios");
    const app = express();
    app.use(express.json());
    
    // MAKE SURE YOU HAVE ADDED YOUR API KEY IN THE .env file
    const BASE_URL = "https://api.daily.co/v1/";
    const API_AUTH = process.env.DAILY_API_KEY;
    
    // create an axios instance that includes the BASE_URL and your auth token
    // this may be useful to put in an external file to it can be referenced
    // elsewhere once your application grows
    const api = axios.create({
      baseURL: BASE_URL,
      timeout: 5000,
      headers: { Authorization: `Bearer ${API_AUTH}` }
    
    다음은 우리가 서버에 만든 모든 단점입니다.그것들은 본질적으로 모두 느슨한 포장기로서 일상 API에서 그 등가물을 호출한다.첫 번째 예:
    app.get("/rooms", async (request, response) => {
      try {
        const rooms = await apiHelper("get", "/rooms");
        response.json(rooms);
      } catch (e) {
        console.log("error: ", e);
        response.status(500).json({ error: e.message });
      }
    });
    
    여기서 우리가 말하고자 하는 것은 요청이 /rooms에 전송될 때, 우리는 이 async을 실행하기를 희망한다. 이것은 우리가 아래에 정의한 apiHelper을 사용하여 매일 API에 요청을 보내는 것이다.요청이 성공하면 요청자 (json) 에게 응답합니다.실패하면 http 500 오류를 반환하고 오류 메시지를 첨부합니다.
    마지막으로 apiHelper 함수를 살펴보겠습니다.
    const apiHelper = async (method, endpoint, body = {}) => {
      try {
        const response = await api.request({
          url: endpoint,
          method: method,
          data: body
        });
        return response.data;
      } catch (error) {
        console.log("Status: ", error.response.status);
        console.log("Text: ", error.response.statusText);
        // need to throw again so error is caught
        // a possible improvement here is to pass the status code back so it can be returned to the user
        throw new Error(error);
      }
    };
    
    여기서 목표는 매일 API를 호출하는 재사용 가능한 방법이 있습니다.다음과 같은 매개변수를 사용합니다.
  • 방법: http request 방법
  • 노드: 일일 API 노드
  • 본문: 선택 요청 본문, POST, PUT 등 필요.
  • 우리는 위에서 정의한axios 실례에서 나온 요청 방법을 사용하기 때문에 모든 요청에 BASE\u URL과 권한 수여 헤더를 지정하는 것을 걱정할 필요가 없습니다.우리는 여기에 기본적인 오류 처리를 포함하지만, 필요에 따라 수정할 수 있다[1].

    샘플 요청


    장애 미리 보기를 켜고 (코드 옆에 있는 표시 -> 클릭) 모든 기능이 제대로 작동하는지 확인합니다.다음 URL 변경을 클릭하고 [/rooms](https://docs.daily.co/reference#list-rooms)을 추가합니다.계정에 있는 방 목록인 json을 보실 수 있습니다.
    서버는 다음 URL을 통해 공개적으로 접근할 수 있습니다.https://YOUR-PROJECT-NAME.glitch.me

    다음은 뭐예요?


    이제 API 키를 보호하는 일상 API를 호출할 수 있는 기능성 서버가 생겼습니다.참고로 일부 끝점을 추가했지만 다음 단계로 추가할 수 있는 다른 끝점이 많습니다(예: /recordings).
    이 서버는 또한 이 요청을 은밀하게 신뢰하는 클라이언트를 보냅니다.다음 단계는 클라이언트에 인증을 추가하고 서버에서 검사하는 것이 좋습니다.예를 들어,'is\u owner'권한이 있는 영패만 생성하는 것을 원하지 않습니다.
    마지막으로, 비록 이것은 완전히 실행 가능한 개발 서버로서, 당신은 작은 고장난 구성원이 되고 이 응용 프로그램을 추진하는 것을 고려하고 싶을 수도 있습니다.이것은 너에게 benefits을 주었는데, 가장 중요한 것은 그것이 항상 맑다는 것이다.Glitch와 그들이 하는 모든 훌륭한 업무에서 팀을 지원할 것이다.
    [0] 나는 expressaxios을 소홀히 했다.만약 그 중 어느 것이 익숙하지 않다면, 먼저 그들의 문서를 읽어 주십시오.고위층에서, 우리는 express로 전송된 요청을 처리하고 응답하며, axios를 사용하여 외부 일상 API에 요청을 보냅니다.
    [1] 우리는 async/await를 사용하여 약속의 처리를 간소화한다.익숙하지 않으면 MDN으로 전화를 걸어 문서를 보십시오.

    좋은 웹페이지 즐겨찾기