웹솔루션개발 22년 노하우! 해피CGI의 모든것

[해피CGI][cgimall] 인스타크램 API 본문

웹프로그램밍 자료실/기타 자료

[해피CGI][cgimall] 인스타크램 API

해피CGI윤실장 2017. 5. 25. 09:16
내 인스타그램의 포스트, 즉 특정 ID의 사진을 내 웹페이지에 삽입하는 플러그인 입니다.

https://www.instagram.com/developer

로그인 후 상단 메뉴의 Manage Clients 를 클릭합니다.

 

 

 

다시 Manage Clients 를 클릭하여 들어가서 Register a New Client 버튼을 클릭합니다.

 

 

 

 

출력되는 페이지에 값을 입력해줍니다.

(1) Application Name : 사용할 이름
(insta 및 gram 및 instagram 과 비슷한 아이디를 사용하지 말라고 명시되어 있음)

(2) Description : 이 앱에 대한 설명

(3) Company Name : 회사명

(3) Website URL : 앱을 사용하여 연동할 사이트 주소

(4) Valid redirect URIs : 권한을 받은 후 리다이렉트시킬 주소

(5) Privacy Policy URL : 개인 정보 보호 정책 URL

(6) Contact email : 연락처 이메일




입력이 완료되면 아래와 같은 화면이 출력됩니다.

 

 

 

 

EDIT 버튼을 눌러 Security 탭에가서 Disable implicit OAuth 체크를 해제합니다.

 

 

 

 

http://instafeedjs.com/
위 링크에 접속하여 다운로드 버튼을 클릭하여 js 파일을 받으시면 됩니다.
다운이 안될 경우 본 글에 첨부된 첨부파일을 다운받으시면 됩니다.

아래 링크의 CLIENT-ID 와 REDIRECT-URL 는 위에서 생성된 값을 넣어주시면 됩니다.
https://instagram.com/oauth/authorize/?client_id=CLIENT-ID&redirect_uri=REDIRECT-URL&response_type=token





생성한 파일을 실행해주면 아래처럼 뜨는데, Authorize 를 클릭합니다.
생성한 Application이 나의 인스타그램의 정보를 수집해 가는 것을 허락한다는 의미입니다.

 

 

 

 

아래 처럼 token 번호를 받을 수 있습니다.

 

 

access_token 값 중에서 . 을 기준으로 첫번째 부분이 userID가 됩니다.



내용 출력 페이지에서는 아래처럼 소스를 구성할 수 있습니다.

 

 

 

 

출력 수량은 limit 값으로 조절해주시면 됩니다.

 

 

인스타그램에 등록된 이미지가 출력되고 출력된 이미지를 클릭하면 인스타그램으로 이동합니다.

 

 

홈페이지바로가기 

Comments