Qr로그인 화면에서 qr 이미지 추출방법

qr로그인 화면에서 qr이미지를 보내는 js가 어디있는것같은데 js열어보아도 가독성이 떨어져서인지 찾아보기가 어렵네요
함수로 구현되어서 캔버스에 그리는것같은데 쉽게 jpg로 export해서 가져갈수 있는방법이 있을까요

mcu(임베디드)에서 rest api로 로그인 및 결제과정을 만들려고 합니다.

현재 로그인 -> qr로그인페이지로 이동 까지는 되는데 이미지를 찾으려고해도 찾을수가 없네요

토큰값을 직접 받아서 qr로 만들어서 이미지로 띄우려고 하는데 어떤 방법이 있을까요

*추가

구조를 생각해보다가 js를 돌릴 환경이 없는것이 문제가 될것같네요 qr이미지만 rest api로 받을수 있나요?

브라우저가 없는 디바이스에서는 어떻게 접속하는게 좋은가요?

안녕하세요~

QR 이미지 추출이 어떤 의미인지 추가 설명 해주실 수 있을까요?

혹시, QR 코드 스캔 시, 페이지 이동하는 부분을 직접 구현하시려는 걸까요?
QR 스캔 및 페이지 이동 기능은 모바일 기기의 기능이나 카카오톡에서 제공하는 기능을 사용하시면 됩니다.

만약, QR 코드 이미지 생성 자체를 원하시는거라면, 해당 기능은 제공하고 있지 않습니다.
외부 툴을 사용하셔서 변경해주세요~

답변 감사합니다. 스텐드 얼론 단말기로 os없이 돌리는 부분이라 로그인시 qr이미지만 띄우길 원합니다

c/c++로만 개발이 되는점이라 qr의 뒷값이라도 스트링으로 얻을수 있다면, qr이미지를 자체 생성해서 표현은 가능합니다

rest api로 동작한다고 해서 js가 없이 동작할수있는구조는 아니더라구요

정리하자면

  1. qr 이미지 bmp파일로 받을수 있는지(아마 코드상 제너레이터가 웹브라우저에서 돌게되어있는것같아 안될것같은데 맞나요?)
  2. qr에 들어가는 url값을 직접 스트링으로 받을수있는지(암호화되어도 상관없습니다)
  3. 브라우저에서 돌리지 않고서 할수있는 다른방법이 있는지?

코드 디버깅하여 체크하였을때

weblogin/qr_data.json 에서 데이터를 받고 weblogin/qr_login_poll.json에서 받는것같은데 따로 동작시켰을때 정상동작은 안되는 상황이더라구요 해당 부분을 정상으로 요청하고 받는 조건이 키값말고 또 어떤것이있나요? 시간도 호출하는것같긴하던데 그것도 같이 적용되나요?

  1. 네, 해당 기능(이미지 변환) 기능은 제공하고 있지 않습니다.
  2. 웹에서 카카오 로그인 구현하시고, 카카오 로그인 시도하면 아래와 같은 주소로 이동합니다. 해당 주소를 QR 코드로 변환하셔서 사용하시면됩니다.
https://kauth.kakao.com/oauth/authorize?client_id={REST_API_KEY}&redirect_uri={Redirect-uri}&response_type=code
  1. 카카오 로그인은 authorize 이후 되돌아가는 페이지가 있어야 하므로 QR코드를 인식한 사용자는 브라우저를 띄워 실행합니다.

답변감사합니다

이거를 원한건 아니구요 qr코드의 raw 데이터를 원합니다 토큰값을 가지고있는 값이요

https://auth.kakao.com/fa/main.html?token={tokenvalue}&page=qr_login

위형식으로 되어있는 토큰값을 원해요

토큰은 제가 설명드린 oauth/authorize를 통해서만 받을 수 있습니다.

답변감사합니다.

계정 토큰이 필요한것이아니라 qr코드 토큰이 필요한것입니다.

image

위이미지에 해당하는 토큰이 필요하고, 코드상 qr_data.json 을 호출하여 갱신하고, qr_login_poll.json을 호출하여 유지하는것으로 보입니다

