JWT解决方案学习入门指南

当前位置:首页 > 广场 > JWT解决方案学习入门指南

JWT解决方案学习入门指南

2024-11-25广场18

姒傝堪

JWT解决方案学习入门指南

鏈寚鍗楁繁鍏ユ帰璁ㄤ簡JSON Web Token锛圝WT锛夎В鍐虫柟妗堢殑瀛︿範锛屾兜鐩栦簡鍏跺師鐞嗐€佸簲鐢ㄤ互鍙婂疄闄呴儴缃层€傛湰鎸囧崡寮曢浣犱簡瑙WT鍦ㄨ法鍩熻璇併€丄PI鎺堟潈浠ュ強寰湇鍔℃灦鏋勪腑鐨勫叧閿綔鐢紝骞舵彁渚涗粠闆跺紑濮嬫瀯寤篔WT绯荤粺鐨勫畬鏁存楠ゃ€傞€氳繃瀹為檯妗堜緥鍒嗘瀽鍜屾渶浣冲疄璺碉紝浣犲皢鎺屾彙濡備綍鍦∟ode.js鐜涓疄鐜板畨鍏ㄧ殑JWT璁よ瘉娴佺▼锛岀‘淇濇暟鎹紶杈撴棦瀹夊叏鍙堥珮鏁堛€?/p>

涓€銆丣WT绠€浠?/h3>

JWT解决方案学习入门指南

JSON Web Token锛圝WT锛夋槸涓€绉嶅熀浜嶫SON鏍煎紡鐨勫紑鏀炬爣鍑嗭紙RFC 7519锛夛紝鐢ㄤ簬鍦ㄥ鎴风鍜屾湇鍔″櫒涔嬮棿瀹夊叏鍦颁紶杈撲俊鎭€傚畠閫氳繃Base64 URL瀹夊叏缂栫爜鐨勬柟寮忥紝灏嗕俊鎭紪鐮佹垚涓€涓护鐗岋紙Token锛夛紝瀹炵幇淇℃伅鐨勫姞瀵嗕紶杈撱€侸WT涓昏鐢变笁閮ㄥ垎缁勬垚锛氬ご閮ㄣ€佽浇鑽蜂笌绛惧悕锛岃繖涓夐儴鍒嗛€氳繃鐐癸紙.锛夊瓧绗﹁繘琛屽垎闅斻€?/p>

浜屻€佸簲鐢ㄥ満鏅?/h3>

JWT解决方案学习入门指南

1. 璺ㄥ煙璁よ瘉锛氬湪涓嶅悓鐨勫煙涔嬮棿杩涜瀹夊叏璁よ瘉銆?/p>

JWT解决方案学习入门指南

2. API鎺堟潈锛氬湪API璋冪敤鏃朵娇鐢↗WT鏉ョ‘淇濊姹傛潵鑷彲淇℃潵婧愩€?/p>

JWT解决方案学习入门指南

3. 寰湇鍔℃灦鏋勶細鐢ㄤ簬寰湇鍔¢棿鐨勯€氫俊鍜岃璇併€?/p>

涓夈€丣WT鐨勭敓鎴愪笌楠岃瘉

JWT解决方案学习入门指南

锛堜竴锛塉WT鐨勭敓鎴愭楠わ細

1. 鍒涘缓Header锛氬垱寤轰竴涓寘鍚獼WT鐨勭被鍨嬪拰绠楁硶淇℃伅鐨凧SON缁撴瀯锛屽苟浣跨敤Base64 URL缂栫爜杩涜缂栫爜銆備緥濡傦細

```javascript

const header = {

alg: 'HS256',

typ: 'JWT'

};

const base64UrlHeader = btoa(JSON.stringify(header)).replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');

```

2. 鏋勯€燩ayload锛氬垱寤轰竴涓寘鍚敤鎴蜂俊鎭紙濡傜敤鎴稩D銆佽鑹茬瓑锛夌殑JSON缁撴瀯锛屽苟浣跨敤Base64 URL缂栫爜杩涜缂栫爜銆備緥濡傦細

