JavaScript, Cloudflare Workers 및 Telegram 로봇의 간이 링크 단축기

짧은 링크를 빨리 만들어야 한다면 어떻게 합니까?그럼요. - 링크 단축기를 사용합니다.너도 이 링크를 읽을 수 있게 한다면?아직도 당신의 도메인을 사용하고 있습니까?추가 서버를 사용하지 않는 것이 좋습니다.답이 하나 있는 것 같다.

배경.

정보​​내가 방향을 바꾸는 옵션을 찾았을 때, 나는 '간이 링크 축소기' 를 생각했다. 이 옵션은 신형 클럽 회소의 소셜네트워크서비스 중 한 방에 사용되는 도메인 이름을 사용했다.방 호출 이동 이념의 본질은 같은 이름의 방을 다시 시작하는 것이지만 시종일관 온라인이다.이 링크를 하위 영역에 멈춰서 방 주소를 계속 바꾸는 문제를 해결할 필요가 있습니다.
이 장소는 클라우드 플래어에 미리 재배된 것이기 때문에 해결 방안은 자체적으로 제시된다.처음에 나는 '페이지 규칙' 기능을 사용했다. 이것은 당신이 리셋 규칙을 설정할 수 있도록 해 주었지만, 곧 이러한 리셋을 더욱 유연하고 변화무쌍하게 하고 서비스 설정에 들어가지 않아도 된다는 것을 생각했다.물론 전보 로봇은 이런 해결 방안이다.

문제의 서술

우리의 계획을 완성하기 위해서는 몇 가지 문제를 해결해야 한다.

어떻게 특정 하위 영역에서 방향을 바꿉니까?

버튼(경로) - 값(전송 주소)이 링크를 저장하는 위치는?

어떻게 이런 경로를 만듭니까?

네가 이미 짐작한 바와 같이, 이 문제들의 답안은 바로 이 문장의 제목 안에 있다.그래서 실제 부분으로 들어가자고 제안했다.

전제 조건

자세한 내용은 프로젝트를 구현하는 데 필요한 기본 조건에 대해 설명합니다.

Cloudflare에 연결된 도메인;

자바스크립트의 일반 지식;

에 만들어진 전보 로봇;

및 Cloudflare Workers 파일

필요한 선결 조건을 어떻게 만족시킬 것인가는 본문에서 토론하지 않는다.이 문제들의 해결 방안은 여전히 독자의 수중에 있다.

텔레그래프 로봇 API 부팅

모든 선결 조건이 충족된 것 같다. "또 어떤 준비가 있습니까?"구현을 위한 몇 가지 준비를 제안합니다.

1. 스토리지 생성 - 도와주실 거예요.

Cloudflare KV는 근로자의 핵심 가치 데이터베이스입니다.이해한 바와 같이 두 번째 문제는 클라우드 플레이어 자체의 힘으로 해결된다.
순서는 간단합니다:Workers 페이지에서 KV 옵션 카드로 이동해서 필요한 저장 이름을 입력하고dd를 누르십시오.
Cloudflare KV
결과적으로 우리는 심지어 우리의 저장소에 무엇이 있는지도 볼 수 있다.이상하게도 아무것도 없지만, 우리는 여기에 필요한 줄임말을 직접 불러올 수 있다.이렇게 해야만 그것들을 사용하기 시작할 수 있습니다. 예를 들어, 먼저 방향을 바꾸는 것을 테스트할 수 있습니다.

2. 우리는 자신의 워커를 만들고 그것을 구성한다.

이를 위해, "작업 프로그램 만들기"단추를 사용하여 편집기에 새 작업 프로그램 ("저장 및 배치") 을 저장하고 배치한 다음 메뉴로 돌아가십시오.

즉시 건전한 명칭을 설정하고'설정'으로 전환하여 우리의 전보 로봇의 영패와 귀속 저장을 기록합니다.

3. 스크립트에 하위 도메인 바인딩

필요한 주소를 호출하기 위해서, 제 예에서는 URL입니다.내 도메인 이름입니다.com, 사용자를 미래의 '서비스 단축기' 로 안내하고, 하위 영역의 연결을 설정할 것입니다.

즉, 우리 영역의'Workers'페이지에서 미래의 shortener 서비스에 우리의'Route'를 추가해야 한다는 것이다.

링크 끝에 있는 별표는 우리의 영역 (경로) 뒤에 있는 모든 값이 줄임말로 연결된다는 것을 보여 줍니다.
이것은 모든 것을 한층 더 일하게 하는 중요한 방면이다.
따라서 모든 요청이 DNS 검사를 통과하도록 DNS에 레코드를 작성합니다.

완성!우리는 인코딩을 시작할 수 있다.

구현

우리 직접 실현부터 시작합시다.추가 작업은 Cloudlfare에서 제공하는 코드 편집기에서 수행됩니다.새 일꾼을 초기화하기 전에 우리는 이미 그것을 보았다.프로젝트 페이지의 '빠른 편집' 단추를 사용해서 그곳으로 돌아갑니다.

Dell 서비스는 다음 두 부분으로 구성됩니다.

호출 전송

새로운 절단 기록

리디렉션을 위해 데이터베이스에서 값을 가져오는 함수를 작성하고 입력한 경로(URL 경로)를 찾으면 리디렉션을 만듭니다.그렇지 않으면, 우리는 404 오류를 낼 것이다.

addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

/**
 * Respond to the request
 * @param {Request} request
 */
async function handleRequest(request) {
  const requestUrl = new URL(request.url);
  const path = requestUrl.pathname.substring(1); // Let's delete "/" symbol
  return await redirect(path)
}

/**
 * Make redirect
 * @param {string} shortName
 */
async function redirect(shortName) {
  // Get value of address that has been requested by short link
  const url = await db.get(shortName);
  if (url) {
    return Response.redirect(url)
  }
  // Short link not found
  return new Response(null, {status: 404})
}

여기에서 편집기의 오른쪽 부분에서 아직 배치되지 않은 코드를 디버깅할 수 있습니다. 우리는 리셋을 검사합니다.

이제 두 번째 부분을 실시합시다.이곳에서 임무는 더욱 무거울 것이다.우선, 우리는 텔레그램이 우리가 지정한 URL을 통해 우리의 문을 두드리는 것을 확정할 것이다.다음에 다른 사람이 bot에 접근할 수 없도록 bot에 기록했는지 확인하십시오. 전보 사용자 ID를 상수로 기록할 것입니다.다음 단계는 보내는 메시지에서 짧은 경로와 링크를 가져와 데이터베이스에 다시 쓰는 것입니다.마지막으로, 우리는 웹훅스를 통해 우리의 로봇을 연결할 것이다.

addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

const ADMIN = 11111111; // Our Telegram User ID

/**
 * Respond to the request
 * @param {Request} request
 */
async function handleRequest(request) {
  const requestUrl = new URL(request.url);
  const path = requestUrl.pathname.substring(1);
  // Added bot token check
  if (path == BOT_TOKEN) {
    return await bot(await request.json())
  }

  return await redirect(path)
}

/**
 * Make redirect
 * @param {string} shortName
 */
async function redirect(shortName) {
  const url = await db.get(shortName);
  if (url) {
    return Response.redirect(url)
  }
  return new Response(null, {status: 404})
}

/**
 * Create new shorten URL
 * @param {Object} update
 */
async function bot(update) {
  // Skip message from not admin users
  if (update.message.from.id != ADMIN) {
    return new Response("OK", {status: 200})
  }
  // Split message eg "shortname url"
  const [shortName, url] = update.message.text.split(" ");
  // Let's remember short link
  await db.put(shortName, url);
  const response = {
    "method": "sendMessage",
    "text": `Now ${url} are available by url.mydomain.com/${shortName}`,
    "chat_id": update.message.from.id
  }

  return new Response(
    JSON.stringify(response), 
    {
      status: 200,
      headers: new Headers({"Content-Type": "application/json"})
    }
  )
}

여기서 디버깅 중에 우리는 코드를 검사하는 작업을 한다.

데이터베이스를 보고 모든 내용이 기록되었는지 확인합니다. (우리는 즉시 테스트 값에서 저장을 지울 수 있습니다.)

나머지는 우리 페이지에 텔레그램 로봇 웹훅을 추가하는 것이다.우리는 이미 모든 것을 준비했기 때문에 형식 링크를 사용할 것이다. https://api.telegram.org/bot[BOT_TOKEN]/setWebhook?url=url.domain.com/[BOT_TOKEN]전보 API 응답:

{"ok":true,"result":true,"description":"Webhook was set"}

우리는 로봇의 작업 결과를 검사했다.우리는 그에게 간단한 이름과 링크를 보냈고 코드의 설정에 따라 링크 검사 기능을 시도했다.

"그는 아직 살아있어!"
결론
따라서 간단명료하고 실현하기 쉬운 링크 단축기가 있어 스스로 수정할 수 있다.
주의해야 할 것은 이런 방법은 약간의 한계가 있어 에서 찾을 수 있다.요컨대

데이터베이스에 최대 1000개의 값을 쓸 수 있음​​매일 (줄임말을 만들 수 있는 최대 수량);

매일 데이터베이스에서 최대 100000회(최대 방문 횟수)를 읽는다.

스크립트 자체는 매일 최대 100000회(bot에 보내는 메시지 수와 방문 단축 링크 횟수)를 실행할 수 있다.

스크립트는 분당 1000회 이상 실행될 수 없습니다.

이러한 제한은 개인의 사용에 충분할 것이다. 평론에서 당신의 의견을 공유해라.