로그인하는 단말기에서 qr이 보여지고 로그인하려는 휴대폰이 별개의 디바이스입니다.

위의 해당하는 플로우는 인가코드를 받기 이전입니다.

첨부해주신 이미지는 카카오 계정의 스펙으로 외부 사용자가 사용할 수 있는 스펙은 아닙니다.

제가 안내드린 스펙은 디벨로퍼스 가이드에 있는 oauth/authorize 인증 방식이며

이 외의 인증 방식은 별도로 안내드리고 있지 않습니다. 참고 부탁드려요~

rest api인데 rest만으로 할수없게 되어있는군요 건의하는 부서는 어디로 가야 하나요?

첨부해주신 이미지의 qr 주소도 다음에 oauth/authorize를 호출하도록 되어 있네요.

카카오 로그인은 여타 소셜로그인과 같이 OAuth 2.0 표준으로 되어있습니다.

authorize 이후 redirect 하는 방식이 표준입니다.

참고 부탁드립니다~

https://datatracker.ietf.org/doc/html/rfc6749#section-1.3

oauth/authorize 부터는 rest로 됩니다만… qr 토큰데이터를 rest로 주지 않습니다

음…

OAuth 2.0 인증 flow 에서 QR 토큰(?)을 받으시려는 부분이 이해가 안가는데요.

QR 코드 생성 부분은 외부 QR 생성기를 이용하셔야 하고
생성 대상이 되는 URL은 oauth/authorize 이며,

카카오에서 제공하는 카카오로그인 (OAuth 2.0)은 QR 스캔 이 후 부터 이며,

사용자가 제작하신 QR을 스캔 하면 스캔한 모바일 기기에서 oauth/authorize 로 브라우저를 띄워 카카오 로그인 페이지로 이동하는 Flow 입니다. 카카오측 페이지에서 사용자가 로그인 한 후, 리다이렉트 URI 로 돌아가고 리다이렉트 URI는 소유하신 시스템의 주소로 직접 설정하시는 부분입니다.

qr 토큰데이터는 카카오에서 제공하지 않습니다.

답변 감사합니다

아직 이해가 안되시는거 같으니 다시 이야기 드리겠습니다.

oauth/authorize 과정에서 브라우저로 띄웠을때 아이디 패스워드를 적는 부분이있고 아래에 qr로그인 부분이 있죠?

qr로그인을 눌렀을때 qr을 읽어보시면 토큰값이 안에 들어있어요

당연히 qr을 리로드할때마다 토큰이 바뀌어있죠

여기서 로그인하는 단말기 (브라우저없는 인터넷기기, qr이미지 제공) 가 있고. 로그인 허가하는 단말기(사용자 휴대폰)이있습니다.

그럼 단말기에서 프로필데이터를 읽어오려면 로그인창을 띄운다음에 qr코드를 띄워주는 브라우저를 열어야겠지요?

근데 그 qr코드가 body에 토큰이 들어있는채로 나오는것이아니라 브라우저에서실행시킨 js로 동작하여 이 코드 내에서

https://kauth.kakao.com/weblogin/qr_data.json

*호스트는 정확하지 않음 account auth 전부 이상동작

image

위와같이 요청을 하고 토큰을 리턴을 받는데요

계속 이야기 드리고 있지만 브라우저 없이 하기위해서 rest api를 사용하는데 브라우저가 있어야하는상황이면 그냥 js api와 다른게 무엇인가 싶어요

로그인하기위한 페이지는 알아요 rest api로 호출하게 되죠
image
근데 키보드도없고 터치도 없어요 당연히 브라우저도 없구요

그래서 qr코드로그인을이용하는부분이고
image
위와같이 qr코드를 띄워주는데

html코드 (rest api호출시 body에 들어있는 내용)은
<canvas id="qr" class="qr_code" height="200" width="200"></canvas>
이게 끝이구요

js에서 이 id값이나 class 값을 포인팅해서 데이터를 교체해주고

그 들어가는 데이터도 js안에서 돌게되어있어요

