본 문서는 앱 등록과 딥링크 템플릿 등록을 마친 사용자가 앱 내 콘텐츠를 사용해 브릿지 페이지(예시)를 만드는 방법에 대한 설명입니다.
[브릿지 페이지 예시]
기본적으로 브릿지 페이지 생성은 REST API(POST)로 만들 수 있습니다.
| URL | HOST | METHOD | 기능 | DATA TYPE |
|---|---|---|---|---|
| /test/<app_subdomain>/<template_name> | core.airbridge.io | POST | 데이터 형식 유효성 검사 | JSON |
| /index/<app_subdomain>/<template_name> | core.airbridge.io | POST | 실제 브릿지 페이지 생성 | JSON |
<app_subdomain> : 최초 앱 등록시 지정한 subdomain이며, 에어브릿지 대시보드 앱 설정 페이지에서 확인할 수 있습니다.
<template_name> : 최초 딥링크 템플릿 등록시 지정한 template의 이름이며, 에어브릿지 대시보드 템플릿 설정 페이지에서 확인할 수 있습니다.
[브릿지 페이지 예시]
[JSON 데이터 예시]
위 브릿지 페이지 예시를 만들기 위해 보내야할 JSON 데이터 양식입니다. 아래 JSON 데이터 Key값 앞에 붙어있는 [번호]는 위의 브릿지 페이지 예제에 붙어있는 번호를 의미하며, 이해를 돕기 위한 목적으로 넣어둔 것으로 실제 Key값으로 사용되지 않습니다.
Android, iOS 딥링크 템플릿을 sampleapp://detail?Id={{Id}}, 웹 딥링크 템플릿을 http://sample.com/detail?Id={{Id}} 로 가정합니다.
{
"subPath": "123",
"indicies": {
"android": {
"Id": "123"
},
"ios": {
"Id": "123"
},
"web": {
"Id": "123"
}
},
"[2] title": "가족과 함께 나들이 하기 좋은 소다미술관 - 식사권 무료 제공",
"[6] description": "2015.10.3 토요일개천절이었던 토요일.성남을 들른김에 오래 미루었던소다미술관으로 출동~인원이 아슬아슬 하여비맞기는 그냥 안하는걸루~다행히 울애들 마구 하고싶어하지 오랜만의 나들이였는데 애들도 너무 좋아하고 인원이 아슬아슬 하여 진짜 조마조마 했습니다.",
"[5] imageUrl": "https://pbs.twimg.com/media/CT61_UaUYAEOvNZ.jpg",
"cards": [{
"cardType": "mainCard",
"contents": {
"[1] category": "미술관 · 평점 5 · 리뷰 123",
"[3] mainColor": "#0075ff",
"[5] images": ["https://pbs.twimg.com/media/CT61_UaUYAEOvNZ.jpg", "https://pbs.twimg.com/media/CT61_UaUYAEOvNZ.jpg"],
"[5] videos": "https://youtu.be/vN3n3DKKgy8",
"[5] location": {"lng": 127.130266, "lat":37.559247},
"[7] valueLabel": "판매가격",
"[7] value": "123,000원"
}
}, {
"cardType": "iconBulletCard",
"contents": [
{
"[9] iconName": "basic",
"[9] text": "기본 불릿"
},
{
"[9] iconName": "info",
"[9] text": "성인 5,000 초,중,고 (학생증 소지자) 3,000 미취학아동 (3-7세) 2,000"
},
{
"[9] iconName": "time",
"[9] text": "화요일 ~금요일 오전 10시 부터 오후7시까지 매주 월요일 설, 추석연휴 휴관"
},
{
"[9] iconName": "call",
"[9] text": "070-8915-9127"
}
]
},
{
"cardType": "reviewCard",
"contents": [{
"[10] review": "지난 주말에 다녀왔어요~ 세련된 건축미에 저랑 남편도 만족하고, 애들도 신기해했네요. 재미있었어요!!",
"[10] reviewer": "ab1230gg"
}, {
"[10] review": "세련된 건축미에 저랑 남편도 만족하고, 애들도 신기해했네요. 재미있었습니다 지난 주말에 다녀왔습니다!!",
"[10] reviewer": "sooooji88"
}, {
"[10] review": "지난 주말에 다녀왔어요~",
"[10] reviewer": "ab123099"
}]
},
{
"cardType": "attractingCard",
"contents": {
"[12] attractingTitle": "고고패밀리 - 가족 여행, 나들이, 맛집, 축제",
"[12] attractingDescription": "가족 여행 힘들게 고민하지 마세요.",
"[3] actionVerb": "고고패밀리에서 자세히 보기"
}
}]
}
subPath: subPath는 앱사의 에어브릿지 링크 고유 id로 사용됩니다. 웹 페이지는search.airbridge.io/<앱_이름>/<subPath>주소로 생성되며, subPath값이 없으면 임의의 8자리 랜덤 스트링으로 생성됩니다.- [5]
images: 만약 여러개의 이미지를 추가로 넣고 싶다면, List 형식으로 보내주시면 됩니다. - [5]
videos: 비디오 URL을 넣을 수 있습니다. - [5]
location: location(경도, 위도) 정보를 주면 Google Map에서 위치를 보여줄 수 있습니다. - [9]
iconName: 기본적으로 Font-Awesome 아이콘을 사용하고 있으며, basic, info, time, call 이외에iconName에 원하는 Unicode(예. f28b, f219 등)를 넣어 사용할 수도 있습니다. - [4], [8], [11]은 자동으로 생성됩니다.
현재는 아래의 우선순위로 사용자들을 redirect(모바일 딥링크의 경우 바로 이동하고, 나머지는 버튼 클릭 후 이동) 시켜주고 있으며, 앞으로 앱사가 customize 할 수 있는 기능을 제공할 예정입니다.
- iOS 모바일 딥링크 (기설치시 바로 이동)
- iOS 앱스토어 URL
- 웹 딥링크
- 웹 랜딩페이지 URL
- Android 모바일 딥링크 (기설치시 바로 이동)
- Android 마켓 URL
- 웹 딥링크
- 웹 랜딩페이지 URL
- 웹 딥링크
- SMS (클로즈베타 기간 중 생략)
- 웹 랜딩페이지 URL
- Android 앱스토어 URL
- iOS 앱스토어 URL