设想:
我在无头模式下使用 puppeteer 启动 chrome,并page.addScriptTag
使用跨域 javascript 文件调用。现在,如果打开站点设置了 csp 并且仅限制相同来源的 javascript 标签,我如何使用 puppeteer API 绕过它?
设想:
我在无头模式下使用 puppeteer 启动 chrome,并page.addScriptTag
使用跨域 javascript 文件调用。现在,如果打开站点设置了 csp 并且仅限制相同来源的 javascript 标签,我如何使用 puppeteer API 绕过它?
这是我的第一个 stackoverflow 贡献,所以请怜悯我。我发现这项工作可以让您通过 CSP,Here。
基本思想是你拦截页面请求并使用像 node-fetch 这样的库来发出请求并在将 CSP 标头传递回 chrome 时禁用它。
这是最初来自 github 问题跟踪器的片段。
将“example.com”替换为需要禁用 CSP 的网站。
const fetch = require('node-fetch')
const requestInterceptor = async (request) => {
try {
const url = request.url()
const requestHeaders = request.headers()
const acceptHeader = requestHeaders.accept || ''
if (url.includes("example.com") && (acceptHeader.includes('text/html'))) {
const cookiesList = await page.cookies(url)
const cookies = cookiesList.map(cookie => `${cookie.name}=${cookie.value}`).join('; ')
delete requestHeaders['x-devtools-emulate-network-conditions-client-id']
if (requestHeaders.Cookie) {
requestHeaders.cookie = requestHeaders.Cookie
delete requestHeaders.Cookie
}
const theseHeaders = Object.assign({'cookie': cookies}, requestHeaders, {'accept-language': 'en-US,en'})
const init = {
body: request.postData(),
headers: theseHeaders,
method: request.method(),
follow: 20,
}
const result = await fetch(
url,
init,
)
const resultHeaders = {}
result.headers.forEach((value, name) => {
if (name.toLowerCase() !== 'content-security-policy') {
resultHeaders[name] = value
} else {
console.log('CSP', `omitting CSP`, {originalCSP: value})
}
})
const buffer = await result.buffer()
await request.respond({
body: buffer,
resultHeaders,
status: result.status,
})
} else {
request.continue();
}
} catch (e) {
console.log("Error while disabling CSP", e);
request.abort();
}
}
await page.setRequestInterception(true)
page.on('request', requestInterceptor)