Hộ chiếu đăng nhập nodejs

Hộ chiếu là một thư viện nhằm mục đích làm cho mã xác thực và ủy quyền nhỏ hơn và dễ xử lý. Nó tương thích nhanh và hoạt động hoàn hảo như một phần mềm trung gian xác thực cho các ứng dụng nodeJS

Làm thế nào để sử dụng nó

Mục đích của Hộ chiếu về cơ bản là xử lý các yêu cầu ủy quyền/xác thực, mang lại cho nhà phát triển sự tự do và linh hoạt trên bất kỳ logic nào để xác thực người dùng, tuyến đường hoặc lược đồ cơ sở dữ liệu

Với Hộ chiếu, bạn có thể chỉ định các cách xác thực yêu cầu khác nhau, được gọi là Chiến lược. Các chiến lược có thể đi từ xác minh thông tin đăng nhập bên trong ngữ cảnh ứng dụng của bạn đến thậm chí ủy quyền xác thực cho các dịch vụ bên ngoài bằng OAuth hoặc OpenId

Ví dụ

Chúng tôi sẽ tạo một ứng dụng nodejs đơn giản và viết một số mã để xác thực người dùng bằng Spotify OAuth

Trước tiên hãy tạo cấu trúc thư mục cho ứng dụng. Tạo một thư mục có tên là simplexAuthExampleApp. Tạo một tệp có tên gói. json với nội dung sau


{
  "name": "spotify-login",
  "version": "1.0.0",
  "description": "Passport example for Spotify",
  "main": "app.js",
  "scripts": {
    "start": "node app.js",
    "test": "echo \"Error: no test specified\"; && exit 1"
  },
  "dependencies": {
     "express": "^4.16.3",
     "request": "~2.83.0",
     "cookie-parser": "~1.4.3",
     "cors": "^2.8.4",
     "querystring": "~0.2.0"
   },
   "author": "Matias Pruyas",
   "license": "ISC"
 }

Chạy cài đặt npm


Tạo một tệp có tên ứng dụng. js với nội dung sau.


const express = require('express')
const app = express()
const port = 3000
const bodyParser = require('body-parser')
const cors = require('cors')
const cookieParser = require('cookie-parser')

app.use(bodyParser.json())
app.use(cors())
app.use(cookieParser())

app.get('/', (req, res) => res.send('Hello Simplex readers!'))

app.listen(port, () => console.log(`App started on port: ${port}!`))

Đây là hướng dẫn ủy quyền Spotify https. // nhà phát triển. spotify. com/documentation/General/guides/authorization-guide/ để hiểu thêm về cách thức hoạt động của nó

Những gì bạn cần làm là tạo một tài khoản và làm theo các bước để thiết lập ứng dụng, nhận clientId, clientSecret và cuối cùng là định cấu hình redirectUri


Dòng chảy diễn ra như thế này

  • Ứng dụng của chúng tôi yêu cầu quyền truy cập dữ liệu từ dịch vụ tài khoản Spotify (cung cấp clientId, clientId bí mật và redirectUri được tạo trước đó);
  • Người dùng đăng nhập và cấp quyền truy cập vào ứng dụng;
  • Ứng dụng nhận được một mã mà nó sẽ sử dụng để yêu cầu mã thông báo truy cập;
  • Ứng dụng nhận mã thông báo truy cập và yêu cầu dữ liệu của người dùng

Hãy thêm mã để làm cho ứng dụng của chúng tôi yêu cầu cấp quyền truy cập dữ liệu từ dịch vụ tài khoản Spotify

Tạo một thư mục có tên là bộ điều khiển và một tệp mới bên trong thư mục có tên là spotify. js với nội dung sau


const request = require('request')
const querystring = require('querystring')

const clientId = 'You client id from spotify developers dashboard'
const clientIdSecret = 'You client id secret from spotify developers dashboard'
const redirectUri = 'http://localhost:3000/callback'//make you put this redirect uri on your Spotify's developer dashboard
const stateKey = 'spotify_auth_state'

const generateRandomString = function(length) {
  let text = ''
  let possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'

  for (let i = 0; i < length; i++) {
    text += possible.charAt(Math.floor(Math.random() * possible.length))
  }
  return text
}

