Cloudflare Workers를 사용하여 5분 이내에 첫 번째 서버 기능 없음 배포

최초로 제 블로그 harrisgeo.me에 발표를 했습니다.

AYLİN GÖRAL촬영
서버가 없는 것은 개발 분야의 핫이슈인데, 특히 최근 몇 년 동안은 그렇다.말 그대로 서버가 없는 것은 단점(함수)을 배치하는 방법으로 그들이 실행하는 서버나 하드웨어를 처리할 필요가 없다.
서버를 걱정할 필요가 없다. 이것은 우리로 하여금 기능을 실행하는 시간에만 비용을 지불하는 진정한 원가 효율적인 모델이 되게 한다.만약 저희 API가 매달 30시간만 운행한다면, 저희는 서버가 유휴 시간인 매달 24시간 대신 이 30시간만 비용을 지불할 것입니다.
비용 효과 외에 Serverless는 자동 축소 모델을 통해 피크 유량에 쉽게 대응할 수 있다.이것이 바로 우리가 가능한 한 빨리 서버가 없는 것을 사용하기 시작한 좋은 이유이다.

Cloudflare 직원 등록

너는 https://workers.cloudflare.com/에 가서 신청할 수 있다.그들의 아낌없는 무료 층은 매일 우리에게 100,000번의 읽기 조작을 제공한다!!!나는 너의 상황을 모르겠지만, 나에게 있어서 이 숫자는 나의 아르바이트 프로젝트에 있어서 이미 충분하다.
내 말은 네가 그들의 비용 지불 계획을 사용하고 싶다고 해도 매달 $5개의 요청이 1,000,000개가 필요하다는 것이다.너에게 적합한 계획을 선택한 후에 우리는 코드를 좀 쓸 것이다.

CLI 도구 설치

이제 CLI 툴을 설치하는 것이 우선인 계정이 생겼습니다.이 예에서는 JS 클라이언트를 사용합니다.전 세계에 wrangler을 설치하겠습니다.

npm install -g @cloudflare/wrangler

현재 우리는 이미 wrangler을 설치했는데, 우리는 그것이 우리에게 우리가 그것을 사용할 수 있는 많은 일을 제공해 준 것을 볼 수 있다.이제 우리 계정에 로그인합시다.

wrangler login
Allow Wrangler to open a page in your browser? [y/n]

y을 입력하면 브라우저에서 창이 열립니다.

일단 wrangler에 우리의 기능을 관리하도록 권한을 부여하면 waiting for API token... 메시지는 우리의 CLI에서 사라질 것입니다.그리고 다음 메시지는 우리가 성공적으로 로그인했음을 확인할 것입니다.

wrangler whoami

+--------------------------------+-----------------------------------+
| Account Name                   | Account ID                        |
+--------------------------------+-----------------------------------+
| [email protected]'s Account | do_not_share_this_key_with_anyone |
+--------------------------------+-----------------------------------+

만약 나처럼, 네가 업무 중에 문제에 부딪히면, 다른 방법은 수동으로 조작하는 것이다.https://dash.cloudflare.com/profile/api-tokens으로 이동하여 글로벌 API 키를 확인합니다.일단 우리가 비밀번호를 입력하고 인증코드를 통과하면api 키를 복사할 수 있습니다.그리고 wrangler에 그것을 설정합니다.

wrangler config --api-key
We don't recommend using your Global API Key!
Please consider using an API Token instead.

https://support.cloudflare.com/hc/en-us/articles/200167836-Managing-API-Tokens-and-Keys
Enter Email:
[email protected]
Enter Global API Key:
do_not_share_this_key_with_anyone
💁  Validating credentials...
✨  Successfully configured. You can find your configuration file at: /Users/your_username/.wrangler/config/default.toml

만약 당신이 계속 문제에 부딪히면 그들이 추천한 링크 https://support.cloudflare.com/hc/en-us/articles/200167836-Managing-API-Tokens-and-Keys을 보십시오
우리의 wrangler whoami 명령은 현재 우리가 로그인한 것을 표시해야 한다.이제 새로운 프로젝트를 만들 때가 되었다.Cloudflare Workers 문서에서 사용할 수 있는 항목이 많은 starters page을 볼 수 있습니다.이 블로그에 대해 나는 사용자가 Github에 가지고 있는 저장소의 수를 인쇄하는 데 매우 간단한 함수를 만들 것이다.

wrangler generate username_github_repos

이제 멋진 일을 할 때가 됐어!🎉

JS 코드

현재 프로젝트가 생성되었습니다. 우리가 가장 좋아하는 텍스트 편집기 (내 예는 VScode) 로 열고 코드를 봅시다.색인 파일에는 다음 내용이 포함됩니다.

/**
 * Respond with "Username x has y repos" text
 * @param {Request} request
 */
