Custom Domain URL Shortener(AirTable ~ t.ly)

다들 아시겠지만 길고 긴 URL을 짧게 바꿔주는 다양한 서비스들이 있습니다.

(URL Shortener, T.LY, Bitly 등등)

이런 게 매우 유용하긴 한데,
만약 짧게 바꾼 URL을 내가 원하는 domain으로 만들고 싶다면
위 서비스들 중 무언가를 유료로 결제하고 사용해야 합니다.

예를 들면 https://www.gpters.org/c/nocode/ 라는 주소를 T.LY를 써서 줄이면,
“https://t.ly/KKmoX” 가 되는데, 내가 가진 도메인이 있으면
“http://내가 가진 도메인/~~”이렇게 만들 수 있는 거죠.

그런데 만약 이렇게 바꿔야 할 URL이 많다면?

매번 수동으로 바꾸긴 귀찮으니
AirTable과 t.ly를 이용해서 최대한 간단한
‘자동 URL Shortener’를 만들어서 공유드립니다.

(아래부터는 무언가 도메인을 갖고 계신 분들에게만 유용합니다.)

1. https://t.ly 회원 가입 및 유료 결제하기

• 가장 싼 요금제도 Custom Domain setting 기능을 제공합니다.

• 결제를 하고 나면 아래 메뉴에서 Custom Domain을 설정할 수 있습니다.

• 그리고 가장 중요한 왼쪽의 API 메뉴에서 API Key를 하나 생성한 뒤 어딘가에 복붙~

2. 자신의 Domain에 DNS record를 하나 추가하기

• 그 뒤엔 자신의 도메인을 관리하는 곳(Google, GoDaddy, AWS 등)에 DNS record를 추가해 줘야 합니다. (자세한 가이드는 이곳 에서)

• 여기부터 ‘DNS가 뭐야, 난 몰라. 안할래’라고 하실 분들도 계실 수 있는데 그냥 가이드대로 따라하시면 되니 그냥 한 번 해 보시길 추천 드립니다.

< 주의 사항 >
1. Custom Domain을 설정하실 때 자신이 가진 domain이 만약 AAA.com 이라면 이 도메인을 그대로 넣지 마시고, link.AAA.com 또는 url.AAA.com 처럼 Sub Domain을 추가한 형태로 설정하셔야, DNS 레코드를 수정해도 예상치 못한 일이 벌어지지 않을 수 있습니다.

3. AirTable 셋팅하기

• 저는 일단 최대한 간단하게 다음과 같이 구성했습니다.

• ID, 용도 는 단순 관리 및 기록용이고,

• LongURL은 원본 URL (URL Type)

• ShortURL은 t.ly가 바꿔준 짧은 URL(URL Type)

• Trigger는 Check하면 동작하게 만들기 위한 것

4. AirTable Automation 설정하기

• AirTable의 화면 상단에 보면 다음과 같은 “Automation” 메뉴가 있습니다.

• 클릭하시고, Zapier나 Make처럼 하나씩 설정해 나가면 됩니다.

• 최초 TRIGGER의 경우는 전 위와 같이 설정했습니다.

  • LongURL은 있고, ShortURL은 없으며, Trigger가 Checked가 되면 동작하도록

5. Script 추가

• Trigger를 설정하고 나면 다음 동작은 Script를 실행시켜서 t.ly의 API를 사용하도록 만드는 것입니다.

• 이 메뉴에서 “Run script“를 실행하시고 다음의 코드를 붙여 넣어서 사용하시면 됩니다.

let table = base.getTable('여긴 AirTable의 Table이름');
let view = table.getView('특정 View로 trigger가 동작하도록 제한하려면 여기에 view 이름을 넣으세요.');
let query = await view.selectRecordsAsync();
let updateRecords = [];

let tlyURL =  "https://t.ly/api/v1/link/shorten";

// 각 레코드에 대해 반복
for (let record of query.records) {
    let fieldValue = record.getCellValue('여기에 원본 URL의 Field명을 넣으세요'); 

    const headers = {
        "Authorization": "Bearer 여기에 발급받은 API Key를 넣으세요",
        "Content-Type": "application/json",
        "Accept": "application/json",
    };

    let body = {
        "long_url": fieldValue,
        "domain": "https:\/\/여기에 원하는 custom domain을 넣으세요.\/"
    };

    // API 요청
    let apiResponse = await fetch(tlyURL, {
        method: "POST",
        headers,
        body: JSON.stringify(body),
    }).then(response => response.json());

    //console.log(apiResponse);

    // 응답에서 short_url을 추출하여 updateRecords 배열에 추가
    if (apiResponse && apiResponse.short_url) {
        updateRecords.push({
            id: record.id,
            fields: {
                'ShortURL': apiResponse.short_url
            }
        });
    }

}

// 변경된 내용을 Airtable에 반영
if (updateRecords.length > 0) {
    await table.updateRecordsAsync(updateRecords);
}

• URL의 유효기간을 설정하는 expire date나 tags, pixels 등도 설정 가능하나 위에선 사용하지 않았습니다. (자세한 건 API Document의 예제들을 확인하세요)

이렇게 설정하신 후 trigger field에 체크 표시를 하시면 자동으로 Script가 실행되고 짧아진 URL이 ShortURL 필드에 업데이트됩니다.

• Zapier나 Make, Pipedream같은 Integration Tool들도 많이 있지만, 때론 이렇게 사용해 보는 것도 좋습니다.

• 이유는 일단 화면 전환을 하지 않아도 된다는 점과

• 그리고 간단한 목적을 위해서는 Zapier를 쓰는 것 보다 때로는 더 간단할 수도 있다는 점. 등이라고 생각합니다.

몇 개의 기수를 지나오면서 계속 눈팅만 하고, 대부분의 자료들이 업무상 자료들이라 사례 발표 등으로 오픈하기 어려웠는데 모처럼 공유할 만한 게 생겨서 적어봤습니다~