Building and Consuming Secure APIs
(with .NET Core and VueJS)
Ado Kukic
Developer Evangelist
Auth0
@kukicado
Our Application
GifBattle
@kukicado
.NET Core API
The Brains
@kukicado
VueJS
The Interface
@kukicado
Why VueJS?
@kukicado
Library
Framework
https://gifbattle.com
User
@kukicado
https://api.gifbattle.com
https://app.gifbattle.com
GifBattle
Hey Cortana, Launch GifBattle
@kukicado
JSON Web Tokens
JWT's (RFC 7519) are an open industry standard method for representing claims securely between two parties.
@kukicado
JSON Web Tokens
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOmZhbHNlfQ.uI_rNanTsZ_wFa1VnICzq2txKeYPArda5QLdVeQYFGI
@kukicado
@kukicado
How is a Drivers License like a JSON Web Token?
@kukicado
Header
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOmZhbHNlfQ.uI_rNanTsZ_wFa1VnICzq2txKeYPArda5QLdVeQYFGI
Drivers License
New York State
{
"alg":"HS256",
"typ":"JWT"
}
@kukicado
Payload
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOmZhbHNlfQ.uI_rNanTsZ_wFa1VnICzq2txKeYPArda5QLdVeQYFGI
Picture
Name
Address
Demographics
Restrictions
{
"sub": "1234567890",
"given_name": "Thor",
"family_name" : "Odinson",
"admin": true
}
@kukicado
Signature
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOmZhbHNlfQ.uI_rNanTsZ_wFa1VnICzq2txKeYPArda5QLdVeQYFGI
UV Light
Hologram
HMACSHA256( header + "." + payload, "lokisucks" )
@kukicado
📝
@kukicado
api.gifbattle.com
app.gifbattle.com
login.gifbattle.com
@kukicado
api.gifbattle.com
app.gifbattle.com
login.gifbattle.com
🔄
@kukicado
api.gifbattle.com
app.gifbattle.com
login.gifbattle.com
Resources
Overview of JWT Signing Algorithms
http://bit.ly/jwt-alg
JWT Handbook
http://bit.ly/jwt-book
General JWT Resources
jwt.io
@kukicado
Thank You
@kukicado
ASP.NET Core and Vue.js
By Ado Kukic
