Skip to content

Commit 574d6e6

Browse files
mrin9mrin9
committed
updated auth.html example
1 parent d7796d8 commit 574d6e6

File tree

1 file changed

+36
-33
lines changed

1 file changed

+36
-33
lines changed

‎docs/examples/auth.html‎

Lines changed: 36 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -16,11 +16,16 @@
1616
<script type="module" src="../rapidoc-min.js"></script>
1717
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;600&family=Roboto+Mono&display=swap" rel="stylesheet">
1818
<style>
19-
.size { width: 80px; height: 30px; font-size:13px; margin: 0 2px; padding: 0 8px; border-radius: 2px; outline:none; color: #fff;}
19+
.size { width: 100px; height: 30px; font-size:13px; margin: 0 2px; padding: 0 8px; border-radius: 2px; outline:none; color: #fff;}
2020
.btn { background-color: #2069e0; cursor:pointer; border: 1px solid transparent;}
2121
.txt {background-color: #2e2e2e; border: 1px solid #2069e0;}
2222
.table{ border:1px solid #444; border-collapse: collapse;}
2323
.table td{ font-size:12px; font-family: 'Roboto Mono'; border: 1px solid #444; padding:8px;}
24+
.table th{ font-size:11px; font-family: 'Open Sans'; border: 1px solid #444; padding:8px; background: #222;}
25+
datalist {
26+
background-color: #222;
27+
border: 1px solid #2069e0;
28+
}
2429
rapi-doc{
2530
width:100%;
2631
}
@@ -41,29 +46,30 @@ <h3>Programmatically Applying Security and Setting a API Server</h3>
4146
*This section is not RapiDoc generated. It is user injected HTML/JS into a <span style="font-family:'Roboto Mono'"> &lt;slot&gt;</span> element to demonstrate how to programatically apply security keys
4247
</div>
4348

44-
<div style="margin-top:16px">
49+
<div style="margin:24px 0 8px 0">
4550
RapiDoc provides you with two helper methods which you can use to supply security keys programatically.
46-
<ol>
47-
<li> <span style="font-family:'Roboto Mono'">setHttpUserNameAndPassword()</span></li>
48-
<li> <span style="font-family:'Roboto Mono'">setApiKey()</span></li>
49-
</ol>
5051
</div>
51-
<p>
52+
<table class="table" style="border:1px solid #444; font-family:'Roboto Mono'">
53+
<tr><th>SCHEME-TYPE</th><th>METHOD USED TO UPDATE</th></tr>
54+
<tr> <td>basic</td><td>setHttpUserNameAndPassword('http-basic', 'newUserName', 'newPassword')</td></tr>
55+
<tr> <td>other than basic</td><td style="border-bottom: 1px dashed #383838;" rowspan="3">setApiKey('api_key1', 'newApiToken')</td></tr>
56+
</table>
57+
58+
<div style="margin:24px 0 8px 0">
5259
The table below list all the scurity schemes included in this spec. Check the corrosponding method that can be used to supply an access-token
53-
<table class="table" style="border:1px solid #444; font-family:'Roboto Mono'">
54-
<tr><th>TYPE</th><th>SECURITY SCHEME ID</th><th>METHOD USED TO UPDATE</th></tr>
55-
<tr> <td>http</td><td>http-basic</td> <td rowspan="2">RapiDocEl.setHttpUserNameAndPassword('http-basic', 'newUserName', 'newPassword')</td></tr>
56-
<tr> <td>http</td><td>http-bearer</td></tr>
57-
<tr> <td>oauth2</td><td>ms-oauth</td><td style="border-bottom: 1px dashed #383838;" rowspan="3">RapiDocEl.setApiKey('api_key1', 'newApiToken')</td></tr>
58-
<tr> <td>apiKey</td><td>api_key1</td></tr>
59-
<tr> <td>apiKey</td><td>api_key2</td></tr>
60-
<tr> <td>apiKey</td><td>api_key_cookie</td><td>
61-
<span style="font-family:'Open Sans'; color:#777">
62-
If the apiKey needs to send using a cookie, then it wont be set as RapiDoc do not support creation or reading of cookies
63-
</span>
64-
</td></tr>
65-
</table>
66-
</p>
60+
</div>
61+
<table class="table" style="border:1px solid #444; font-family:'Roboto Mono'">
62+
<tr><th>SECURITY SCHEME</th><th>SCHEME TYPE</th><th>METHOD USED TO UPDATE</th></tr>
63+
<tr> <td>http-basic</td><td>basic</td> <td>setHttpUserNameAndPassword('http-basic', 'newUserName', 'newPassword')</td></tr>
64+
<tr> <td>http-bearer</td><td>bearer</td> <td>setApiKey('http-bearer', 'newToken')</td></tr>
65+
<tr> <td>api_key1</td><td> <span style="color:#777"> (not-specified)</span></td> <td>setApiKey('api_key1', 'newToken')</td></tr>
66+
<tr> <td>api_key2</td><td> <span style="color:#777"> (not-specified)</span></td> <td>setApiKey('api_key2', 'newToken')</td></tr>
67+
<tr> <td>ms-oauth</td><td> <span style="color:#777"> (not-specified)</span></td> <td>setApiKey('ms-oauth', 'newToken')</td></tr>
68+
<tr> <td>api_key_cookie</td><td> <span style="color:#777"> (not-specified)</span></td>
69+
<td> <span style="color:#777"> (wont work as this scheme sends api-key in a cookie, and rapidoc dont create/read cookies)</span></td>
70+
</tr>
71+
</table>
72+
6773
<div style="margin:32px 0 16px 0; color:#777; font-weight:bold">
6874
Below form is used for taking user input and apply the security key using javascipt
6975
</div>
@@ -79,20 +85,19 @@ <h3>Programmatically Applying Security and Setting a API Server</h3>
7985
</tr>
8086
<tr>
8187
<td> API Key</td>
82-
<td>
83-
<input class='size txt' id='api-security-scheme-id' value="api_key1" type='text' placeholder='Security Scheme ID' spellcheck='false' style="width:120px">
88+
<td>
89+
<select class='size txt' style="width:138px" id='api-security-scheme-id' placeholder='Security Scheme ID'>
90+
<option value="api_key1">api_key1</option>
91+
<option value="api_key2">api_key2</option>
92+
<option value="http-bearer">http-bearer</option>
93+
<option value="ms-oauth">ms-oauth</option>
94+
<option value="invalid-key">invalid-key</option>
95+
</select>
96+
8497
<input class='size txt' id='api-key-value' type='text' value="new-token" placeholder='API Key Value' spellcheck='false' >
8598
<button class='size btn' onclick='setSecurity(event, "apikey")'>Apply</button>
8699
</td>
87100
</tr>
88-
<tr>
89-
<td>OAuth</td>
90-
<td>
91-
<input class='size txt' id='oauth-security-scheme-id' value="ms-oauth" type='text' placeholder='Security Scheme ID' spellcheck='false' style="width:120px">
92-
<input class='size txt' id='oauth-key-value' type='text' value="new-token" placeholder='Access Token' spellcheck='false' >
93-
<button class='size btn' onclick='setSecurity(event, "oauth2")'>Apply</button>
94-
</td>
95-
</tr>
96101
<tr>
97102
<td colspan="2"><button class='size btn' style="width:200px" onclick='clearSecurityKeys(event)'>Clear all Keys</button></td>
98103
</tr>
@@ -110,8 +115,6 @@ <h3>Programmatically Applying Security and Setting a API Server</h3>
110115
<td colspan="2"><button class='size btn' style="width:110px" onclick='setApiServer(event)'>Set API Server</button></td>
111116
</tr>
112117
</table>
113-
114-
115118
</div>
116119
</div>
117120
</rapi-doc>

0 commit comments

Comments
 (0)