1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
|
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>API gateway</title>
<meta name="author" content="Simeon Simeonov">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="css/reveal.css">
<link rel="stylesheet" href="css/theme/serif.css" id="theme">
<!-- Theme used for syntax highlighting of code -->
<link rel="stylesheet" href="lib/css/zenburn.css">
<!-- Printing and PDF exports -->
<script>
var link = document.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = window.location.search.match( /print-pdf/gi ) ? 'css/print/pdf.css' : 'css/print/paper.css';
document.getElementsByTagName( 'head' )[0].appendChild( link );
</script>
<!--[if lt IE 9]>
<script src="lib/js/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<div class="reveal">
<!-- Any section element inside of this container is displayed as a slide -->
<div class="slides">
<section>
<h1>API gateway</h1>
<h3>Cerebrum-seminar 2016</h3>
</br>
<p>
<small>Simeon Simeonov</small>
</p>
</section>
<section>
<h2>Simeon Simeonov</h2>
</br>
<ul>
<li>
<p>... also known as <em>sgs</em> (<a href="http://folk.uio.no/sgs/">http://folk.uio.no/sgs/</a>)
</p>
</li>
<li><p>Cerebrum developer since February 2015</p></li>
</ul>
</section>
<section>
<h2>API gateway vs. API proxy</h2>
</br>
<p>The integration project at UiO (<em>INT</em>) defines the role <em>API Manager</em>. Why use API gateway instead of API proxy?</p>
<ul>
<li><p>Unified access for all our APIs</p></li>
<li><p>Unified documentation and catalogue</p></li>
<li><p>Unified caching for all APIs</p></li>
<li><p>Unified logging / statistics generation for all APIs</p></li>
<li><p>Access control / rate limiting for all our APIs</p></li>
<li><p>(Re)mapping and (re)writing</p></li>
</ul>
</section>
<section>
<section>
<h2>API gateway & Cerebrum</h2>
</br>
<p>For the time being we have settled on <em>Tyk API gateway</em>.</p>
<p>It uses an internal user-database and consists of the following logical components:</p>
<ul>
<li><p>Dashboard</p></li>
<li><p>Developer portal</p></li>
<li><p>Gateway</p></li>
</ul>
</section>
<section>
<h2>Dashboard</h2>
<p>Provides a convenient web-interface for configuration and manipulation of the gateway and the different APIs.</p>
<img src="images/gateway/dashboard01.png"></img>
</section>
<section>
<h2>Portal</h2>
Provides the API documentation and catalogue.
<img src="images/gateway/portal01.png"></img>
</section>
<section>
<h2>Portal</h2>
<img src="images/gateway/portal02.png"></img>
</section>
<section>
<h2>Gataway</h2>
</br>
<ul>
<li><p>Still in experimental / pilot phase</p></li>
<li><p>Several APIs are already configured in Tyk (Cerebrum WS, SAP WS... )</p></li>
<li><p>Support for many <em>authentication modes</em> (Auth Token, JWT, OAuth 2, Basic Auth, Open ID Connect, ...)</p></li>
</ul>
<p>
Official site: <a href="https://tyk.io/">https://tyk.io/</a>
</p>
</section>
</section>
<section>
<h1>Q&A</h1>
</section>
</div>
</div>
<script src="lib/js/head.min.js"></script>
<script src="js/reveal.js"></script>
<script>
// More info https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
controls: true,
progress: true,
history: true,
center: true,
transition: 'slide', // none/fade/slide/convex/concave/zoom
// More info https://github.com/hakimel/reveal.js#dependencies
dependencies: [
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
{ src: 'plugin/zoom-js/zoom.js', async: true },
{ src: 'plugin/notes/notes.js', async: true }
]
});
</script>
</body>
</html>
|