```javascript

const payload = {

sub: '',

name: 'John Doe',

iat: Date.now() / 1000, // Unix鏃堕棿鎴筹紝琛ㄧず浠ょ墝鐨勫彂琛屾椂闂?/p>

exp: Date.now() / 1000 + 3600 // Unix鏃堕棿鎴筹紝琛ㄧず浠ょ墝鐨勮繃鏈熸椂闂?/p>

};

const base64UrlPayload = btoa(JSON.stringify(payload)).replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');

```

3. 鐢熸垚Signature锛氫娇鐢ㄦ寚瀹氱殑瀵嗛挜鍜岀畻娉曪紙濡係HA256锛夊澶撮儴鍜岃浇鑽疯繘琛屽姞瀵嗭紝鐢熸垚绛惧悕銆備緥濡傦細

```javascript

const secret = 'my_secret_key';

const signature = btoa(crypto.createHmac('sha256', secret).update(`${base64UrlHeader}.${base64UrlPayload}`).digest('base64'));

```

4. 缁勫悎骞惰繑鍥濲WT锛氬皢缂栫爜鍚庣殑澶撮儴銆佽浇鑽峰拰绛惧悕缁勫悎鎴愪竴涓畬鏁寸殑JWT锛屼緵鍚庣画浣跨敤銆備緥濡傦細

```javascript

const jwt = `${base64UrlHeader}.${base64UrlPayload}.${signature}`;

```

锛堜簩锛塉WT鐨勯獙璇佹楠わ細

浠庤姹備腑鑾峰彇Base64 URL缂栫爜鐨勫ご閮ㄣ€佽浇鑽蜂笌绛惧悕锛岃В鐮佸苟楠岃瘉Signature锛岀‘淇滼WT鏈绡℃敼銆傞獙璇佽繃绋嬮渶瑕佺敤鍒颁箣鍓嶇敓鎴怞WT鏃朵娇鐢ㄧ殑瀵嗛挜锛岄€氳繃瀵规瘮璁$畻鍑虹殑绛惧悕涓庢帴鏀跺埌鐨勭鍚嶆槸鍚︿竴鑷存潵鍒ゆ柇JWT鐨勬湁鏁堟€с€備娇鐢↗WT杩涜鐢ㄦ埛璁よ瘉涓庝細璇濈鐞?/p>

鍦ㄧ幇浠e寲鐨勫簲鐢ㄤ腑锛孞WT锛圝SON Web Tokens锛夊凡鎴愪负鐢ㄦ埛璁よ瘉涓庝細璇濈鐞嗙殑鏍囬厤鎵嬫銆傚湪鐢ㄦ埛鐧诲綍鎴愬姛鍚庯紝鏈嶅姟鍣ㄤ細杩斿洖涓€涓寘鍚敤鎴蜂俊鎭殑JWT锛岃繖涓插姞瀵嗕护鐗屼负鍚庣画鐨勯€氫俊鎻愪緵浜嗕竴涓畨鍏ㄩ€氶亾銆備笅闈紝璁╂垜浠繁鍏ョ悊瑙WT鐨勫簲鐢ㄤ互鍙婁笌鍏剁浉鍏崇殑瀹夊叏鎬ц€冭檻銆?/p>

JWT鐨勫熀鏈獙璇佹祦绋嬶細

1. 瀹㈡埛绔帴鏀跺埌鏈嶅姟鍣ㄨ繑鍥炵殑JWT鍚庯紝灏嗗叾瀛樺偍鍦ㄦ湰鍦帮紙濡侰ookie鎴朙ocalStorage锛夈€?/p>

2. 姣忔鍙戣捣璇锋眰鏃讹紝瀹㈡埛绔兘浼氬皢杩欎釜JWT宓屽叆鍒拌姹傚ご涓彂閫佺粰鏈嶅姟鍣ㄣ€?/p>

3. 鏈嶅姟鍣ㄥ湪鎺ユ敹鍒拌姹傚悗锛屼細瀵笿WT杩涜瑙g爜鍜岄獙璇併€傞獙璇佽繃绋嬩富瑕佸寘鎷В鏋怞WT鐨勫悇涓儴鍒嗭紝姣斿绛惧悕浠ョ‘淇濆叾鏈绡℃敼銆傚鏋滈獙璇侀€氳繃锛屽垯鍏佽璁块棶璧勬簮锛涘惁鍒欙紝鎷掔粷璁块棶銆?/p>

