JWT 和 JJWT，别再傻傻分不清了！

Success! Welcome {{userName}}

{{userName}} is a

User

Admin

Foo app.jsvar appModule = angular.module('myApp', []);appModule.controller('MainCtrl', ['mainService','$scope','$http', function(mainService, $scope, $http) { $scope.greeting = 'Welcome to the JSON Web Token / AngularJR / Spring example!'; $scope.token = null; $scope.error = null; $scope.roleUser = false; $scope.roleAdmin = false; $scope.roleFoo = false; $scope.login = function() { $scope.error = null; mainService.login($scope.userName).then(function(token) { $scope.token = token; $http.defaults.headers.common.Authorization = 'Bearer ' + token; $scope.checkRoles(); }, function(error){ $scope.error = error $scope.userName = ''; }); } $scope.checkRoles = function() { mainService.hasRole('user').then(function(user) {$scope.roleUser = user}); mainService.hasRole('admin').then(function(admin) {$scope.roleAdmin = admin}); mainService.hasRole('foo').then(function(foo) {$scope.roleFoo = foo}); } $scope.logout = function() { $scope.userName = ''; $scope.token = null; $http.defaults.headers.common.Authorization = ''; } $scope.loggedIn = function() { return $scope.token !== null; } } ]);appModule.service('mainService', function($http) { return { login : function(username) { return $http.post('/user/login', {name: username}).then(function(response) { return response.data.token; }); }, hasRole : function(role) { return $http.get('/api/role/' + role).then(function(response){ console.log(response); return response.data; }); } };});运行应用" data-itemshowtype="0" tab="innerlink" data-linktype="2">JwtFilter.java

