கோணத்தைப்

Gerald Girard

செவ்வாய், 8 அக்டோபர், 2024 ’அன்று’ பிற்பகல் 1:55:58

கோண பயன்பாடுகளில் ஐஃப்ரேம் ரீலோடுகளைக் கையாளுதல்
நவீன வலை வளர்ச்சியில், ஒரு PHP பக்கம் போன்ற வெளிப்புற பயன்பாடுகளை ஒரு கோண திட்டத்திற்குள் iframe மூலம் உட்பொதிப்பது ஒரு பொதுவான அணுகுமுறையாகும். இருப்பினும், அந்த iframe க்குள் நிகழ்வுகள் அல்லது பக்கம் மீண்டும் ஏற்றப்படுவதைக் கண்காணிக்க முயற்சிக்கும் போது, குறிப்பாக PHP திட்டத்தின் குறியீட்டை நீங்கள் அணுகாதபோது சவால்களை இது அறிமுகப்படுத்துகிறது.
iframe உள்ளடக்கம் புதுப்பிக்கப்படும் போதெல்லாம், உங்கள் கோணப் பயன்பாட்டில் ஏற்றுதல் ஸ்பின்னரைக் காண்பிக்க வேண்டியிருக்கும் போது இதுபோன்ற ஒரு சவால் எழுகிறது. நீங்கள் PHP குறியீட்டை மாற்ற முடியாது என்பதால், ஐஃப்ரேம் உள்ளடக்கத்தில் மறுஏற்றங்கள் அல்லது மாற்றங்களைக் கண்டறிவது தந்திரமானதாக இருக்கும். ஜாவாஸ்கிரிப்ட் பக்கத்திலிருந்து iframe இல் ஏற்படும் மாற்றங்களைக் கண்காணிப்பதற்கான வழியைக் கண்டுபிடிப்பதே முக்கியமானது.
HTTP கோரிக்கைகள் அல்லது மறுஏற்றம் போன்ற நிகழ்வுகளைக் கேட்கும் iframe இல் ஸ்கிரிப்டை உட்செலுத்துவது சாத்தியமா என்று பல டெவலப்பர்கள் ஆச்சரியப்படுகிறார்கள், குறிப்பாக நீங்கள் குறியீட்டின் மீது நேரடிக் கட்டுப்பாடு இல்லாத திட்டத்திலிருந்து iframe பெறப்பட்டால். உங்கள் கோண பயன்பாட்டில் ஜாவாஸ்கிரிப்ட் மூலம் இதைச் செய்ய முடியும்.
இக்கட்டுரையில், iframe இல் உள்ள PHP பக்கம் எப்போது மீண்டும் ஏற்றப்படுகிறது என்பதைக் கண்டறிவதற்கான சாத்தியமான தீர்வுகளை ஆராய்வோம், மேலும் அத்தகைய மாற்றங்களுக்கு பதிலளிக்கும் வகையில் ஏற்றுதல் ஸ்பின்னரை எவ்வாறு செயல்படுத்தலாம். PHP குறியீட்டிற்கான அணுகல் உங்களிடம் இல்லை என்றாலும், JavaScript ஆக்கபூர்வமான தீர்வுகளை வழங்க முடியும்.

கட்டளை பயன்பாட்டின் உதாரணம்

contentWindow iframe இன் விண்டோ ஆப்ஜெக்ட்டை அணுகுகிறது, இதன் மூலம் நீங்கள் பெற்றோர் சாளரத்தில் இருந்து iframe இன் DOM இல் ஸ்கிரிப்ட்களை கையாள அல்லது புகுத்த அனுமதிக்கிறது. எடுத்துக்காட்டு: const iframe = document.querySelector("iframe").contentWindow;

addEventListener("load") iframe லோடிங் அல்லது ரீலோடிங் முடிந்ததும் சுடும் நிகழ்வு கேட்பவரைப் பதிவு செய்கிறது. iframe உள்ளடக்கம் மாறும்போது கண்காணிப்பதற்கு பயனுள்ளதாக இருக்கும். எடுத்துக்காட்டு: iframe.addEventListener("load", function() {...});