瀹夊叏瀛樺偍涓庝娇鐢↗WT鐨勫缓璁細

閬垮厤鏄庢枃浼犺緭锛氱‘淇滼WT鍦ㄤ紶杈撹繃绋嬩腑鏄姞瀵嗙殑锛屼粠鑰岄槻姝腑闂翠汉鏀诲嚮銆?/p>

闄愬埗璁块棶鑼冨洿锛氬瀹㈡埛绔殑浣跨敤鍜岃闂甁WT杩涜闄愬埗锛岀‘淇濆彧鏈夊悎娉曠殑璇锋眰鑳藉浣跨敤銆?/p>

璁剧疆杩囨湡鏃堕棿涓庡埛鏂版満鍒讹細涓篔WT璁剧疆涓€涓悎鐞嗙殑杩囨湡鏃堕棿锛屽悓鏃舵彁渚涙満鍒跺湪浠ょ墝杩囨湡鍚庤兘澶熷畨鍏ㄥ湴鍒锋柊銆?/p>

濡備綍闃叉JWT鐨勭洍鐢ㄤ笌閲嶅浣跨敤锛?/p>

浣跨敤HTTP-only鐨凜ookie锛氬皢JWT瀛樺偍鍦ㄥ畨鍏ㄧ殑Cookie涓紝闃叉JavaScript瀵瑰叾杩涜鎿嶄綔銆?/p>

鍔犲瘑瀛樺偍锛氬湪瀹㈡埛绔JWT杩涜鍔犲瘑瀛樺偍锛屽鍔犲畨鍏ㄦ€с€?/p>

绛惧悕楠岃瘉锛氭湇鍔″櫒鍦ㄦ帴鏀跺埌JWT鍚庯紝瑕佸鍏剁鍚嶈繘琛岄獙璇侊紝纭繚浠ょ墝鏈绡℃敼銆備笌鍩轰簬Session鐨勪紶缁熸柟寮忕浉姣旓紝JWT鍏锋湁鍏剁嫭鐗圭殑浼樺娍涓庨檺鍒躲€備紶缁熺殑Session鏂瑰紡渚濊禆浜庢湇鍔″櫒缁存姢瀹㈡埛绔姸鎬侊紝鑰孞WT鍒欐槸鏃犵姸鎬佺殑锛岃繖鍑忚交浜嗘湇鍔″櫒鐨勮礋杞姐€傚熀浜庡姞瀵嗙殑浠ょ墝涔熶娇寰桱WT鍏锋湁鏇撮珮鐨勫畨鍏ㄦ€с€備笉褰撶殑浣跨敤涔熷彲鑳芥毚闇叉晱鎰熶俊鎭紝鑰屽湪澶勭悊澶ч噺璇锋眰鏃讹紝鍏舵€ц兘涔熷彲鑳芥垚涓虹摱棰堛€侸WT涓虹敤鎴疯璇佷笌浼氳瘽绠$悊鎻愪緵浜嗕竴涓珮鏁堜笖瀹夊叏鐨勬柟娉曪紝浣嗕篃闇€瑕佹垜浠皑鎱庡湴澶勭悊涓庤繍鐢ㄣ€侸WT瀹炴垬婕旂粌

妗堜緥锛氬湪Node.js涓阀濡欒繍鐢↗WT璁よ瘉

棰嗙暐JWT鍦∟ode.js涓殑榄呭姏锛佽鎴戜滑鐪嬬湅濡備綍鍦ㄥ鎴风鐢熸垚骞跺彂閫丣WT銆?/p>

寮曞叆蹇呰鐨勬ā鍧楋細

```javascript

const jwt = require('jsonwebtoken');

const secretKey = 'my_secret_key'; // 璇风‘淇濅娇鐢ㄩ殢鏈恒€佸鏉傜殑瀵嗛挜

```

鐧诲綍鍚庯紝鍒涘缓JWT杞借嵎骞剁鍚嶏細

```javascript

const jwtPayload = {

user_id: 12345,

username: 'john_doe'

};

const jwtToken = jwt.sign(jwtPayload, secretKey, { expiresIn: '1h' });

```