const login = async function (req, res) {
  const state = generateRandomString(16)
  res.cookie(stateKey, state)
  const scope = `user-read-private user-read-email`

  res.redirect(`https://accounts.spotify.com/authorize?` +
    querystring.stringify({
      response_type: 'code',
      client_id: clientId,
      scope: scope,
      redirect_uri: redirectUri,
      state: state
    })
  )
}

const callback = async function (req, res, next) {
  let code = req.query.code || null
  let state = req.query.state || null
  let storedState = req.cookies ? req.cookies[stateKey] : null

  if (state === null || state !== storedState) {
    next(new Error('state_mismatch'))
  }
  
  res.clearCookie(stateKey)
  let authOptions = {
    url: `https://accounts.spotify.com/api/token`,
    form: {
      code: code,
      redirect_uri: redirectUri,
      grant_type: 'authorization_code'
    },
    headers: {
      'Authorization': 'Basic ' + (new Buffer(clientId + ':' + clientIdSecret).toString('base64'))
    },
    json: true
  }

  request.post(authOptions, function(error, response, body) {
    if (!error && response.statusCode === 200) {

      let access_token = body.access_token
      let refresh_token = body.refresh_token

      let options = {
        url: `https://api.spotify.com/v1/me`,
        headers: { 'Authorization': 'Bearer ' + access_token },
        json: true
      }

      // use the access token to access the Spotify Web API
      request.get(options, async function(error, response, body) {
        if(!!error) {
          console.log(error)
        } else {
          res.json({
            userProfile: body,
            accessToken: access_token,
            refreshToken: refresh_token 
          })
        }
      })
    } else {
      next(error)
    }
  })
}

module.exports = {
  login,
  callback
}

Trong tệp này, chúng tôi đã thêm hai chức năng để xử lý xác thực, đăng nhập và gọi lại

Chức năng Đăng nhập sẽ chuyển hướng người dùng đến dịch vụ tài khoản Spotify, đồng thời gửi clienteId, phạm vi và chuyển hướng uri để Spotify có thể nhận ra ứng dụng trước khi cho chúng tôi cơ hội nhận mã thông báo truy cập cho một người dùng cụ thể

Nếu người dùng cho phép ứng dụng cung cấp thông tin đăng nhập Spotify, thì chúng tôi sẽ nhận được yêu cầu trên redirectUri của chúng tôi mà chúng tôi sẽ xử lý trong chức năng gọi lại của mình

Trong chức năng gọi lại của chúng tôi, điều đầu tiên chúng tôi cần làm là xác minh rằng chúng tôi có mã và trạng thái đó là chính xác

Sau đó, chúng tôi có thể yêu cầu mã thông báo truy cập gửi yêu cầu tới điểm cuối api/mã thông báo Spotify, cung cấp mã mà chúng tôi nhận được từ họ và clientId và clientIdSecret của chúng tôi làm mã thông báo truy cập

Khi chúng tôi đăng yêu cầu đó lên Spotify, chúng tôi sẽ nhận được mã thông báo truy cập và mã thông báo làm mới mà chúng tôi sẽ sử dụng để yêu cầu thông tin của người dùng

Chúng tôi sẽ sử dụng mã thông báo đó để yêu cầu thông tin hồ sơ của người dùng và hoàn thành yêu cầu. Hãy thêm bộ điều khiển vào ứng dụng chính của chúng tôi và dùng thử. ứng dụng của chúng tôi. js sẽ trông như thế này

________3

Chạy npm start và mở http. //máy chủ cục bộ. 3000/lần đăng nhập trong trình duyệt của bạn. Hơn nữa, chúng tôi có thể thêm một điểm cuối để sử dụng mã thông báo làm mới, vì vậy chúng tôi không phải thực hiện tất cả quy trình đăng nhập sau khi mã thông báo truy cập hết hạn, nhưng điều này đủ để cho thấy tại sao hộ chiếu sẽ giúp cuộc sống của chúng tôi đơn giản hơn

Bây giờ là thời gian Hộ chiếu

Trước hết, chúng ta cần thêm các phụ thuộc cần thiết để làm việc với hộ chiếu vào packaje của chúng ta. json. Vì vậy, hãy thêm hộ chiếu, hộ chiếu-spotify và phiên nhanh vào gói của chúng tôi. json và sau đó chạy cài đặt npm


