Как обойти CORS и загрузить фотографию на сервер с помощью VK API?

Question

[Yegr0]

Добрый день! Пишу VK miniapps и столкнулся с проблемой, что не могу загрузить фото на сервер.
1. Получаю сервер:

const serv = yield currectBridge.send('VKWebAppCallAPIMethod', {
  method: 'photos.getUploadServer',
  params: {
    album_id: 000, //мой открытый альбом
    owner_id: userId,
    v: '5.21',
    access_token: userToken,
  },
});

2. Пытаюсь по этому урлу отправить fetch запрос с фотографией, которую беру с canvas

let formData = new FormData();
formData.append('field1', canvas.toDataURL());
let response = yield fetch(url, {
  method: 'POST',
  headers: {
    'Content-Type': 'multipart/form-data',
  },
  //mode: 'no-cors',
  body: formData,
});

Загружаю сборку на прод, захожу в приложение и получаю CORS блок

Access to fetch at 'https://pu.vk.com/c842229/ss2120/upload.php?act=do...' from origin 'https://stage-app70008-d852483adfb2.pages.vk-apps.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Answer 1

[Алексей П]

Как вариант, можно отправлять файлы на свой сервер, а от туда загружать в ВК. Но для этого нужно иметь ВК клиент на сервере.

Answer 2

[mikes_petrov]

Ошибка No 'Access-Control-Allow-Origin' header при загрузке фотографий из браузерного JS
Загрузить фото таким образом не получится, к сожалению.

Проблема в том, что в XHR нельзя работать с кроссдоменными запросами, если на сервере нет соответствующих заголовков. У нас по соображениям безопасности их нет.

Вк говорит что так нельзя: https://vk.com/faq11786