JS как установить заголовки запроса для html элемента image () - PullRequest
Новая
       25

JS как установить заголовки запроса для html элемента image ()

0 голосов
/ 17 июня 2020

Я хочу знать, как мы можем установить заголовки запросов для html element image ().

На самом деле у меня есть два сайта на разных поддоменах с разными IP-адресами. например, 

site_a.stackoverflow.com  IP : xx.xx.xx.xx
site_b.stackoverflow.com  IP : aa.aa.aa.aa

на site_a.stackoverflow.com У меня есть изображения, и когда я пытаюсь загрузить их из site_b.stackoverflow.com, используя html element image() chrome браузер отправляет неправильные заголовки запроса 

Sec-Fetch-Mode: no-cors
Sec-Fetch-Site: same-site

правильные заголовки запроса должны быть 

Sec-Fetch-Mode: cors
Sec-Fetch-Site: cross-site

, потому что, хотя оба домена имеют один и тот же базовый домен, их поддомены находятся на разных IP-адресах, поэтому похоже, что браузер просто проверяет базовый домен, а не проверяет IP-адрес субдомена домены.

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

Мой js код: 

// get canva id
var canvas = document.getElementById('mycanvas2');
var ctx = canvas.getContext('2d');

// Create an image element
var img2 = document.createElement('IMG');

// When the image is loaded, draw it
img2.onload = function () {
    ctx.drawImage(img, 0, 0);
    var imgData = ctx.getImageData(0, 0, img.width, img.height);
    console.log(imgData);
}

// Specify the src to load the image
img2.crossOrigin = "Anonymous";
img2.src = "https://site_a.stackoverflow.com/image.png";

Ресурсы:

html элемент image (): https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/Image

headers.set (): https://developer.mozilla.org/en-US/docs/Web/API/Headers/set

...