web-dev-qa-db-fra.com

injecter jquery dans la page marionnettiste

J'essaie d'injecter jquery dans ma page de marionnettiste parce que document.querySelector ne me le coupe pas:

async function inject_jquery(page){
  await page.evaluate(() => {
    var jq = document.createElement("script")
    jq.src = "https://code.jquery.com/jquery-3.2.1.min.js"
    document.querySelector("head").appendChild(jq)
  })
  const watchDog = page.waitForFunction('window.jQuery !== undefined');
  await watchDog;
}

Le résultat est la plupart du temps. Quelqu'un a-t-il une solution?

13
pguardiario

J'ai utilisé page.addScriptTag pour injecter des fichiers js.

...
await page.addScriptTag({url: 'https://code.jquery.com/jquery-3.2.1.min.js'})
...

page.addScriptTag - documentation

Exemple de travail utilisant puppeteer: 0.12.0

import { launch } from 'puppeteer'
(async () => {
    const browser = await launch({headless: false});
    const page = await browser.newPage();
    await page.goto('https://example.com', {waitUntil: 'networkidle'});
    await page.addScriptTag({url: 'https://code.jquery.com/jquery-3.2.1.min.js'});
    await page.close();
    await browser.close();
})();
26
nilobarp

Je fais ça:

await page.addScriptTag({ url: 'https://code.jquery.com/jquery-3.2.1.min.js' });
const title = await page.evaluate(() => {
  const $ = window.$; //otherwise the transpiler will rename it and won't work
  return $('h1 > span').text();
});
8
Tudor Morar

Cela fonctionne pour moi.

async function inject_jquery(page){
      await page.evaluate(() => {
        var jq = document.createElement("script")
        jq.setAttribute('type','text/javascript');
        jq.src = "https://code.jquery.com/jquery-3.2.1.min.js"
        return new Promise( (resolve) => {
            jq.addEventListener("load", ()=> {
                resolve();
            });
            document.getElementsByTagName("head")[0].appendChild(jq);
        });
      })
      const watchDog = page.waitForFunction('window.jQuery !== undefined');
      await watchDog;
    }
3
TDreama

Certains sites ne vous permettent pas d'injecter une balise de script. Vous devez donc en injecter le contenu avant de vous permettre de le faire. Si c'est le cas, vous pouvez utiliser la méthode evaluate pour récupérer le contenu des scripts d'un CDN et les injecter manuellement:

const jquery = await page.evaluate(() => window.fetch('https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js').then((res) => res.text()));
await page.goto(YOUR_PAGE_HERE);
await page.evaluate(jquery);

Ceci est utilisé pour gratter la documentation d'un marionnettiste pour sans navigateur ici si vous souhaitez voir un exemple dans la nature.

1
griffith_joel

Il devient plus facile à gérer si vous injectez votre script dans l'en-tête de votre page html si vous avez ceci 

<script type="text/javascript" src="abc.min.js"></script>

et maintenant vous pouvez facilement appeler sa fonction dans votre page.evaluate (function () {})

0
Ahsam Aslam