postMessage ஒரு iframe மற்றும் அதன் பெற்றோர் சாளரத்திற்கு இடையே பாதுகாப்பான தகவல்தொடர்புகளை இயக்குகிறது, செய்திகளை முன்னும் பின்னுமாக அனுப்ப அனுமதிக்கிறது. எடுத்துக்காட்டு: parent.postMessage("iframeReloaded", "*");

XMLHttpRequest.prototype.open நெட்வொர்க் கோரிக்கைகள் எப்போது செய்யப்படுகின்றன என்பதைக் கண்டறிய XMLHttpRequest இன் இயல்புநிலை நடத்தையை மீறுகிறது. iframe இல் HTTP கோரிக்கை தூண்டப்படும் போதெல்லாம் தனிப்பயன் லாஜிக்கை உட்செலுத்துவதற்கு உதவியாக இருக்கும். எடுத்துக்காட்டு: XMLHttpRequest.prototype.open = செயல்பாடு() {...};

fetch ஜாவாஸ்கிரிப்ட் ஃபெட்ச் API ஐ இடைமறித்து, HTTP கோரிக்கைகளை உருவாக்க, பிணைய கோரிக்கை செயலில் இருக்கும்போது ஸ்பின்னரைக் காண்பிக்கும். எடுத்துக்காட்டு: window.fetch = செயல்பாடு() {...};

createElement DOM இல் ஒரு புதிய HTML உறுப்பை மாறும் வகையில் உருவாக்குகிறது. இது iframe இன் ஆவணத்தில் ஸ்கிரிப்டுகள் அல்லது பிற உறுப்புகளை உட்செலுத்த பயன்படுகிறது. எடுத்துக்காட்டு: const script = iframe.document.createElement('script');

appendChild iframe இன் DOM மரத்தில் ஒரு புதிய முனையை (ஸ்கிரிப்ட் அல்லது div போன்றவை) சேர்க்கிறது, இது iframe இல் ஜாவாஸ்கிரிப்டை உட்செலுத்த அனுமதிக்கிறது. எடுத்துக்காட்டு: iframe.document.body.appendChild(script);

window.onload iframe இன் பக்கம் முழுமையாக ஏற்றப்பட்டவுடன் ஒரு செயல்பாட்டைச் செயல்படுத்துகிறது, iframe மறுஏற்றத்தை நிறைவு செய்யும் போது அறிவிப்புகளை இயக்குகிறது. எடுத்துக்காட்டு: window.onload = செயல்பாடு() {...};

style.display அவற்றின் CSS காட்சிப் பண்புகளை மாற்றுவதன் மூலம் HTML உறுப்புகளின் (ஸ்பின்னர்கள் போன்றவை) தெரிவுநிலையைக் கையாளுகிறது. பக்க சுமைகளின் போது ஸ்பின்னர் தெரிவுநிலையை மாற்றுவதற்கு பயனுள்ளதாக இருக்கும். எடுத்துக்காட்டு: document.getElementById("spinner").style.display = "block";

