请教一个跨域的问题

[coolair]

<div data-url="http://test.com/image/2019-04-02-17-29-11_DwWPYDNQczKRVwkb3FfJbP.jpeg"></div>

然后我想获取到这张图片用 form 的形式 ajax 提交给服务器：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://test.com/image/2019-04-02-17-29-11_DwWPYDNQczKRVwkb3FfJbP.jpeg', true);
xhr.responseType = 'blob';
xhr.onload = function (e) {
    if (this.status == 200) {
        var blob = this.response;
        // Ajax 提交这个 blob
    }
};
xhr.send();

但是在 Chrome 下提示：

Access to XMLHttpRequest at 'http://test.com/image/2019-04-02-17-29-11_DwWPYDNQczKRVwkb3FfJbP.jpeg' from origin 'http://a.lab.test:5000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

请问这个该如何解决？ 谢谢。

[whoami9894]

服务器不是你的，所以前端没办法绕过 SOP。你前端提交图片 URL 到服务器，后端请求啊

[coolair]

@whoami9894 如果是自己的服务器，有办法吗？

[wxsm]

有办法。

1. 加反代
2. 服务器响应头加 CORS