установите заголовки в облачном виде, чтобы избежать испорченного холста
Я делаю простое приложение для рисования в JavaScript для стороны клиента и PHP для сохранения и загрузки. Приложение размещено на герою, а сохраненные фотографии — на облачном. Когда приложение загружает сохраненную картинку из облачного хранилища и рисует ее на холсте, холст становится испорченным из-за междоменной области.
Я использую облачный php-API для сохранения изображения
\Cloudinary\Uploader::upload($canvasToDataUrl, array("public_id" => $saveName));
Я попытался добавить строку в массиве параметров с несколькими различными синтаксисами, такими как
, "headers" => "Access-Control-Allow-Origin:*"Я считаю, что этот заголовок не поддерживается API, поддерживаются заголовки ‘link’ и ‘X-Robots-Tag’.
Есть ли способ заставить мои сохраненные изображения иметь заголовок «Access-Control-Allow-Origin: *»?
Решение
Вы можете установить разрешенные источники через консоль безопасности: https://cloudinary.com/console/settings/security
Как ниже:
Другие решения
Cloudinary возвращает Access-Control-Allow-Origin: * заголовок, поэтому он должен работать для CORS.
Вот пример, который демонстрирует использование Cloudinary изображений в Canvas:
https://jsfiddle.net/137ptoja/
Для использования toDataURL затем обратите внимание, что при наличии запросов на URL-адрес HTTP со страницы HTTPS это не разрешено CORS.
Кроме того, если для домена существует файл cookie, запрос не считается анонимным и блокируется.
Вот пример работ:
https://jsfiddle.net/taragano/td0eLafc/