ASP

ASP 사용자 가이드입니다.

위젯 코드 추가

먼저 앱을 등록합니다.

  1. 게임키키# 사이트에서 새로운 앱을 생성합니다.
  2. 생성된 앱의 appId(Application ID) 와 appSecret(Application Secretkey)을 메모합니다.
  3. 찬스게임 사용을 원하시는 경우에는 찬스게임 등록 페이지를 참조하시기 바랍니다.

다음으로 위젯을 실행시킬 페이지에 게임키키# 스크립트를 추가합니다.

  1. jquery library를 넣습니다.

    • 게임키키#은 jquery library를 사용합니다. 해당 library를 넣어줍니다.
      1
      2
      3
      4
      5
      6
      <html>
      <head>
          <meta charset="utf-8" />
          <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
      </head>
      </html>

  2. 위젯을 사용할 페이지 <head> tag에 아래와 같이 키키 스크립트를 추가합니다.

    1
    2
    3
    4
    5
    6
    7
    <html>
    <head>
        <meta charset="utf-8" />
        <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
        <script charset="utf-8" src="https://gamekiki.com/kshop/kwidget/js/kwidget.js"></script>
    </head>
    </html>

  3. 로그인이 되어있지 않을 경우 이동될 url을 설정합니다.

    • 로그인 유무를 체크해서 로그인이 되어 있지 않을 경우 이동될 로그인 url을 설정합니다.
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      <html>
      <head>
          <meta charset="utf-8" />
          <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
          <script charset="utf-8" src="https://gamekiki.com/kshop/kwidget/js/kwidget.js"></script>
          <script>
              kshopMds.loginPage = "./login.html";
          </script>
      </head>
      </html>

  4. 샘플 앱의 init 코드를 설정합니다.

    • 생성된 앱의 appId를 참조해서 init 코드를 설정합니다.
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      <html>
      <head>
          <meta charset="utf-8" />
          <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
          <script charset="utf-8" src="https://gamekiki.com/kshop/kwidget/js/kwidget.js"></script>
          <script>        
              kshopMds.loginPage = "./login.html"; 
              var appId="app_NWMUorVo00000";            
              kshopMds.init({
                  appId : appId            
              });     
          </script>
      </head>
      </html>

  5. 사이트 사용자의 로그인 쿠키값과 키키위젯 로그인 쿠키값의 동기화 (옵션)

    • 사이트 사용자의 쿠키 세션이 만료된 경우, 키키위젯의 세션 또한 동기화 하여 만료시키는게 좋습니다
    • 키키 위젯세션의 쿠키만료는 아래와 같이 init함수 호출 시 autoLogin 값을 ‘N’으로 부여해주시면 됩니다
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      <html>
      <head>
          <meta charset="utf-8" />
          <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
          <script charset="utf-8" src="https://gamekiki.com/kshop/kwidget/js/kwidget.js"></script>
          <script>
              // 사이트 사용자의 로그인 쿠키 값
              var user_session_cookie = "<?=$_COOKIE["userLoginSession"]?>";
              // 사용자의 로그인 쿠키값 없다면 "N"
              var autoLogin= (user_session_cookie)? "Y" : "N";
              
              kshopMds.loginPage = "./login.html"; 
              var appId="app_NWMUorVo00000";
              kshopMds.init({
                  appId : appId, // 필수
                  autoLogin : autoLogin // 옵션
              });
          </script>
      </head>
      </html>

로그인연동

  1. 로그인을 실행시킬 페이지에 키키 라이브러리를 포함시킵니다.

    • kikiClass.zip 다운로드
      1
      <!-- #include file="kikiClass.asp" -->

  2. 생성된 앱정보를 참조해서 아래와 같이 파라미터를 지정합니다.

    • 생성된 앱의 appId, appSecret 값을 파라미터로 지정합니다.
    • 로그인 연동이 될 사용자 ID(userId)도 함께 지정합니다.
      1
      2
      3
      4
      5
      6
      7
      <!-- #include file="kikiClass.asp" -->
      <%
          Dim appId, appSecret, userId, kiki
          appId = "app_NWMUorVo00000"
          appSecret ="3c640d9eee6cceba1e291e7ea834c6**********************************"   
          userId="test00"
      %>

  3. kikiClass를 생성시킨 후, 로그인 함수를 호출합니다.

    • 로그인이 완료되면 저장된 로그인정보를 위젯 코드 추가한 페이지에서 참조하게 됩니다.
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      <!-- #include file="kikiClass.asp" -->
      <%
          Dim appId, appSecret, userId, kiki
          appId = "app_NWMUorVo00000"
          appSecret ="3c640d9eee6cceba1e291e7ea834c6**********************************"   
          userId="test00"

          Set kiki = new kikiClass
          Kiki.login appId, appSecret, userId
      %>

  4. 위젯을 실행하기 위해서 위젯 코드 추가를 설정한 페이지로 이동합니다.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    <!-- #include file="kikiClass.asp" -->
    <%
        Dim appId, appSecret, userId, kiki
        appId = "app_NWMUorVo00000"
        appSecret ="3c640d9eee6cceba1e291e7ea834c6**********************************"   
        userId="test00"

        Set kiki = new kikiClass
        Kiki.login appId, appSecret, userId

        Response.Redirect "main.html" 
    %>

  5. 로그인 함수 호출 실패시 호출될 on Error Resume Next 함수를 설정해줍니다.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    <!-- #include file="kikiClass.asp" -->
    <%
        Dim appId, appSecret, userId, kiki
        appId = "app_NWMUorVo00000"
        appSecret ="3c640d9eee6cceba1e291e7ea834c6**********************************"   
        userId="test00"

        Set kiki = new kikiClass
        Kiki.login appId, appSecret, userId

        Response.Redirect "main.html" 
        On Error Resume Next
        '로그인 실패 
        Response.Redirect "main.html" 
    %>

로그아웃 연동

사용자 사이트에서 로그아웃 실행 시 위젯 로그아웃이 동일하게 실행되어야만 위젯의 기존 사용자 정보 또한 삭제됩니다.
로그아웃은 아래와 같이 실행시키시면 됩니다

키키위젯에서 제공하는 함수를 사용한 로그아웃

asp

1
2
3
4
5
6
7
 Dim appId, appSecret, userId, kiki
appId = "app_NWMUorVo00000"
appSecret ="3c640d9eee6cceba1e291e7ea834c6**********************************"   
userId="test00"

Set kiki = new kikiClass
kiki.logout

js

1
2
3
4
<script charset="UTF-8" src="https://gamekiki.com/kshop/kwidget/js/kwidget.js"></script>
<script>
    kshopMds.logout();
</script>

직접 쿠키 삭제

로그인 시 설정했던 쿠키들을 삭제해주시면 로그아웃이 됩니다

key value description
kiki_wg_pId “app_NM00001” 어플리케이션 id
kiki_wg_uId “user001” 사용자의 userId
kiki_wg_whole_tk “eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9” 서버로부터 얻은 토큰 값