transform normal request to cors request [with WebRequest API]
Reported by
liuhao...@gmail.com,
Aug 7 2017
|
|||||||
Issue description
UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36
Steps to reproduce the problem:
1. simple html page
# web page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Test</title>
</head>
<body>
<img src="http://www.example.com/abc.jpg">
<script> // actually this is content scripts
const img = document.querySelector("img");
img.onload = function () {
createImageBitmap(img).then(bitmap => {
const width = Math.ceil(bitmap.width);
const height = Math.ceil(bitmap.height);
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
canvas.width = width;
canvas.height = height;
context.drawImage(bitmap, 0, 0, width, height);
bitmap.close();
return new Promise((resolve, reject) => canvas.toBlob(blob => resolve(blob), "image/jpeg")); // demo
});
};
</script>
</body>
</html>
2. the image is used in canvas and canvas.toBlob(). so i want to transform `http://www.example.com/abc.jpg` normal request to cors request use this code.
# chrome background script
chrome.webRequest.onBeforeSendHeaders.addListener(details => {
if (details.type !== 'image') {
return;
}
const name = "Origin";
const value = "http://localhost"; // demo
for (let i = 0; i < details.requestHeaders.length; i++) {
if (details.requestHeaders[i].name.toLowerCase() === name.toLowerCase()) {
details.requestHeaders.splice(i, 1);
break;
}
}
details.requestHeaders.push({name, value});
return {requestHeaders: details.requestHeaders};
}, {
urls: ["<all_urls>"],
}, ["requestHeaders", "blocking"]);
chrome.webRequest.onHeadersReceived.addListener(details => {
if (details.type !== 'image') {
return;
}
const name = "Access-Control-Allow-Origin";
const value = "*";
for (let i = 0; i < details.responseHeaders.length; i++) {
if (details.responseHeaders[i].name.toLowerCase() === name.toLowerCase()) {
details.responseHeaders.splice(i, 1);
break;
}
}
details.responseHeaders.push({name, value});
return {responseHeaders: details.responseHeaders};
}, {
urls: ["<all_urls>"],
}, ["responseHeaders", "blocking"]);
3. actually there is no effect. the request send normally without cors mode.
and there has not appropriate API to modify `crossOrigin` property of image.
can we provide a method to transform normal request to cors request like credentials-mode of window.fetch?
What is the expected behavior?
n/a
What went wrong?
n/a
WebStore page:
Did this work before? No
Chrome version: 60.0.3112.90 Channel: stable
OS Version: 10.0
Flash Version:
,
Aug 9 2017
,
Aug 9 2017
Thank you for providing more feedback. Adding requester "brajkumar@chromium.org" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Aug 9 2017
liuhao.me@ Thank you for the issue. Unable to reproduce the issue on Ubuntu 14.04, Windows 7 and Mac OS 10.12.6 using latest Stable 60.0.3112.90 and canary 62.0.3178.0 with the below steps 1. Downloaded the given .zip file and extracted the files. 2. In chrome://extensions page, enabled the Extension. 3. Launched the webpage.html page on chrome and could see the image with no effects. Please find the attached screen cast and confirm if anything is missed here. Also please confirm what is the expected behavior and did it work fine on the previous versions of Chrome? Please provide a screen cast for better understanding of the issue. Thanks...
,
Aug 9 2017
Thank you for providing more feedback. Adding requester "susanjuniab@chromium.org" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Sep 6 2017
Able to reproduce this issue on 60.0.3112.113 using Ubuntu 14.04,Windows 7 with below steps and seeing error in console 1. Downloaded the given .zip file and extracted the files. 2. In chrome://extensions page, enabled the Extension. 3. Launched the webpage.html page on chrome and inspected image This extension can be added from M59 only. Same error is seen from M59 Hence marking it as Untriaged and adding appropriate label for further investigation.
,
Sep 8 2017
+some webrequest folks. Just to make sure I understand - the motivation here is to allow the webRequest API to bypass CORS?
,
Sep 12 2017
emm, you are right
,
Sep 12
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue. Sorry for the inconvenience if the bug really should have been left as Available. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot |
|||||||
►
Sign in to add a comment |
|||||||
Comment 1 by brajkumar@chromium.org
, Aug 8 2017Labels: Needs-Triage-M60 Needs-Feedback