rest api를 이용하려했지만 브라우저가 꼭 있어야하고 js환경을 빌드해야하는 과정이 들어있어서 계속이야기드리는부분이고

다른걸 다떠나서

image

카톡의 로그인 용 qr 리더를 눌러서 로그인할수있는 qr 데이터에 들어가는 토큰값을 받는방법이 어떤것인지

그것만 묻고있는데 카카오 로그인 api는 로그인 된 이후부터 입니다라고 이야기하면

로그인을 못하고있는데 로그인 뒤부터 제공된다고하면

어떻게 이야기 드려야할까 싶네요

정리하자면 로그인되는 단말기는 별도이고 이 단말기는 브라우저가 없으니 rest api를 사용하려하는데 qr 코드 데이터를 브라우저의 js 로 가공이 되어지는데 이부분에 대해서 rest api로만 호출가능한방법은 없는것인지, 있다면 초기 요청과 poll 플로우는 어떻게 되는것인지, host명이 정확하게 확인이 어려워서 대충 host되는것들은 다넣었는데 어떤게 정확한 호스트인지 결과적으로 제가 요구하는 데이터는 js에서 나오는 “https://auth.kakao.com/fa/main.html?token={tokenvalue}&page=qr_login” 결과만 요청합니다. qr코드는 만들어서 출력할수있으니 토큰 획득 방법과 토큰 유지 갱신방법만 알려주시면 될것같습니다.

참고로 로그인 되는 단말기는 메모리용량 4MB의 mcu입니다

*진짜 모르시겠으면 qr코드 텍스트로 읽어와서 그안에 데이터가 어디서 나온것인지 확인좀 부탁드립니다
https://auth.kakao.com/fa/main.html?token={tokenvalue}&page=qr_login”
image
이 qr입니다
빅스비 비전이든 무엇이든 읽으시면 됩니다
결과는
https://auth.kakao.com/fa/main.html?token=32f8727712530a6da838917e0ef73e9341b0f34582d808744f1174b6a958893d&page=qr_login
이렇게 나올겁니다

아~ 이제 이해되었습니다.

소유하신 서비스의 로그인을 위해서 QR 코드를 사용하시려는 것이 아닌

accounts.kakao.com 에서 제공 하는 카카오 QR 코드 로그인
즉, QR 코드 스캔 시 사용자의 모바일 기기가 아닌 accounts.kakao.com에 로그인하는 기능을 구현하시려는 거군요.

아쉽지만 카카오 디벨로퍼스에서 해당 기능을 제공하고 있지 않습니다.

참고 부탁드립니다~

해당 부분 건의할수 있는 부서는 어디로 연결해야할까요?

따로 없는걸까요…?

안녕하세요~

서비스 제휴를 받고 있기는 하지만, https://with.kakao.com/service

따로 기능 요청을 받고 있지는 않습니다.

rest api 가 다 만들어지지않은것이 아닌가요 기능요청이라기엔 restful 목적이랑 다른환경이지않을까요

RESTful API를 통해 요청이 수행될 때 RESTful API는 리소스 상태에 대한 표현을 요청자에게 전송합니다. 이 정보 또는 표현은 HTTP: JSON(Javascript Object Notation), HTML, XLT 또는 일반 텍스트를 통해 몇 가지 형식으로 전송됩니다. JSON은 그 이름에도 불구하고 사용 언어와 상관이 없을 뿐 아니라 인간과 머신이 모두 읽을 수 있기 때문에 가장 널리 사용됩니다.

더이상의 답변은 없는걸까요 로그인은 못하는 상황으로 끝이 났습니다.

안녕하세요.

위에 말씀드린것 처럼. QR 코드 방식 API 를 제공하고 있지 않습니다.

카카오 디벨로퍼스에서 제공하는 오픈 API 는 OAuth2.0 표준 방식의 로그인만 제공하고 있으며
QR코드 적용 역시 OAuth2.0 표준 방식 Authorize 주소를 QR코드로 변환하여 사용하시는 것을 안내 하고 있습니다.