|
1 | | -<div class="row"> |
2 | | - <div class="medium-12 columns"> |
3 | | - <h1>JWT Generator</h1> |
4 | | - <p>Use this JWT Generator utility to quickly generate appropriate tokens for developing and testing against Stream feeds.</p> |
5 | | - <p>When working with JWT tokens, note that the Stream API expects the following HTTP Headers:</p> |
6 | | - <ul> |
7 | | - <li><strong>Stream-Auth-Type:</strong> jwt</li> |
8 | | - <li><strong>Authorization:</strong> << JWT Token>></li> |
9 | | - </ul> |
10 | | - <p>See also: Stream's <a href="https://getstream.io/docs_rest/#authentication" target="_blank">REST Authentication</a> documentation.</p> |
11 | | - <h2>Generate a token</h2> |
12 | | - <form (ngSubmit)="onSubmit()" novalidate> |
13 | | - <div> |
14 | | - <label for="apiSecret">API Secret (required):</label> |
15 | | - <input id="apiSecret" name="apiSecret" type="text" [(ngModel)]="apiSecret"> |
| 1 | +<div class="grid-container"> |
| 2 | + <div class="grid-x"> |
| 3 | + <div class="medium-12 cell"> |
| 4 | + <div class="callout"> |
| 5 | + <h1>JWT Generator</h1> |
| 6 | + <p>Use this JWT Generator utility to quickly generate appropriate tokens for developing and testing against Stream feeds.</p> |
| 7 | + <p>When working with JWT tokens, note that the Stream API expects the following HTTP Headers:</p> |
| 8 | + <ul> |
| 9 | + <li><strong>Stream-Auth-Type:</strong> jwt</li> |
| 10 | + <li><strong>Authorization:</strong> << JWT Token>></li> |
| 11 | + </ul> |
| 12 | + <p>See also: Stream's <a href="https://getstream.io/docs_rest/#authentication" target="_blank">REST Authentication</a> documentation.</p> |
| 13 | + <h2>Generate a token</h2> |
| 14 | + <form (ngSubmit)="onSubmit()" novalidate> |
| 15 | + <div> |
| 16 | + <label for="apiSecret">API Secret (required):</label> |
| 17 | + <input id="apiSecret" name="apiSecret" type="text" [(ngModel)]="apiSecret"> |
| 18 | + </div> |
| 19 | + <div> |
| 20 | + <label for="resource">Resource:</label> |
| 21 | + <select id="resource" name="resource" [(ngModel)]="resource"> |
| 22 | + <option value="activities">activities - Activities Endpoint</option> |
| 23 | + <option value="feed">feed - Feed endpoint</option> |
| 24 | + <option value="follower">follower - Following + Followers Endpoint</option> |
| 25 | + <option value="*">* - Allow access to any resource</option> |
| 26 | + </select> |
| 27 | + </div> |
| 28 | + <div> |
| 29 | + <label for="action">Action:</label> |
| 30 | + <select id="action" name="action" [(ngModel)]="action"> |
| 31 | + <option value="read">read (GET, OPTIONS, HEAD)</option> |
| 32 | + <option value="write">write (POST, PUT, PATCH)</option> |
| 33 | + <option value="delete">delete (DELETE)</option> |
| 34 | + <option value="*">* (The JWT has permission to all HTTP verbs)</option> |
| 35 | + </select> |
| 36 | + </div> |
| 37 | + <div> |
| 38 | + <label for="feedId">Feed Id:</label> |
| 39 | + <input id="feedId" name="feedId" type="text" [(ngModel)]="feedId"> |
| 40 | + </div> |
| 41 | + <div> |
| 42 | + <label for="feedId">User Id:</label> |
| 43 | + <input id="userId" name="userId" type="text" [(ngModel)]="userId"> |
| 44 | + </div> |
| 45 | + <div> |
| 46 | + <button type="submit" class="button success" [disabled]="!apiSecret">Generate</button> |
| 47 | + </div> |
| 48 | + </form> |
| 49 | + <div class="callout jwt-generated"> |
| 50 | + <p id="jsonWebToken">{{ jsonWebToken || "Your JWT will be generated here." }}</p> |
| 51 | + <button |
| 52 | + id="jwtClipboardCopyBtn" |
| 53 | + class="clipboard-copy-button has-tip" |
| 54 | + aria-label="Copy to clipboard" |
| 55 | + type="button" |
| 56 | + data-clipboard-target="#jsonWebToken" |
| 57 | + data-tooltip |
| 58 | + aria-haspopup="true" |
| 59 | + data-disable-hover="true" |
| 60 | + data-click-open="false" |
| 61 | + tabindex="1" |
| 62 | + title="Token copied to clipboard." |
| 63 | + data-position="left" |
| 64 | + data-alignment="bottom"> |
| 65 | + <span aria-hidden="true"><i class="fa fa-clipboard" aria-hidden="true"></i></span> |
| 66 | + </button> |
| 67 | + </div> |
16 | 68 | </div> |
17 | | - <div> |
18 | | - <label for="resource">Resource:</label> |
19 | | - <select id="resource" name="resource" [(ngModel)]="resource"> |
20 | | - <option value="activities">activities - Activities Endpoint</option> |
21 | | - <option value="feed">feed - Feed endpoint</option> |
22 | | - <option value="follower">follower - Following + Followers Endpoint</option> |
23 | | - <option value="*">* - Allow access to any resource</option> |
24 | | - </select> |
25 | | - </div> |
26 | | - <div> |
27 | | - <label for="action">Action:</label> |
28 | | - <select id="action" name="action" [(ngModel)]="action"> |
29 | | - <option value="read">read (GET, OPTIONS, HEAD)</option> |
30 | | - <option value="write">write (POST, PUT, PATCH)</option> |
31 | | - <option value="delete">delete (DELETE)</option> |
32 | | - <option value="*">* (The JWT has permission to all HTTP verbs)</option> |
33 | | - </select> |
34 | | - </div> |
35 | | - <div> |
36 | | - <label for="feedId">Feed Id:</label> |
37 | | - <input id="feedId" name="feedId" type="text" [(ngModel)]="feedId"> |
38 | | - </div> |
39 | | - <div> |
40 | | - <label for="feedId">User Id:</label> |
41 | | - <input id="userId" name="userId" type="text" [(ngModel)]="userId"> |
42 | | - </div> |
43 | | - <div> |
44 | | - <button type="submit" class="button success" [disabled]="!apiSecret">Generate</button> |
45 | | - </div> |
46 | | - </form> |
47 | | - <div class="callout jwt-generated"> |
48 | | - <p id="jsonWebToken">{{ jsonWebToken || "Your JWT will be generated here." }}</p> |
49 | | - <button |
50 | | - id="jwtClipboardCopyBtn" |
51 | | - class="clipboard-copy-button has-tip" |
52 | | - aria-label="Copy to clipboard" |
53 | | - type="button" |
54 | | - data-clipboard-target="#jsonWebToken" |
55 | | - data-tooltip |
56 | | - aria-haspopup="true" |
57 | | - data-disable-hover="true" |
58 | | - data-click-open="false" |
59 | | - tabindex="1" |
60 | | - title="Token copied to clipboard." |
61 | | - data-position="left" |
62 | | - data-alignment="bottom"> |
63 | | - <span aria-hidden="true"><i class="fa fa-clipboard" aria-hidden="true"></i></span> |
64 | | - </button> |
65 | 69 | </div> |
66 | 70 | </div> |
67 | 71 | </div> |
0 commit comments