鍦ㄨ姹傚ご涓坊鍔燗uthorization淇℃伅锛?/p>

```javascript

const headers = {

Authorization: `Bearer ${jwtToken}`

};

```

浣跨敤fetch鍙戦€佽姹傦紝楠岃瘉韬唤锛?/p>

```javascript

fetch('example.com/api', { headers })

.then(response => response.json())

.then(data => console.log(data))

.catch(error => console.error(error));

```

鎺ヤ笅鏉ワ紝杞埌鏈嶅姟绔紝瑙f瀽骞堕獙璇丣WT锛?/p>

```javascript

// 寮曞叆蹇呰鐨勬ā鍧楀苟鍑嗗瀵嗛挜

const jwt = require('jsonwebtoken');

const secretKey = 'my_secret_key'; // 纭繚鏈嶅姟绔娇鐢ㄧ浉鍚岀殑瀵嗛挜杩涜楠岃瘉

```鏈嶅姟绔幏鍙朖WT鍚庤繘琛岄獙璇佸拰瑙f瀽锛?楠岃瘉澶辫触鍒欐姏鍑洪敊璇紝鎴愬姛鍒欏鐞嗙敤鎴蜂俊鎭拰涓氬姟閫昏緫銆傝В鏋怞WT锛氬皢浼犲叆鐨凧WT浠ょ墝浣跨敤瀵嗛挜杩涜楠岃瘉骞惰幏鍙栬В鐮佸悗鐨勪俊鎭€傚鏋滈獙璇佸け璐ワ紝杈撳嚭閿欒淇℃伅锛涘惁鍒欙紝杈撳嚭鐢ㄦ埛淇℃伅骞惰繘琛屽悗缁殑涓氬姟閫昏緫澶勭悊銆傛帴涓嬫潵璁╂垜浠簡瑙WT鐨勫畨鍏ㄥ疄璺点€傚浣曞簲瀵瑰父瑙侀棶棰橈紵JWT瀹夊叏瀹炶返涓庡父瑙侀棶棰樿В鏋愷煂熷畨鍏ㄦ渶浣冲疄璺碉細濡備綍瀹堟姢鎮ㄧ殑JWT瀹夊叏锛燄煂熺‘淇濆瘑閽ョ鐞嗗畨鍏紝閬垮厤娉勯湶椋庨櫓銆傚疄鏂藉畨鍏ㄧ殑绛惧悕楠岃瘉鍜屽唴瀹瑰姞瀵嗙瓥鐣ャ€傚悎鐞嗛€夋嫨JWT鐨勮繃鏈熸椂闂达紝纭繚涓嶄細杩囬暱鎴栬繃鐭€傚父瑙侀棶棰樺強瑙e喅绛栫暐閽堝瀹夊叏鎬ч棶棰橈紝濮嬬粓浣跨敤HTTPS浼犺緭浠ヤ繚璇佹暟鎹紶杈撶殑瀹夊叏鎬с€傞拡瀵规€ц兘闂锛屽彲閫氳繃闄愬埗JWT鐨勬湁鏁堟椂闂淬€佸悎鐞嗚璁$紦瀛樼瓥鐣ョ瓑鏂瑰紡鏉ヤ紭鍖栥€傚湪瀹炴柦鏃讹紝瑕佺‘淇濇柊鏃х郴缁熺殑鍏煎鎬э紝閬垮厤鍥犱负杩囧害婵€杩涚殑鎿嶄綔瀵艰嚧绯荤粺宕╂簝鎴栨暟鎹涪澶便€傞€氳繃鏈枃鐨勫涔狅紝鎮ㄥ凡缁忔帉鎻′簡濡備綍鍦ㄩ」鐩腑瀹夊叏鍦板簲鐢↗WT杩涜韬唤楠岃瘉鐨勬柟娉曘€傝鎴戜滑涓€璧疯繄鍚慗WT鐨勫箍闃斾笘鐣屽惂锛?/p>

文章从网络整理,文章内容不代表本站观点,转账请注明【蓑衣网】

本文链接:https://www.baoguzi.com/67281.html

JWT解决方案学习入门指南 | 分享给朋友: