Блог

Обычно я бы сделал это с

 await page.evaluateOnNewDocument(my_js_code);
  

где my_js_code — это что-то вроде:

 Object.defineProperty(HTMLCanvasElement.prototype, "toBlob", ...
  

Но проблема в том, что после этого код становится видимым

 console.log(HTMLCanvasElement.prototype.toBlob.toString());
  

С помощью встроенной функции код не виден, возвращает toString [native code] , а не фактический код

Итак, есть ли способ переопределить функцию на более глубоком уровне с помощью Puppeteer?

Проблема на самом деле не в puppeteer, попробуйте запустить свой код в chrome repl (это даст тот же результат). Object.defineProperty принимает не значение в качестве третьего аргумента, а «дескриптор». Я предполагаю, что вы поместили функцию прямо там, в третьем аргументе, например

 Object.defineProperty(HTMLCanvasElement.prototype, "toBlob", () => {
  console.log('toBlob!');
});
  

но он хочет, чтобы это было так

 Object.defineProperty(HTMLCanvasElement.prototype, "toBlob", {
  value: () => {
    console.log('toBlob!');
  }
});
  

Пример кода, который сработал для меня:https://gist.github.com/dralletje/37d0fc8a564ad377d60881d7c7429f6b

Собственный код означает, что он реализован в браузере, возможно, на языке, отличном от Javascript. Когда вы предоставляете тело функции, это будет не собственный код, а функция, которую вы определили.

Я не думаю, что есть способ определить код, который консоль devtools будет выводить как собственный код, и даже если бы он был, он только запутал бы то, что он делает, и не смог бы скрыть это.

Итак, я обнаружил, что это, похоже, своего рода «эмулирует» поведение собственной функции:

 Object.defineProperty(HTMLCanvasElement.prototype.toBlob, "toString", {
  "value": function () {
    return 'function toBlob() { [native code] }';
  }
});
  

Не уверен, есть ли какие-либо побочные эффекты, хотя