Cloudrail-코딩

생성 된 폴더에 서버 코드에 대한 새 파일을 생성하고 다음을 추가하여 가져 오기 및 설정 ExpressCloudRail

javascript
const express = require("express");
const cloudrail = require("cloudrail-si");
const app = express();
cloudrail.Settings.setKey("[CloudRail license key]");

이제 소셜 로그인에 사용할 서비스를 인스턴스화하는 함수를 계속 작성합니다.

javascript
function makeService(name, redirectReceiver) {
   let service;
   switch (name) {
      case "twitter":
         service = new cloudrail.services.Twitter(
            redirectReceiver,
            "[Twitter Client ID]",
            "[Twitter Client Secret]",
            "http://localhost:12345/auth/redirect/twitter"
         );
         break;
      case "facebook":
         service = new cloudrail.services.Facebook(
            redirectReceiver,
            "[Facebook Client ID]",
            "[Facebook Client Secret]",
            "http://localhost:12345/auth/redirect/facebook",
            "state"
         );
         break;
      // More services from the Profile interface can be added here, 
      //the services above are just examples
      default: throw new Error("Unrecognized service");
   }
   return service;
}

사용자 신원을 추적 할 수있는 방법이 필요합니다. 이것은 일반적으로 데이터베이스에서 수행되지만이 튜토리얼을 짧게 유지하기 위해 우리는 역할을하는 객체를 사용할 것입니다.pseudo-database.

모든 데이터는 메모리에 보관되므로 서버가 다시 시작되면 손실됩니다.

javascript
const users = {
   records: {}
};
users.find = (id) ⇒ {
   return users.records[id];
};
users.save = (id, data) ⇒ {
   users.records[id] = data;
};

그 후 소셜 로그인 흐름의 시작을 처리 할 서버 엔드 포인트를 등록합니다.

javascript
app.get("/auth/start/:serviceName", (req, res) ⇒ {
   let serviceName = req.params["serviceName"];
   
   let redirectReceiver = (url, state, callback) ⇒ {
      res.redirect(url);
   };
   let service = makeService(serviceName, redirectReceiver);
   service.login();
});

소셜 로그인을 시작한 서비스가 서버로 리디렉션되며이 리디렉션을 처리해야합니다.

사용자에 대한 고유 식별자를 얻은 후 이전에이 사용자를 본 적이 있는지 확인합니다. 그렇다면 우리는 그의 이름으로 그를 맞이합니다. 그렇지 않은 경우 소셜 네트워크에서 이름을 가져 와서 새 사용자를 저장합니다.

javascript
app.get("/auth/redirect/:serviceName", (req, res) ⇒ {
   let serviceName = req.params["serviceName"];
   
   let redirectReceiver = (url, state, callback) ⇒ {
      callback(undefined, "http://bla.com" + req.url); 
      // The callback expects a complete URL but only the query matters
   };
	let service = makeService(serviceName, redirectReceiver);
   service.getIdentifier((err, identifier) ⇒ {
      if (err) res.status(500).send(err);
      let user = users.find(identifier);
      
      if (user) {
         res.send("Welcome back " + user.name);
      } else {
         service.getFullName((err, name) ⇒ {
            if (err) res.status(500).send(err);
            users.save(identifier, {
               name: name
            });
            res.send("Welcome greenhorn!");
         });
      }
   });
});

마지막으로 서버는 12345 포트에서 수신합니다.

javascript
app.listen(12345);

이제 애플리케이션을 시작하고 로컬 브라우저에서 테스트 할 수 있습니다.

다음으로 이동하면 http://localhost:12345/auth/start/facebook Facebook 로그인 흐름을 시작합니다.

다음으로 이동하면 http://localhost:12345/auth/start/twitter Twitter 로그인 흐름을 시작합니다.

서비스에 로그인하고 액세스 권한을 부여하면 "Welcome greenhorn!"이 표시됩니다. 처음으로하고 연속 방문시 "[이름]에 다시 오신 것을 환영합니다."

예를 들어 실제 웹 사이트에 통합하려면 서비스 제공 업체의 로고를 포함하고 로고를 각 URL에 연결합니다.

게다가 의사 데이터베이스는 실제 데이터베이스로 대체되어야합니다. 이제 최대 9 개의 서로 다른 제공 업체에 대한 소셜 로그인이 가능합니다!