> userDb = new HashMap<>();    @SuppressWarnings("unused")    private static class UserLogin {        public String name;        public String password;    }        public UserController() {        userDb.put("tom", Arrays.asList("user"));        userDb.put("wen", Arrays.asList("user", "admin"));    }    /*以上是模拟数据库，并往数据库插入tom和sally两条记录*/            @RequestMapping(value = "login", method = RequestMethod.POST)    public LoginResponse login(@RequestBody final UserLogin login)        throws ServletException {        if (login.name == null || !userDb.containsKey(login.name)) {            throw new ServletException("Invalid login");        }                //加密生成token        return new LoginResponse(Jwts.builder().setSubject(login.name)            .claim("roles", userDb.get(login.name)).setIssuedAt(new Date())            .signWith(SignatureAlgorithm.HS256, "secretkey").compact());    }    @SuppressWarnings("unused")    private static class LoginResponse {        public String token;        public LoginResponse(final String token) {            this.token = token;        }    }}ApiController.javapackage com.nibado.example.jwtangspr;import io.jsonwebtoken.Claims;import java.util.List;import javax.servlet.ServletException;import javax.servlet.http.HttpServletRequest;import org.springframework.web.bind.annotation.PathVariable;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;import org.springframework.web.bind.annotation.RestController;@RestController@RequestMapping("/api")public class ApiController { @SuppressWarnings("unchecked") @RequestMapping(value = "role/{role}", method = RequestMethod.GET) public Boolean login(@PathVariable final String role,   final HttpServletRequest request) throws ServletException {  final Claims claims = (Claims) request.getAttribute("claims");  return ((List) claims.get("roles")).contains(role); }}index.html            JSON Web Token / AngularJS / Spring Boot example                             {{greeting}}
   Please log in (tom and sally are valid names)
     Username:           Error:   {{error.data.message}}            Success! Welcome {{userName}}
     (logout)            {{userName}} is a       User          Admin           Foo               app.jsvar appModule = angular.module('myApp', []);appModule.controller('MainCtrl', ['mainService','$scope','$http',        function(mainService, $scope, $http) {            $scope.greeting = 'Welcome to the JSON Web Token / AngularJR / Spring example!';            $scope.token = null;            $scope.error = null;            $scope.roleUser = false;            $scope.roleAdmin = false;            $scope.roleFoo = false;            $scope.login = function() {                $scope.error = null;                mainService.login($scope.userName).then(function(token) {                    $scope.token = token;                    $http.defaults.headers.common.Authorization = 'Bearer ' + token;                    $scope.checkRoles();                },                function(error){                    $scope.error = error                    $scope.userName = '';                });            }            $scope.checkRoles = function() {                mainService.hasRole('user').then(function(user) {$scope.roleUser = user});                mainService.hasRole('admin').then(function(admin) {$scope.roleAdmin = admin});                mainService.hasRole('foo').then(function(foo) {$scope.roleFoo = foo});            }            $scope.logout = function() {                $scope.userName = '';                $scope.token = null;                $http.defaults.headers.common.Authorization = '';            }            $scope.loggedIn = function() {                return $scope.token !== null;            }        } ]);appModule.service('mainService', function($http) {    return {        login : function(username) {            return $http.post('/user/login', {name: username}).then(function(response) {                return response.data.token;            });        },        hasRole : function(role) {            return $http.get('/api/role/' + role).then(function(response){                console.log(response);                return response.data;            });        }    };});运行应用" data-itemshowtype="0" tab="innerlink" data-linktype="2">package com.nibado.example.jwtangspr;

import java.io.IOException;

import javax.servlet.FilterChain;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;

import org.springframework.web.filter.GenericFilterBean;

import io.jsonwebtoken.Claims;
import io.jsonwebtoken.Jwts;
import io.jsonwebtoken.SignatureException;

public class JwtFilter extends GenericFilterBean {

    @Override
    public void doFilter(final ServletRequest req,
                         final ServletResponse res,
                         final FilterChain chain) throws IOException, ServletException {
        final HttpServletRequest request = (HttpServletRequest) req;

        //客户端将token封装在请求头中，格式为（Bearer后加空格）：Authorization：Bearer +token
        final String authHeader = request.getHeader("Authorization");
        if (authHeader == null || !authHeader.startsWith("Bearer ")) {
            throw new ServletException("Missing or invalid Authorization header.");
        }

        //去除Bearer 后部分
        final String token = authHeader.substring(7);

        try {
         //解密token，拿到里面的对象claims
            final Claims claims = Jwts.parser().setSigningKey("secretkey")
                .parseClaimsJws(token).getBody();
            //将对象传递给下一个请求
            request.setAttribute("claims", claims);
        }
        catch (final SignatureException e) {
            throw new ServletException("Invalid token.");
        }

        chain.doFilter(req, res);
    }

}

Success! Welcome {{userName}}

{{userName}} is a

User

Admin

> userDb = new HashMap<>();    @SuppressWarnings("unused")    private static class UserLogin {        public String name;        public String password;    }        public UserController() {        userDb.put("tom", Arrays.asList("user"));        userDb.put("wen", Arrays.asList("user", "admin"));    }    /*以上是模拟数据库，并往数据库插入tom和sally两条记录*/            @RequestMapping(value = "login", method = RequestMethod.POST)    public LoginResponse login(@RequestBody final UserLogin login)        throws ServletException {        if (login.name == null || !userDb.containsKey(login.name)) {            throw new ServletException("Invalid login");        }                //加密生成token        return new LoginResponse(Jwts.builder().setSubject(login.name)            .claim("roles", userDb.get(login.name)).setIssuedAt(new Date())            .signWith(SignatureAlgorithm.HS256, "secretkey").compact());    }    @SuppressWarnings("unused")    private static class LoginResponse {        public String token;        public LoginResponse(final String token) {            this.token = token;        }    }}ApiController.javapackage com.nibado.example.jwtangspr;import io.jsonwebtoken.Claims;import java.util.List;import javax.servlet.ServletException;import javax.servlet.http.HttpServletRequest;import org.springframework.web.bind.annotation.PathVariable;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;import org.springframework.web.bind.annotation.RestController;@RestController@RequestMapping("/api")public class ApiController { @SuppressWarnings("unchecked") @RequestMapping(value = "role/{role}", method = RequestMethod.GET) public Boolean login(@PathVariable final String role,   final HttpServletRequest request) throws ServletException {  final Claims claims = (Claims) request.getAttribute("claims");  return ((List) claims.get("roles")).contains(role); }}index.html            JSON Web Token / AngularJS / Spring Boot example                             {{greeting}}
   Please log in (tom and sally are valid names)
     Username:           Error:   {{error.data.message}}            Success! Welcome {{userName}}
     (logout)            {{userName}} is a       User          Admin           Foo               app.jsvar appModule = angular.module('myApp', []);appModule.controller('MainCtrl', ['mainService','$scope','$http',        function(mainService, $scope, $http) {            $scope.greeting = 'Welcome to the JSON Web Token / AngularJR / Spring example!';            $scope.token = null;            $scope.error = null;            $scope.roleUser = false;            $scope.roleAdmin = false;            $scope.roleFoo = false;            $scope.login = function() {                $scope.error = null;                mainService.login($scope.userName).then(function(token) {                    $scope.token = token;                    $http.defaults.headers.common.Authorization = 'Bearer ' + token;                    $scope.checkRoles();                },                function(error){                    $scope.error = error                    $scope.userName = '';                });            }            $scope.checkRoles = function() {                mainService.hasRole('user').then(function(user) {$scope.roleUser = user});                mainService.hasRole('admin').then(function(admin) {$scope.roleAdmin = admin});                mainService.hasRole('foo').then(function(foo) {$scope.roleFoo = foo});            }            $scope.logout = function() {                $scope.userName = '';                $scope.token = null;                $http.defaults.headers.common.Authorization = '';            }            $scope.loggedIn = function() {                return $scope.token !== null;            }        } ]);appModule.service('mainService', function($http) {    return {        login : function(username) {            return $http.post('/user/login', {name: username}).then(function(response) {                return response.data.token;            });        },        hasRole : function(role) {            return $http.get('/api/role/' + role).then(function(response){                console.log(response);                return response.data;            });        }    };});运行应用" data-itemshowtype="0" tab="innerlink" data-linktype="2">package com.nibado.example.jwtangspr;

import java.util.Arrays;
import java.util.Date;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.ServletException;

import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;

import io.jsonwebtoken.Jwts;
import io.jsonwebtoken.SignatureAlgorithm;

@RestController
@RequestMapping("/user")
public class UserController {

 //这里模拟数据库
    private final Map> userDb = new HashMap<>();

    @SuppressWarnings("unused")
    private static class UserLogin {
        public String name;
        public String password;
    }
    
    public UserController() {
        userDb.put("tom", Arrays.asList("user"));
        userDb.put("wen", Arrays.asList("user", "admin"));
    }
    /*以上是模拟数据库，并往数据库插入tom和sally两条记录*/
    
    
    @RequestMapping(value = "login", method = RequestMethod.POST)
    public LoginResponse login(@RequestBody final UserLogin login)
        throws ServletException {
        if (login.name == null || !userDb.containsKey(login.name)) {
            throw new ServletException("Invalid login");
        }
        
        //加密生成token
        return new LoginResponse(Jwts.builder().setSubject(login.name)
            .claim("roles", userDb.get(login.name)).setIssuedAt(new Date())
            .signWith(SignatureAlgorithm.HS256, "secretkey").compact());
    }

    @SuppressWarnings("unused")
    private static class LoginResponse {
        public String token;

        public LoginResponse(final String token) {
            this.token = token;
        }
    }
}

Success! Welcome {{userName}}

{{userName}} is a

User

Admin

> userDb = new HashMap<>();    @SuppressWarnings("unused")    private static class UserLogin {        public String name;        public String password;    }        public UserController() {        userDb.put("tom", Arrays.asList("user"));        userDb.put("wen", Arrays.asList("user", "admin"));    }    /*以上是模拟数据库，并往数据库插入tom和sally两条记录*/            @RequestMapping(value = "login", method = RequestMethod.POST)    public LoginResponse login(@RequestBody final UserLogin login)        throws ServletException {        if (login.name == null || !userDb.containsKey(login.name)) {            throw new ServletException("Invalid login");        }                //加密生成token        return new LoginResponse(Jwts.builder().setSubject(login.name)            .claim("roles", userDb.get(login.name)).setIssuedAt(new Date())            .signWith(SignatureAlgorithm.HS256, "secretkey").compact());    }    @SuppressWarnings("unused")    private static class LoginResponse {        public String token;        public LoginResponse(final String token) {            this.token = token;        }    }}ApiController.javapackage com.nibado.example.jwtangspr;import io.jsonwebtoken.Claims;import java.util.List;import javax.servlet.ServletException;import javax.servlet.http.HttpServletRequest;import org.springframework.web.bind.annotation.PathVariable;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;import org.springframework.web.bind.annotation.RestController;@RestController@RequestMapping("/api")public class ApiController { @SuppressWarnings("unchecked") @RequestMapping(value = "role/{role}", method = RequestMethod.GET) public Boolean login(@PathVariable final String role,   final HttpServletRequest request) throws ServletException {  final Claims claims = (Claims) request.getAttribute("claims");  return ((List) claims.get("roles")).contains(role); }}index.html            JSON Web Token / AngularJS / Spring Boot example                             {{greeting}}
   Please log in (tom and sally are valid names)
     Username:           Error:   {{error.data.message}}            Success! Welcome {{userName}}
     (logout)            {{userName}} is a       User          Admin           Foo               app.jsvar appModule = angular.module('myApp', []);appModule.controller('MainCtrl', ['mainService','$scope','$http',        function(mainService, $scope, $http) {            $scope.greeting = 'Welcome to the JSON Web Token / AngularJR / Spring example!';            $scope.token = null;            $scope.error = null;            $scope.roleUser = false;            $scope.roleAdmin = false;            $scope.roleFoo = false;            $scope.login = function() {                $scope.error = null;                mainService.login($scope.userName).then(function(token) {                    $scope.token = token;                    $http.defaults.headers.common.Authorization = 'Bearer ' + token;                    $scope.checkRoles();                },                function(error){                    $scope.error = error                    $scope.userName = '';                });            }            $scope.checkRoles = function() {                mainService.hasRole('user').then(function(user) {$scope.roleUser = user});                mainService.hasRole('admin').then(function(admin) {$scope.roleAdmin = admin});                mainService.hasRole('foo').then(function(foo) {$scope.roleFoo = foo});            }            $scope.logout = function() {                $scope.userName = '';                $scope.token = null;                $http.defaults.headers.common.Authorization = '';            }            $scope.loggedIn = function() {                return $scope.token !== null;            }        } ]);appModule.service('mainService', function($http) {    return {        login : function(username) {            return $http.post('/user/login', {name: username}).then(function(response) {                return response.data.token;            });        },        hasRole : function(role) {            return $http.get('/api/role/' + role).then(function(response){                console.log(response);                return response.data;            });        }    };});运行应用" data-itemshowtype="0" tab="innerlink" data-linktype="2">package com.nibado.example.jwtangspr;

import io.jsonwebtoken.Claims;

import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;

import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;

@RestController
@RequestMapping("/api")
public class ApiController {
 @SuppressWarnings("unchecked")
 @RequestMapping(value = "role/{role}", method = RequestMethod.GET)
 public Boolean login(@PathVariable final String role,
   final HttpServletRequest request) throws ServletException {
  final Claims claims = (Claims) request.getAttribute("claims");
  return ((List) claims.get("roles")).contains(role);
 }
}

Success! Welcome {{userName}}

{{userName}} is a

User

Admin

> userDb = new HashMap<>();    @SuppressWarnings("unused")    private static class UserLogin {        public String name;        public String password;    }        public UserController() {        userDb.put("tom", Arrays.asList("user"));        userDb.put("wen", Arrays.asList("user", "admin"));    }    /*以上是模拟数据库，并往数据库插入tom和sally两条记录*/            @RequestMapping(value = "login", method = RequestMethod.POST)    public LoginResponse login(@RequestBody final UserLogin login)        throws ServletException {        if (login.name == null || !userDb.containsKey(login.name)) {            throw new ServletException("Invalid login");        }                //加密生成token        return new LoginResponse(Jwts.builder().setSubject(login.name)            .claim("roles", userDb.get(login.name)).setIssuedAt(new Date())            .signWith(SignatureAlgorithm.HS256, "secretkey").compact());    }    @SuppressWarnings("unused")    private static class LoginResponse {        public String token;        public LoginResponse(final String token) {            this.token = token;        }    }}ApiController.javapackage com.nibado.example.jwtangspr;import io.jsonwebtoken.Claims;import java.util.List;import javax.servlet.ServletException;import javax.servlet.http.HttpServletRequest;import org.springframework.web.bind.annotation.PathVariable;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;import org.springframework.web.bind.annotation.RestController;@RestController@RequestMapping("/api")public class ApiController { @SuppressWarnings("unchecked") @RequestMapping(value = "role/{role}", method = RequestMethod.GET) public Boolean login(@PathVariable final String role,   final HttpServletRequest request) throws ServletException {  final Claims claims = (Claims) request.getAttribute("claims");  return ((List) claims.get("roles")).contains(role); }}index.html            JSON Web Token / AngularJS / Spring Boot example                             {{greeting}}
   Please log in (tom and sally are valid names)
     Username:           Error:   {{error.data.message}}            Success! Welcome {{userName}}
     (logout)            {{userName}} is a       User          Admin           Foo               app.jsvar appModule = angular.module('myApp', []);appModule.controller('MainCtrl', ['mainService','$scope','$http',        function(mainService, $scope, $http) {            $scope.greeting = 'Welcome to the JSON Web Token / AngularJR / Spring example!';            $scope.token = null;            $scope.error = null;            $scope.roleUser = false;            $scope.roleAdmin = false;            $scope.roleFoo = false;            $scope.login = function() {                $scope.error = null;                mainService.login($scope.userName).then(function(token) {                    $scope.token = token;                    $http.defaults.headers.common.Authorization = 'Bearer ' + token;                    $scope.checkRoles();                },                function(error){                    $scope.error = error                    $scope.userName = '';                });            }            $scope.checkRoles = function() {                mainService.hasRole('user').then(function(user) {$scope.roleUser = user});                mainService.hasRole('admin').then(function(admin) {$scope.roleAdmin = admin});                mainService.hasRole('foo').then(function(foo) {$scope.roleFoo = foo});            }            $scope.logout = function() {                $scope.userName = '';                $scope.token = null;                $http.defaults.headers.common.Authorization = '';            }            $scope.loggedIn = function() {                return $scope.token !== null;            }        } ]);appModule.service('mainService', function($http) {    return {        login : function(username) {            return $http.post('/user/login', {name: username}).then(function(response) {                return response.data.token;            });        },        hasRole : function(role) {            return $http.get('/api/role/' + role).then(function(response){                console.log(response);                return response.data;            });        }    };});运行应用" data-itemshowtype="0" tab="innerlink" data-linktype="2">
"myApp">

    "utf-8"/>
    "X-UA-Compatible" content="IE=edge,chrome=1"/>
    JSON Web Token / AngularJS / Spring Boot example
    "description" content="">
    "viewport" content="width=device-width">
    "stylesheet" href="libs/bootstrap/css/bootstrap.css">
    
    
    
    


"container" ng-controller='MainCtrl'>
 {{greeting}}

 "!loggedIn()">
  Please log in (tom and sally are valid names)

  "login()">
   Username: type="text" ng-model="userName"/>type="submit" value="Login"/>
  
 
 "alert alert-danger" role="alert" ng-show="error.data.message">
   "glyphicon glyphicon-exclamation-sign" aria-hidden="true">
   "sr-only">Error:
   {{error.data.message}}
  
 "loggedIn()">
  "row">
   "col-md-6">
    "label label-success">Success! Welcome {{userName}}

     "logout()">(logout)
   
   "col-md-4">
   "row header">
   "col-sm-4">{{userName}} is a
  
  "row">
   "col-sm-2">User
   "col-sm-2">"glyphicon glyphicon-ok" aria-hidden="true" ng-show="roleUser">
  
  "row">
   "col-sm-2">Admin
   "col-sm-2">"glyphicon glyphicon-ok" aria-hidden="true" ng-show="roleAdmin">
   
  "row">
   "col-sm-2">Foo
   "col-sm-2">"glyphicon glyphicon-ok" aria-hidden="true" ng-show="roleFoo">

Success! Welcome {{userName}}