{
  "name": "spotify-login",
  "version": "1.0.0",
  "description": "Passport example for Spotify",
  "main": "app.js",
  "scripts": {
    "start": "node app.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
    "express": "^4.16.3",
    "request": "~2.83.0",
    "cookie-parser": "~1.4.3",
    "cors": "^2.8.4",
    "querystring": "~0.2.0",
    "passport-spotify": "^1.0.1",
    "passport": "^0.4.0",
    "express-session": "^1.15.6"
  },
  "author": "Matias Pruyas",
  "license": "ISC"
}

Bây giờ, chúng tôi sẽ tạo một thư mục mới có tên là phần mềm trung gian và một tệp mới bên trong nó có tên là hộ chiếu. js. Chúng tôi sẽ bao gồm nội dung sau bên trong tệp sẽ đảm nhiệm tất cả các chức năng mà chúng tôi đã thấy ở trên

Như chúng tôi đã nói trước đây, hộ chiếu sử dụng các chiến lược để xác thực các yêu cầu, có thể đi từ xác minh tên người dùng và mật khẩu đến ủy quyền xác thực cho OAuth hoặc OpenID

Trong trường hợp của chúng tôi, chúng tôi sẽ sử dụng chiến lược spotify để ủy quyền cho dịch vụ OAuth của họ. hộ chiếu của chúng tôi. js sẽ trông như thế này với chiến lược

________5

Chúng tôi đã thêm chiến lược cung cấp id và bí mật khách hàng của mình, cùng với uri chuyển hướng và đó là tất cả những gì chúng tôi phải làm. Hộ chiếu sẽ đảm nhận việc chuyển hướng uri và cung cấp mã thông báo truy cập, mã thông báo làm mới và thông tin người dùng mà trước đây chúng tôi phải tự thực hiện

Sau khi nhận được tất cả thông tin này từ Spotify OAuth, chúng tôi có thể xác minh bất cứ điều gì chúng tôi cần trong cơ sở dữ liệu của riêng mình, chẳng hạn như tạo người dùng nếu nó không tồn tại hoặc cập nhật thông tin nếu cần

Chúng tôi có chức năng gọi lại 'xong', mà chúng tôi sẽ sử dụng để cho biết liệu xác thực đó có thành công hay không. Vì vậy, nếu xác thực thành công, chúng ta gọi hàm với done(null, userResponse)

Mặt khác, nếu xác thực không thành công, chúng ta gọi hàm với done(null, false, {message. 'tại sao nó không thành công'}) Nếu xảy ra lỗi, chúng tôi gọi hàm bằng done(err)

Bây giờ, hãy sửa đổi ứng dụng. js để sử dụng phần mềm trung gian hộ chiếu. Chúng tôi cần bao gồm nhập hộ chiếu, khởi tạo chúng và cuối cùng, khai báo hai tuyến cần thiết để xác thực OAuth. một để chuyển hướng người dùng đến nhà cung cấp dịch vụ và cái còn lại sẽ là url nơi người dùng sẽ được chuyển hướng sau khi xác thực với nhà cung cấp

________6

Hãy tiếp tục và chạy npm start để kiểm tra nó

Phần kết luận

Cân nhắc mọi thứ, hộ chiếu rất dễ sử dụng, linh hoạt và dễ tích hợp với các khung như Express. Bạn có thể xử lý không chỉ xác thực mà còn cả ủy quyền (phiên, mã thông báo jwt)

Nó có rất nhiều Chiến lược để tận dụng (hơn 500). Để biết thêm thông tin, bạn có thể truy cập http. //www. hộ chiếu. org/ và xem tài liệu chính thức

Ngoài ra, nếu bạn cần trợ giúp phát triển giải pháp tùy chỉnh hoặc bất kỳ điều gì liên quan đến phát triển phần mềm, bạn có thể liên hệ với Devlane

Những thứ như thế này là một trong nhiều thứ chúng tôi tạo ra hàng ngày cho các công ty cần thúc đẩy hoạt động kinh doanh của họ hoặc tạo ra các giải pháp tùy chỉnh. Bạn có thể xem xét tất cả các dịch vụ của chúng tôi ở đây hoặc có thể bạn có thể trực tiếp và hỏi bất cứ điều gì bạn muốn