개발자의 개발 블로그

1. 이것도 마찮가지로 개발자 홈페이지에 들어가 앱을 등록해줘야 한다.

https://developers.naver.com/main/

애플리케이션 등록 >> 입력 후 등록하기

2. npm을 이용하여 passport-naver 설치

무슨 문제가 있어서 이렇게 나온 것일까?

노드 개발을 하다보면, 참 많이 나는 에러다.

쉽게 말하면, 모듈화를 해놓고 해당 모듈을 불러오지 않아서(import // require) 발생하는 문제이다.

따라서,

const User = require('./User);

이런식으로 해당 모듈을 불러와야 에러가 발생하지 않는다.

ReferenceError 자체가 

참조에러? 이므로 

참조하지 않아 에러가 발생했음을 추측할 수 있다. 너무나 당연하고 쉽지만 빠트려서 빈번히 발생하는 에러이므로,

코드 작성 전 미리 선언해놓는것이 좋다.

1. passport-facebook를 설치한다.

$ npm i passport-facebook

2. 페이스북 개발자 페이지에 들어간다.

Facebook Developers

3. 로그인 한 뒤, 상단 메뉴   내 앱 >> 앱 만들기 버튼을 선택 >> 소비자 선택

그 다음 원하는 앱 이름을 작성하고 앱 연락처 이메일을 작성한다.

비즈니스 관리자 계정은 선택사항이므로 반드시 할 필요는 없다.  패스 후 , 앱 만들기 누르면 앱이 생성된다.

4. 앱이 생성되면 대시보드 창이 나오는데, 왼쪽 메뉴에서 설정 >> 기본설정을 보면 

앱 ID가 적혀있고,  앱 시크릿 코드가 *****로 적혀있는데. 

passport-facebook를 사용하기 위해서는 이 두 개가 필수!! 반드시 필요하므로 여기 이게 필요하다는 걸 기억하자!!

참고로, 앱 시크릿 코드가 더욱 중요하므로 ****를 보이게 하기 위해서는 현 Facebook 비밀번호를 한 번 더 요구한다.

또한, 웹페이지로 사용할 것이므로, 맨 밑으로 스크롤을 하게 되면 + 플랫폼 추가  가 존재한다. 이것을 클릭. 

아래와 같이 나온다. 신기하다.. 플스까지? 

하지만... 웹사이트를 선택한 뒤, 원하는 URL을 입력해주면 

이렇게  되면 이 URL에서 페이스북 로그인 요청 시에  NO하지 않고, OK를 하겠다고 설정을 한 것이다.

ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ페이스북 개발자 페이지 설정 완료 ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

이제 원하는 에디터에서 passport-facebook를 구현하면된다. 

https://www.npmjs.com/package/passport-facebook

위 진행 방법을 번역한 것을 정리하면,

1.

passport-facebook을 사용하기 전에 facebook에 애플리케이션을 등록해야합니다. 아직 그렇게하지 않았다면 Facebook 개발자에서 새 애플리케이션을 만들 수 있습니다. 애플리케이션은 전략에 제공해야하는 앱 ID 및 앱 시크릿을 발급받습니다.

또한 애플리케이션의 경로와 일치하는 리디렉션 URI를 구성해야합니다.

이것이 위에서 진행한 것이다...

2. 

Facebook 인증 전략은 Facebook 계정과 OAuth 2.0 토큰을 사용하여 사용자를 인증합니다. 애플리케이션 생성시 획득 한 앱 ID 및 시크릿은 전략 생성시 옵션으로 제공됩니다. 이 전략에는 인증 된 사용자의 Facebook 프로필이 포함 된 프로필뿐만 아니라 액세스 토큰 및 선택적 새로 고침 토큰을 수신하는 확인 콜백도 필요합니다. 확인 콜백은 인증을 완료하기 위해 사용자를 제공하는 cb를 호출해야합니다.