Beschrijving
Gebruik de chrome.devtools.inspectedWindow API om te interageren met het geïnspecteerde venster: verkrijg de tab-ID voor de geïnspecteerde pagina, evalueer de code in de context van het geïnspecteerde venster, herlaad de pagina of verkrijg de lijst met resources binnen de pagina.
Zie het overzicht van de DevTools API's voor een algemene introductie tot het gebruik van de Developer Tools API's.
De eigenschap tabId geeft de tab-ID weer die u kunt gebruiken met de chrome.tabs.* ` API-aanroepen. Houd er echter rekening mee dat chrome.tabs.* ` API vanwege beveiligingsredenen niet beschikbaar is op de pagina's van de ontwikkelaarstools. U moet de tab-ID doorgeven aan de achtergrondpagina en de chrome.tabs.* ` API-functies van daaruit aanroepen.
De reload methode kan worden gebruikt om de geïnspecteerde pagina opnieuw te laden. Daarnaast kan de aanroeper een overschrijving voor de user agent-string opgeven, een script dat vroegtijdig bij het laden van de pagina wordt geïnjecteerd, of een optie om het opnieuw laden van gecachede bronnen af te dwingen.
Gebruik de getResources aanroep en de onResourceContent -gebeurtenis om de lijst met resources (documenten, stylesheets, scripts, afbeeldingen, enz.) binnen de geïnspecteerde pagina te verkrijgen. De getContent en setContent methoden van de Resource klasse, samen met de onResourceContentCommitted -gebeurtenis, kunnen worden gebruikt om wijzigingen in de resource-inhoud te ondersteunen, bijvoorbeeld door een externe editor.
Manifest
De volgende sleutels moeten in het manifest worden gedeclareerd om deze API te kunnen gebruiken.
"devtools_page"Voer de code uit in het geïnspecteerde venster.
De eval methode biedt extensies de mogelijkheid om JavaScript-code uit te voeren in de context van de geïnspecteerde pagina. Deze methode is krachtig wanneer deze in de juiste context wordt gebruikt, maar gevaarlijk wanneer deze onjuist wordt toegepast. Gebruik de tabs.executeScript -methode, tenzij u de specifieke functionaliteit nodig hebt die de eval methode biedt.
Hieronder volgen de belangrijkste verschillen tussen de methoden eval en tabs.executeScript :
- De
evalmethode gebruikt geen geïsoleerde omgeving voor de te evalueren code, waardoor de JavaScript-status van het geïnspecteerde venster toegankelijk is voor de code. Gebruik deze methode wanneer toegang tot de JavaScript-status van de geïnspecteerde pagina vereist is. - De uitvoeringscontext van de te evalueren code omvat de API van de ontwikkelaarstoolsconsole . De code kan bijvoorbeeld gebruikmaken van
inspecten$0. - De geëvalueerde code kan een waarde retourneren die wordt doorgegeven aan de callbackfunctie van de extensie. De geretourneerde waarde moet een geldig JSON-object zijn (het mag alleen primitieve JavaScript-typen en acyclische verwijzingen naar andere JSON-objecten bevatten). Wees extra voorzichtig bij het verwerken van de gegevens die van de geïnspecteerde pagina worden ontvangen – de uitvoeringscontext wordt in wezen bepaald door de geïnspecteerde pagina; een kwaadwillende pagina kan de gegevens die aan de extensie worden geretourneerd beïnvloeden.
Houd er rekening mee dat een pagina meerdere verschillende JavaScript-uitvoeringscontexten kan bevatten. Elk frame heeft zijn eigen context, plus een extra context voor elke extensie die inhoudsscripts in dat frame uitvoert.
Standaard wordt de eval methode uitgevoerd in de context van het hoofdframe van de geïnspecteerde pagina.
De eval methode accepteert een optioneel tweede argument waarmee u de context kunt specificeren waarin de code wordt geëvalueerd. Dit optieobject kan een of meer van de volgende sleutels bevatten:
-
frameURL - Gebruik dit om een ander frame dan het hoofdframe van de geïnspecteerde pagina te specificeren.
-
contextSecurityOrigin - Gebruik dit om een context binnen het opgegeven kader te selecteren op basis van de webherkomst .
-
useContentScriptContext - Indien waar, wordt het script uitgevoerd in dezelfde context als de inhoudsscripts van de extensie. (Dit is equivalent aan het specificeren van de eigen weborigin van de extensie als de beveiligingsorigin van de context.) Dit kan worden gebruikt om gegevens uit te wisselen met het inhoudsscript.
Voorbeelden
De volgende code controleert welke versie van jQuery door de geïnspecteerde pagina wordt gebruikt:
chrome.devtools.inspectedWindow.eval(
"jQuery.fn.jquery",
function(result, isException) {
if (isException) {
console.log("the page is not using jQuery");
} else {
console.log("The page is using jQuery v" + result);
}
}
);
Om deze API uit te proberen, installeer je de devtools API-voorbeelden uit de chrome-extension-samples repository.
Soorten
Resource
Een bron binnen de geïnspecteerde pagina, zoals een document, een script of een afbeelding.
Eigenschappen
- URL
snaar
De URL van de bron.
- getContent
leegte
Haalt de inhoud van de bron op.
De
getContentfunctie ziet er als volgt uit:(callback: function) => {...}
- terugbelverzoek
functie
De
callbackparameter ziet er als volgt uit:(content: string, encoding: string) => void
- inhoud
snaar
Inhoud van de bron (mogelijk gecodeerd).
- codering
snaar
Leeg als de inhoud niet gecodeerd is, anders de coderingsnaam. Momenteel wordt alleen base64 ondersteund.
- setContent
leegte
Hiermee wordt de inhoud van de bron ingesteld.
De functie
setContentziet er als volgt uit:(content: string, commit: boolean, callback?: function) => {...}
- inhoud
snaar
Nieuwe inhoud van de bron. Momenteel worden alleen bronnen van het type tekst ondersteund.
- verbinden
booleaans
Retourneert 'true' als de gebruiker klaar is met het bewerken van de bron en de nieuwe inhoud van de bron moet worden opgeslagen; retourneert 'false' als het een kleine wijziging betreft die is verzonden tijdens het bewerken van de bron door de gebruiker.
- terugbelverzoek
functie optioneel
De
callbackparameter ziet er als volgt uit:(error?: object) => void
- fout
object optioneel
Wordt ingesteld op 'undefined' als de inhoud van de bron succesvol is ingesteld; beschrijft anders een fout.
Eigenschappen
tabId
De ID van het tabblad dat wordt gecontroleerd. Deze ID kan worden gebruikt met de chrome.tabs.* API.
Type
nummer
Methoden
eval()
chrome.devtools.inspectedWindow.eval(
expression: string,
options?: object,
callback?: function,
): void
Evalueert een JavaScript-expressie in de context van het hoofdframe van de geïnspecteerde pagina. De expressie moet resulteren in een JSON-compatibel object; anders wordt een uitzondering gegenereerd. De `eval`-functie kan een fout aan de DevTools-kant of een JavaScript-uitzondering die optreedt tijdens de evaluatie rapporteren. In beide gevallen is de parameter result van de callback undefined . In het geval van een fout aan de DevTools-kant is de parameter isException niet-null en is isError ingesteld op `true` en code op een foutcode. In het geval van een JavaScript-fout is isException ingesteld op `true` en is value ingesteld op de tekenreeks van het gegenereerde object.
Parameters
- uitdrukking
snaar
Een uitdrukking om te evalueren.
- opties
object optioneel
De parameter 'options' kan een of meer opties bevatten.
- frameURL
string optioneel
Indien gespecificeerd, wordt de expressie geëvalueerd in de iframe waarvan de URL overeenkomt met de opgegeven URL. Standaard wordt de expressie geëvalueerd in het bovenste frame van de geïnspecteerde pagina.
- scriptExecutionContext
string optioneel
Chrome 107+Evalueer de expressie in de context van een inhoudsscript van een extensie die overeenkomt met de opgegeven oorsprong. Indien opgegeven, overschrijft scriptExecutionContext de instelling 'true' van useContentScriptContext.
- useContentScriptContext
boolean optioneel
Evalueer de expressie in de context van het contentscript van de aanroepende extensie, op voorwaarde dat het contentscript al in de geïnspecteerde pagina is geïnjecteerd. Zo niet, dan wordt de expressie niet geëvalueerd en wordt de callback aangeroepen met de exception-parameter ingesteld op een object waarvan het veld
isErroris ingesteld op true en het veldcodeopE_NOTFOUND.
- terugbelverzoek
functie optioneel
De
callbackparameter ziet er als volgt uit:(result: object, exceptionInfo: object) => void
- resultaat
voorwerp
Het resultaat van de evaluatie.
- exceptionInfo
voorwerp
Een object dat details bevat over eventuele uitzonderingen die zijn opgetreden tijdens de evaluatie van de expressie.
- code
snaar
Stel deze waarde in als de fout aan de DevTools-kant is opgetreden voordat de expressie werd geëvalueerd.
- beschrijving
snaar
Stel deze waarde in als de fout aan de DevTools-kant is opgetreden voordat de expressie werd geëvalueerd.
- details
elk[]
Deze waarde wordt ingesteld als de fout zich aan de DevTools-kant voordoet voordat de expressie wordt geëvalueerd. De waarde bevat de array met waarden die in de beschrijvingsstring kunnen worden ingevoegd om meer informatie te geven over de oorzaak van de fout.
- isError
booleaans
Stel deze waarde in als de fout aan de DevTools-kant is opgetreden voordat de expressie werd geëvalueerd.
- isException
booleaans
Stel deze waarde in als de geëvalueerde code een onafgehandelde uitzondering produceert.
- waarde
snaar
Stel deze waarde in als de geëvalueerde code een onafgehandelde uitzondering produceert.
getResources()
chrome.devtools.inspectedWindow.getResources(
callback: function,
): void
Haalt de lijst met bronnen op van de geïnspecteerde pagina.
Parameters
reload()
chrome.devtools.inspectedWindow.reload(
reloadOptions?: object,
): void
De geïnspecteerde pagina wordt opnieuw geladen.
Parameters
- herlaadopties
object optioneel
- ignoreCache
boolean optioneel
Indien dit waar is, zal de loader de cache overslaan voor alle geïnspecteerde paginabronnen die zijn geladen voordat de
loadgebeurtenis wordt geactiveerd. Het effect is vergelijkbaar met het indrukken van Ctrl+Shift+R in het geïnspecteerde venster of in het venster Ontwikkelaarstools. - geïnjecteerdScript
string optioneel
Indien gespecificeerd, wordt het script direct bij het laden in elk frame van de geïnspecteerde pagina geïnjecteerd, vóórdat de scripts van de frames zelf worden uitgevoerd. Het script wordt niet opnieuw geïnjecteerd na volgende herlaadbeurten, bijvoorbeeld als de gebruiker op Ctrl+R drukt.
- userAgent
string optioneel
Indien gespecificeerd, overschrijft de tekenreeks de waarde van de
User-AgentHTTP-header die wordt verzonden tijdens het laden van de bronnen van de geïnspecteerde pagina. De tekenreeks overschrijft ook de waarde van denavigator.userAgent-eigenschap die wordt geretourneerd aan alle scripts die binnen de geïnspecteerde pagina worden uitgevoerd.
Evenementen
onResourceAdded
chrome.devtools.inspectedWindow.onResourceAdded.addListener(
callback: function,
)
Wordt geactiveerd wanneer een nieuwe bron aan de geïnspecteerde pagina wordt toegevoegd.
Parameters
- terugbelverzoek
functie
De
callbackparameter ziet er als volgt uit:(resource: Resource) => void
- bron
onResourceContentCommitted
chrome.devtools.inspectedWindow.onResourceContentCommitted.addListener(
callback: function,
)
Wordt geactiveerd wanneer een nieuwe revisie van de resource wordt opgeslagen (bijvoorbeeld wanneer een gebruiker een bewerkte versie van de resource opslaat in de ontwikkelaarstools).