கட்டளை	பயன்பாட்டின் உதாரணம்
contentWindow	iframe இன் விண்டோ ஆப்ஜெக்ட்டை அணுகுகிறது, இதன் மூலம் நீங்கள் பெற்றோர் சாளரத்தில் இருந்து iframe இன் DOM இல் ஸ்கிரிப்ட்களை கையாள அல்லது புகுத்த அனுமதிக்கிறது. எடுத்துக்காட்டு: const iframe = document.querySelector("iframe").contentWindow;
addEventListener("load")	iframe லோடிங் அல்லது ரீலோடிங் முடிந்ததும் சுடும் நிகழ்வு கேட்பவரைப் பதிவு செய்கிறது. iframe உள்ளடக்கம் மாறும்போது கண்காணிப்பதற்கு பயனுள்ளதாக இருக்கும். எடுத்துக்காட்டு: iframe.addEventListener("load", function() {...});
postMessage	ஒரு iframe மற்றும் அதன் பெற்றோர் சாளரத்திற்கு இடையே பாதுகாப்பான தகவல்தொடர்புகளை இயக்குகிறது, செய்திகளை முன்னும் பின்னுமாக அனுப்ப அனுமதிக்கிறது. எடுத்துக்காட்டு: parent.postMessage("iframeReloaded", "*");
XMLHttpRequest.prototype.open	நெட்வொர்க் கோரிக்கைகள் எப்போது செய்யப்படுகின்றன என்பதைக் கண்டறிய XMLHttpRequest இன் இயல்புநிலை நடத்தையை மீறுகிறது. iframe இல் HTTP கோரிக்கை தூண்டப்படும் போதெல்லாம் தனிப்பயன் லாஜிக்கை உட்செலுத்துவதற்கு உதவியாக இருக்கும். எடுத்துக்காட்டு: XMLHttpRequest.prototype.open = செயல்பாடு() {...};
fetch	ஜாவாஸ்கிரிப்ட் ஃபெட்ச் API ஐ இடைமறித்து, HTTP கோரிக்கைகளை உருவாக்க, பிணைய கோரிக்கை செயலில் இருக்கும்போது ஸ்பின்னரைக் காண்பிக்கும். எடுத்துக்காட்டு: window.fetch = செயல்பாடு() {...};
createElement	DOM இல் ஒரு புதிய HTML உறுப்பை மாறும் வகையில் உருவாக்குகிறது. இது iframe இன் ஆவணத்தில் ஸ்கிரிப்டுகள் அல்லது பிற உறுப்புகளை உட்செலுத்த பயன்படுகிறது. எடுத்துக்காட்டு: const script = iframe.document.createElement('script');
appendChild	iframe இன் DOM மரத்தில் ஒரு புதிய முனையை (ஸ்கிரிப்ட் அல்லது div போன்றவை) சேர்க்கிறது, இது iframe இல் ஜாவாஸ்கிரிப்டை உட்செலுத்த அனுமதிக்கிறது. எடுத்துக்காட்டு: iframe.document.body.appendChild(script);
window.onload	iframe இன் பக்கம் முழுமையாக ஏற்றப்பட்டவுடன் ஒரு செயல்பாட்டைச் செயல்படுத்துகிறது, iframe மறுஏற்றத்தை நிறைவு செய்யும் போது அறிவிப்புகளை இயக்குகிறது. எடுத்துக்காட்டு: window.onload = செயல்பாடு() {...};
style.display	அவற்றின் CSS காட்சிப் பண்புகளை மாற்றுவதன் மூலம் HTML உறுப்புகளின் (ஸ்பின்னர்கள் போன்றவை) தெரிவுநிலையைக் கையாளுகிறது. பக்க சுமைகளின் போது ஸ்பின்னர் தெரிவுநிலையை மாற்றுவதற்கு பயனுள்ளதாக இருக்கும். எடுத்துக்காட்டு: document.getElementById("spinner").style.display = "block";

ஐஃப்ரேம் ரீலோடுகளை கோணத்தில் கண்டறிவதற்கான தீர்வுகளை ஆராய்தல்

முதல் ஸ்கிரிப்டில், முக்கிய யோசனை கேட்க வேண்டும் iframe இன் நிகழ்வு. ஒவ்வொரு முறையும் iframe இன் உள்ளடக்கம் மாறும்போது அல்லது மீண்டும் ஏற்றப்படும்போது ஏற்ற நிகழ்வு தூண்டப்படும். இந்த நிகழ்வைப் பயன்படுத்துவதன் மூலம், iframe க்குள் இருக்கும் PHP பக்கம் எப்போது புதுப்பிக்கப்படுகிறது என்பதைக் கண்டறியலாம். துவக்கத்தில், செயல்பாட்டை அழைப்பதன் மூலம் ஏற்றுதல் ஸ்பின்னர் காட்டப்படுகிறது . iframe உள்ளடக்கம் முழுமையாக ஏற்றப்பட்டதும், தி ஸ்பின்னரை மறைக்க செயல்பாடு அழைக்கப்படுகிறது. PHP குறியீட்டிற்கான அணுகல் தேவையில்லை, மேலும் iframe இன் நிலையை நம்பியிருப்பதால் இந்த முறை மிகவும் திறமையானது.

இரண்டாவது தீர்வு ஜாவாஸ்கிரிப்டை நேரடியாக iframe இல் செலுத்துவதன் மூலம் மிகவும் மேம்பட்ட அணுகுமுறையை எடுக்கிறது. iframe-ஐ அணுகுவதன் மூலம் , iframe இன் DOM இல் ஸ்கிரிப்ட் உறுப்பை நாம் மாறும் வகையில் உருவாக்கலாம் மற்றும் செருகலாம். இந்த ஸ்கிரிப்ட் ஐஃப்ரேமுக்குள் PHP பக்கத்தால் தொடங்கப்பட்ட எந்த HTTP கோரிக்கைகளையும், இரண்டையும் பயன்படுத்தி கண்காணிக்கும் மற்றும் தி . ஐஃப்ரேமுக்குள் நெட்வொர்க் செயல்பாட்டைக் கண்காணிப்பதும், அத்தகைய செயல்பாடு ஏதேனும் நிகழும்போது ஏற்றுதல் ஸ்பின்னரைக் காண்பிப்பதும் இங்கு குறிக்கோளாகும். இந்த அணுகுமுறை HTTP கோரிக்கைகள் செய்யப்படும் சரியான தருணத்தைக் கண்காணிப்பதன் மூலம் அதிக நுண்ணிய கட்டுப்பாட்டை வழங்குகிறது.

மூன்றாவது முறை பலப்படுத்துகிறது API, இது iframe மற்றும் பெற்றோர் கோண பயன்பாட்டிற்கு இடையே தொடர்பு கொள்ள அனுமதிக்கிறது. இந்த நிலையில், iframe ஏற்றுதல் முடிக்கும் போதெல்லாம் பெற்றோருக்கு ஒரு செய்தியை அனுப்புகிறது. பெற்றோர் சாளரம் இந்த செய்திகளைக் கேட்கிறது மற்றும் அதற்கேற்ப ஸ்பின்னரைக் காட்டுகிறது அல்லது மறைக்கிறது. postMessage ஐப் பயன்படுத்துவதன் நன்மை என்னவென்றால், iframe இன் உள் குறியீட்டிற்கான அணுகல் உங்களிடம் இல்லாவிட்டாலும் கூட, விண்டோக்களுக்கு இடையே தகவல்களைப் பரிமாறிக்கொள்ள இது ஒரு பாதுகாப்பான வழியாகும். பெற்றோர் மற்றும் iframe வெவ்வேறு டொமைன்களில் இருந்து வரும் கிராஸ்-ஆரிஜின் ஐஃப்ரேம்களுக்கு இது சிறந்தது.

இந்த தீர்வுகள் ஒவ்வொன்றும் அதன் பலங்களைக் கொண்டுள்ளன, மேலும் முறையின் தேர்வு உங்களுக்குத் தேவையான கட்டுப்பாட்டின் நிலை மற்றும் iframe இன் நடத்தை ஆகியவற்றைப் பொறுத்தது. லோட் ஈவென்ட் லிஸனர் எளிமையானது ஆனால் முழு ரீலோடுகளைக் கண்டறிய மட்டுமே வேலை செய்கிறது. iframe இல் ஒரு ஸ்கிரிப்டை உட்செலுத்துவது அதன் செயல்பாட்டைப் பற்றிய விரிவான நுண்ணறிவுகளை அளிக்கிறது ஆனால் ஸ்கிரிப்ட் செருகலை அனுமதிக்க iframe தேவைப்படுகிறது. இறுதியாக, தி முறையானது குறுக்கு-டொமைன் தொடர்பைக் கையாள்வதற்கான ஒரு வலுவான தீர்வாகும் மற்றும் குறிப்பிட்ட iframe நிகழ்வுகளைப் பற்றி பெற்றோருக்கு தெரிவிக்க முடியும். இந்த முறைகள் PHP குறியீட்டிற்கான நேரடி அணுகல் தேவையில்லாமல் iframe நிலை மாற்றங்களைக் கையாள நெகிழ்வான வழிகளை வழங்குகின்றன.

தீர்வு 1: "லோட்" நிகழ்வைப் பயன்படுத்தி iframe மறுஏற்றத்தைக் கண்காணித்தல்

இந்த தீர்வு, iframe இன் "லோட்" நிகழ்வைக் கேட்க JavaScript ஐப் பயன்படுத்துகிறது, iframe எப்போது மீண்டும் ஏற்றப்படுகிறது அல்லது உள்ளடக்கத்தை மாற்றுகிறது என்பதைக் கண்டறியும்.

// Select the iframe element by its ID or query selector
const iframe = document.getElementById("myIframe");
// Function to display the spinner
function showSpinner() {
  document.getElementById("spinner").style.display = "block";
}
// Function to hide the spinner
function hideSpinner() {
  document.getElementById("spinner").style.display = "none";
}
// Add event listener for the iframe's load event
iframe.addEventListener("load", function() {
  hideSpinner();
});
// Display the spinner initially before iframe reload completes
showSpinner();
// HTML: Loading spinner (CSS or image-based)
<div id="spinner" style="display: none;">Loading...</div>

தீர்வு 2: பிணைய கோரிக்கைகளை கண்காணிப்பதற்காக ஜாவாஸ்கிரிப்டை iframe இல் செலுத்துதல்

இந்த முறை ஏதேனும் HTTP கோரிக்கைகள் அல்லது ரீலோட்களைக் கண்டறிய iframe இல் ஒரு ஸ்கிரிப்டை உட்செலுத்துகிறது, iframe இல் இருந்து பக்க மாற்றங்கள் அல்லது மறுஏற்றங்களை நீங்கள் கண்காணிக்க வேண்டியிருக்கும் போது பயனுள்ளதாக இருக்கும்.

// Access the iframe's content window
const iframe = document.querySelector("iframe").contentWindow;
// Create a script to inject into the iframe
const script = iframe.document.createElement('script');
// JavaScript to track network requests
script.textContent = `
  (function() {
    const oldFetch = window.fetch;
    window.fetch = function() {
      document.querySelector('#spinner').style.display = 'block';
      return oldFetch.apply(this, arguments);
    };
    const oldXHR = window.XMLHttpRequest;
    XMLHttpRequest.prototype.open = function() {
      document.querySelector('#spinner').style.display = 'block';
      oldXHR.open.apply(this, arguments);
    };
  })();`;
// Append the script to the iframe's document
iframe.document.body.appendChild(script);

தீர்வு 3: iframe மற்றும் பெற்றோர் இடையே தொடர்பு கொள்ள postMessage ஐப் பயன்படுத்துதல்

இந்த அணுகுமுறை iframe மற்றும் பெற்றோர் சாளரத்திற்கு இடையே தொடர்பு கொள்ள "postMessage" API ஐப் பயன்படுத்துகிறது, iframe இல் ஏதேனும் மறுஏற்றம் அல்லது மாற்றங்களை பெற்றோருக்கு தெரிவிக்கும்.

// Parent script (Angular application)
const iframe = document.querySelector("iframe");
// Listen for messages from the iframe
window.addEventListener("message", function(event) {
  if (event.data === "iframeReloaded") {
    document.getElementById("spinner").style.display = "none";
  }
});
// Iframe script to post a message on reload
const iframeScript = document.createElement('script');
iframeScript.textContent = `
  window.onload = function() {
    parent.postMessage("iframeReloaded", "*");
  };`;
// Inject the script into the iframe
iframe.contentWindow.document.body.appendChild(iframeScript);

கோணத்தில் ஐஃப்ரேம் மாற்றங்களைக் கண்காணிப்பதற்கான மேம்பட்ட நுட்பங்கள்

ஐஃப்ரேமில் ஏற்படும் மாற்றங்களைக் கண்டறிவதற்கான மற்றொரு சுவாரஸ்யமான நுட்பம் ஐப் பயன்படுத்துவது API. புதிய முனைகள் சேர்க்கப்படும்போது அல்லது அகற்றப்படும்போது, DOM ட்ரீயில் ஏற்படும் மாற்றங்களைக் கண்காணிக்க இந்த API உங்களை அனுமதிக்கிறது. PHP பக்கம் மீண்டும் ஏற்றப்படும் போது இது உங்களுக்கு நேரடியாகத் தெரிவிக்காது என்றாலும், iframe இன் உள்ளடக்கத்தில் ஏற்படும் மாற்றங்களைக் கண்டறிய இது உதவும். எடுத்துக்காட்டாக, iframe இல் உள்ள சில கூறுகள் மாற்றப்பட்டால் அல்லது மறுஏற்றத்திற்குப் பிறகு புதுப்பிக்கப்பட்டால், தி பிறழ்வு கண்காணிப்பாளர் அந்த மாற்றங்களைப் பிடித்து அதற்கேற்ப ஸ்பின்னரைத் தூண்டலாம்.

கூடுதலாக, உலாவி நிகழ்வுகளை மேம்படுத்துதல் அல்லது iframe எப்போது மீண்டும் ஏற்றப்படும் என்பதைக் கண்டறிய உதவும். பக்கம் இறக்கப்படும் போது அல்லது தற்போதைய பக்கத்திலிருந்து ஒரு வழிசெலுத்தல் தொடங்கும் போது இந்த நிகழ்வுகள் சுடப்படும். iframe இல் இந்த நிகழ்வுகளுக்கு நிகழ்வு கேட்பவர்களைச் சேர்ப்பதன் மூலம், ஸ்பின்னர் சரியான நேரத்தில் காட்டப்படுவதை உறுதிசெய்து, மறுஏற்றம் நிகழவுள்ளதாக பெற்றோர் சாளரத்திற்குத் தெரிவிக்கலாம். இந்த முறை மற்ற அணுகுமுறைகளுடன் இணைந்து, ஒரு விரிவான தீர்வை வழங்கும் போது சிறப்பாக செயல்படுகிறது.

கடைசியாக, மாற்றங்களைச் சரிபார்க்க iframe வாக்கெடுப்பை ஒரு முறையாகப் பயன்படுத்துவதை நீங்கள் பரிசீலிக்கலாம். இந்த முறையில், பெற்றோர் கோண பயன்பாடு அவ்வப்போது சரிபார்க்கிறது உள்ளடக்கம் மாறியதா அல்லது மீண்டும் ஏற்றப்பட்டதா என்பதைத் தீர்மானிக்க, iframe இல் உள்ள URL அல்லது பிற குறிப்பிட்ட கூறுகள். இந்த அணுகுமுறை குறைவான செயல்திறன் கொண்டதாக இருந்தாலும், குறிப்பாக செயல்திறனின் அடிப்படையில், மற்ற முறைகள் சாத்தியமில்லாத போது இது ஒரு பின்னடைவு விருப்பமாகும். எதிர்மறையானது என்னவென்றால், வாக்கெடுப்பு அனைத்து பக்க மாற்றங்களையும் கண்டறிய முடியாது, ஆனால் குறிப்பிட்ட சூழ்நிலைகளுக்கு இன்னும் பயனுள்ளதாக இருக்கும்.

iframe மறுஏற்றத்தை நான் எவ்வாறு கண்டறிவது?
நீங்கள் பயன்படுத்தலாம் ஒரு iframe மீண்டும் ஏற்றப்படும் போது அல்லது அதன் உள்ளடக்கம் மாறும்போது கண்டறியும் நிகழ்வு.
iframe இல் நெட்வொர்க் கோரிக்கைகளை கண்காணிக்க முடியுமா?
ஆம், iframe இல் ஸ்கிரிப்டை உட்செலுத்துவதன் மூலம், நீங்கள் மேலெழுதலாம் மற்றும் HTTP கோரிக்கைகளை கண்காணிப்பதற்கான முறைகள்.
iframe மற்றும் parent window இடையே தொடர்பு கொள்ள postMessage ஐப் பயன்படுத்தலாமா?
ஆம், தி ஏபிஐ, iframe மற்றும் அதன் பெற்றோர் சாளரத்திற்கு இடையே பாதுகாப்பான தகவல்தொடர்புகளை அனுமதிக்கிறது, அவற்றுக்கிடையே செய்தி அனுப்ப உதவுகிறது.
ஐஃப்ரேமில் ஜாவாஸ்கிரிப்டைச் செலுத்த முடியாவிட்டால் என்ன செய்வது?
ஜாவாஸ்கிரிப்டை உட்செலுத்துவதற்கான அணுகல் உங்களிடம் இல்லையென்றால், இதைப் பயன்படுத்தவும் API அல்லது iframe இல் இருந்து வரும் முறை (அது ஆதரிக்கும் பட்சத்தில்) சாத்தியமான மாற்றுகளாகும்.
ஐஃப்ரேம் மாற்றங்களைக் கண்டறிய MutationObserver எவ்வாறு உதவுகிறது?
தி DOM இல் ஏற்படும் மாற்றங்களை API கண்காணிக்கிறது, மறுஏற்றத்திற்குப் பிறகு iframe இல் உள்ள கூறுகள் மாறும்போது இது உங்களை எச்சரிக்கும்.

அடிப்படையான PHP குறியீட்டிற்கான நேரடி அணுகல் இல்லாமல் iframe ரீலோடுகளை கண்காணிப்பதை ஆக்கப்பூர்வமான JavaScript தீர்வுகள் மூலம் அடையலாம். நிகழ்வு கேட்பவர்கள், உட்செலுத்தப்பட்ட ஸ்கிரிப்டுகள் அல்லது போஸ்ட்மெசேஜ் API ஐப் பயன்படுத்தினாலும், டெவலப்பர்கள் தங்கள் கோண பயன்பாடுகள் பதிலளிக்கக்கூடியதாக இருப்பதை உறுதி செய்வதற்கான விருப்பங்களைக் கொண்டுள்ளனர்.

திட்டத்தின் சிக்கலான தன்மை மற்றும் iframe மீதான கட்டுப்பாட்டைப் பொறுத்து ஒவ்வொரு அணுகுமுறைக்கும் அதன் பலம் உள்ளது. உங்கள் குறிப்பிட்ட வழக்குக்கான சிறந்த தீர்வைப் பயன்படுத்துவதன் மூலம், iframe உள்ளடக்க மாற்றங்களின் போது நம்பகமான ஸ்பின்னர் அறிவிப்புகள் மூலம் சிறந்த பயனர் அனுபவத்தை வழங்கலாம்.

ஐஃப்ரேம் நிகழ்வுகள் மற்றும் குறுக்கு மூல தகவல்தொடர்புகளை கண்காணிப்பதற்கான விரிவான ஆவணங்களை இங்கே காணலாம் MDN Web Docs - postMessage API .
DOM மாற்றங்களுக்கு MutationObserver ஐப் பயன்படுத்துவது பற்றிய கூடுதல் தகவலுக்கு, பார்க்கவும் MDN வெப் டாக்ஸ் - MutationObserver .
ஐஃப்ரேம்களில் ஜாவாஸ்கிரிப்டைச் செலுத்துவதற்கான நுட்பங்களை ஆராய, இந்த ஆதாரத்தைப் பார்க்கவும் StackOverflow - JavaScript ஐ iframe இல் செலுத்தவும் .

கோணத்தைப் பயன்படுத்தி ஒரு இஃப்ரேமில் PHP பக்கத்தை மீண்டும் ஏற்றுவதைக் கண்டறிதல்

ஐஃப்ரேம் ரீலோடுகளை கோணத்தில் கண்டறிவதற்கான தீர்வுகளை ஆராய்தல்

தீர்வு 1: "லோட்" நிகழ்வைப் பயன்படுத்தி iframe மறுஏற்றத்தைக் கண்காணித்தல்

தீர்வு 2: பிணைய கோரிக்கைகளை கண்காணிப்பதற்காக ஜாவாஸ்கிரிப்டை iframe இல் செலுத்துதல்

தீர்வு 3: iframe மற்றும் பெற்றோர் இடையே தொடர்பு கொள்ள postMessage ஐப் பயன்படுத்துதல்

கோணத்தில் ஐஃப்ரேம் மாற்றங்களைக் கண்காணிப்பதற்கான மேம்பட்ட நுட்பங்கள்