બે PWA વચ્ચે સાઇન્ડ ટોકન (Signed Token): બેકએન્ડ વગર HMAC-SHA256

તમારે એક PWA માંથી બીજા PWA માં યુઝરની ઓળખ (user identity) પાસ કરવાની જરૂર છે. બંને એપ્સ અલગ-અલગ Firebase પ્રોજેક્ટ્સ પર ચાલે છે. તેઓ કોઈ ડેટાબેઝ શેર કરતા નથી. તેઓ કોઈ ઓથેન્ટિકેશન (authentication) શેર કરતા નથી.

તમે બેકએન્ડ કોડ લખ્યા વગર આ સમસ્યાનો ઉકેલ લાવી શકો છો. તમારે ફક્ત બ્રાઉઝરની Web Crypto API અને એક સાઇન્ડ URL (signed URL) ની જરૂર છે.

સમસ્યા: PanelControl નામનું એક ઇન્ટરનલ ટૂલ Orders નામની બીજી સાઇટ ખોલવા માંગે છે. જ્યારે યુઝર બટન પર ક્લિક કરે છે, ત્યારે Orders સાઇટે યુઝર કોણ છે તે જાણવું જોઈએ. યુઝરે બીજી વાર લોગિન કરવાની જરૂર ન હોવી જોઈએ.

આ કરવા માટેના ત્રણ રસ્તા:

  • Shared Firebase: આ માટે શેર કરેલા ડેટાબેઝની જરૂર પડે છે. અહીં તે શક્ય નથી.
  • postMessage: આ માટે સમાન ડોમેન અથવા પોપઅપ (popup) ની જરૂર પડે છે. તેને મેનેજ કરવું અઘરું છે.
  • HMAC signed URL: ટોકન સાથેની લિંકનો ઉપયોગ કરો. આ પદ્ધતિ ઉત્તમ રીતે કામ કરે છે.

તે કેવી રીતે કામ કરે છે: HMAC એક સિક્રેટ કી (secret key) નો ઉપયોગ કરીને સિગ્નેચર બનાવે છે. રિસીવર (receiver) તે જ કીનો ઉપયોગ કરીને સિગ્નેચર તપાસે છે. જો બંને મેચ થાય, તો સેન્ડર (sender) પર વિશ્વાસ કરી શકાય છે.

વર્કફ્લો:

  1. સેન્ડર સાઇડ (Sender side):
  • યુઝરનું નામ અને ટાઇમસ્ટેમ્પ (timestamp) સાથે પેલોડ (payload) બનાવો.
  • HMAC-SHA256 નો ઉપયોગ કરીને પેલોડ પર સિગ્નેચર કરો.
  • URL માં સિગ્નેચર અને પેલોડ ઉમેરો.
  1. રિસીવર સાઇડ (Receiver side):
  • URL માંથી ટોકન વાંચો.
  • પેલોડમાંથી સિગ્નેચરને અલગ કરો.
  • શેર કરેલી સિક્રેટ કીનો ઉપયોગ કરીને ફરીથી સિગ્નેચરની ગણતરી કરો.
  • તપાસો કે ટોકન એક્સપાયર (expire) તો નથી થઈ ગયું ને (દા.ત. 5 મિનિટ પછી).
  • જો માન્ય હોય, તો એપમાં યુઝરની ઓળખ સેટ કરો.

ઇમ્પ્લીમેન્ટેશન વિગતો: Web Crypto API તમામ આધુનિક બ્રાઉઝર્સમાં નેટિવ (native) છે. તે ArrayBuffer સાથે કામ કરે છે અને તેના માટે કોઈ વધારાની લાઇબ્રેરીની જરૂર નથી.

વસ્તુઓને વ્યવસ્થિત રાખવા માટે, રિસીવર સ્ક્રિપ્ટ ડોક્યુમેન્ટના head માં ચાલે છે. તે ટોકન વેરિફાય કરે છે, સમય તપાસે છે, અને તરત જ history.replaceState નો ઉપયોગ કરીને URL ને ક્લીન કરે છે. આનાથી બ્રાઉઝર બારમાંથી ટોકન નીકળી જાય છે જેથી તે છુપાયેલું રહે.

સુરક્ષા વિશે નોંધ: સિક્રેટ કી ક્લાયન્ટ કોડમાં હોય છે. DevTools નો ઉપયોગ કરનાર કોઈપણ વ્યક્તિ તેને જોઈ શકે છે. આ આંતરિક બિઝનેસ ટૂલ્સ માટે ઠીક છે જ્યાં તમે ફક્ત નામ જેવો નોન-સેન્સિટિવ (non-sensitive) ડેટા પાસ કરો છો.

જો તમે સેન્સિટિવ ડેટા ધરાવતી પબ્લિક એપ બનાવો છો, તો તેના બદલે સર્વર-સાઇડ ટોકનનો ઉપયોગ કરો. ઇન્ટરનલ ટૂલ્સ માટે, આ ક્લાયન્ટ-ઓન્લી પદ્ધતિ ઝડપી અને અસરકારક છે.

કોઈ વધારાનું ઇન્ફ્રાસ્ટ્રક્ચર નહીં. કોઈ વધારાના ડેટાબેઝ નહીં. ફક્ત નેટિવ બ્રાઉઝર ટૂલ્સ.

Source: https://dev.to/androve2k/signed-token-between-two-pwas-hmac-sha256-with-no-backend-3jod