async function handleRequest(request) {
  try {
    let username = 'harrisgeo88'

    // splits the url from the query string
    const querystring = request.url.split('?')[1]

    if (querystring) {
      // we split the query string into an array
      const params = querystring.split('&')

      // we search for username
      const userParam = params.find(y => y.includes('username'))

      // if username exists then use it. Otherwise use the default
      if (userParam) {
        username = userParam.split('=')[1]
      }
    }

    const response = await fetch(`https://api.github.com/users/${username}/repos?per_page=100`, {
      headers: {
        'User-Agent': 'request'
      }
    })

    const allRepos = await response.json()
    const length = allRepos.length

    let repos = ''
    if (length > 99) {
      repos = 'more than 100'
    } else if (!length) {
      repos = '0'
    } else {
      repos = `${length}`
    }

    return new Response(`Username ${username} has ${repos} repos`, {
      headers: { 'content-type': 'text/plain' },
    })
  } catch (err) {
    console.log(err)
  }
}

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

간단하게 보기 위해서 나는 어떠한 제3자 라이브러리도 사용하지 않았다.따라서 검색 문자열params 부분은 수동으로 완성됩니다.qs과 같은 도서관은 이 일을 더욱 쉽게 할 수 있다.
이 코드의 역할은 우리가 전달한 username 조회 파라미터를 가져와 이 사용자에게 리포를 가져오는 것입니다.Github API는 페이지당 최대 100개의 결과만 표시할 수 있습니다.사용자 이름에 100개 이상의 결과가 있는 경우 페이지는 Username x has more than 100 repos으로 인쇄됩니다.
만약 우리가 어떤 조회 매개 변수를 전달하지 않는다면, 이것은 기본적으로 나의 사용자 이름 harrisgeo88이 될 것이다.이api는 공공 환매 프로토콜만 되돌려준다는 것을 기억하십시오.만약 네가 나처럼 곤혹스러움을 느낀다면, 왜 내가 로그인했을 때, 이 숫자들이 내 개인 자료의 숫자와 일치하지 않는지 생각하기 시작하는 것은 바로 이것 때문이다😂
현재 우리의 함수는 이미 준비가 다 되었으니, 로컬에서 그것을 운행하고, 우리의 코드가 운행하고 있는지 봅시다.

로컬에서 실행

wrangler 명령은 이 작업을 완료하고 로컬에서 서버를 실행합니다.

wrangler dev

이 프로젝트를 처음 실행하는 경우 CLI에서 다음 오류가 발생합니다.Error: field account_id is required to deploy to workers.dev . 고맙게도 이것은 정말 해결하기 쉽다.편집기를 열면 wrangler.toml이라는 파일을 볼 수 있습니다.이것은 설정 파일입니다. 이렇게 보입니다

name = "username_github_repos"
type = "javascript"
account_id = ""
workers_dev = true
route = ""
zone_id = ""

전에 저희가 wrangler whoami을 운행했을 때 기억나세요?인쇄된 Account ID 필드를 다시 한 번 복사해 보겠습니다.이것이 바로 우리가 account_id 파일에 붙여야 할 wrangler.toml의 내용이다.완료되면 파일을 저장하고 wrangler dev을 다시 실행하면 다음과 같은 내용을 볼 수 있습니다.

wrangler dev
💁  watching "./"
👂  Listening on http://127.0.0.1:8787

이 URL을 누르면 브라우저를 열고 사용자 이름과 환매 수량을 표시합니다.이것은 기본 상태입니다.?username=johnsmith에서 존 스미스를 사용자 이름으로 바꿉니다.http://127.0.0.1:8787/?username=johnsmith을 드리겠습니다.
경탄할 만한!이제 이 기능을 배치합시다.

우리의 기능 배포

목마인들은 다시 우리를 위해 이렇게 할 것이다.

wrangler publish

다음 내용을 보실 수 있기를 바랍니다.

wrangler publish
✨  JavaScript project found. Skipping unnecessary build!
✨  Successfully published your script to
 https://username_github_repos.harrisgeo.workers.dev

아, 이렇게.제 https://username_github_repos.harrisgeo.workers.dev을 여기서 보실 수 있어요.

네, 그렇습니다!

축하해!!!클라우드 중앙에 첫 번째 Cloudflare Worker 함수를 배치했습니다.나는 그들이 이렇게 간단하게 시작하는 것을 정말 좋아한다.이것은 완전히 무료이고 간단하며 통상적으로 좋은 방식으로 클라우드에 더 많은 보조 프로젝트를 발표할 수 있으며, 계약, 서버 등 이런 문제들을 걱정할 필요가 없다.
블로그 게시물의 코드는 here을 찾을 수 있습니다.
Cloudflare 직원과 함께 구축할 프로젝트는 무엇입니까?
이 게시물이 마음에 드시면 알림을 받고 싶을 때 새로 나오세요.