forum.boolean.name - скачать файл в js и преобразовать в base64

forum.boolean.name (http://forum.boolean.name/index.php)

- JavaScript / HTML (http://forum.boolean.name/forumdisplay.php?f=136)

- - скачать файл в js и преобразовать в base64 (http://forum.boolean.name/showthread.php?t=19638)

pax	14.01.2015 17:19

скачать файл в js и преобразовать в base64

Можно ли как-то скачать файл средствами js и преобразовать его в base64? Желательно не html5 пока.

Nikich

14.01.2015 18:36

Ответ: скачать файл в js и преобразовать в base64

Конечно!

pax	14.01.2015 22:24

Ответ: скачать файл в js и преобразовать в base64

Эх, опять проблемы, кроссдоменные запросы не канают :(
Думал обману Unity и загружу аватары игроков через js, а фиг там.

Nikich

15.01.2015 00:16

Ответ: скачать файл в js и преобразовать в base64

Почему нельзя получить урлы аватарок и передать их в юнити, который их сам загрузит?

pax	15.01.2015 00:44

Ответ: скачать файл в js и преобразовать в base64

Смысл в том, что у WebPlayer'a есть так называемый Security Sandbox. Загружая и отображая на экране текстуру, с не разрешенного места происходит блокировака чтения данных с экрана или рендертекстур. В результате скриншот не сделать.

http://docs.unity3d.com/Manual/SecuritySandbox.html

Цитата:

You are allowed to download images from servers that do not have a crossdomain.xml file. However, the only thing you are allowed to do with these images is use them as textures in your scene. You are not allowed to use GetPixel() on them. You are also not allowed to read back from the screen. Both attempts will result in a SecurityException being thrown:

Цитата:

SecurityException: No read access to the texture data:
at (wrapper managed-to-native) UnityEngine.Texture2D:GetPixel (int,int)

moka	15.01.2015 00:51

Ответ: скачать файл в js и преобразовать в base64

Если юзаешь JS, то глянь на флаг:

PHP код:




img.crossOrigin = "Anonymous";

Он позволяет грузить с кросс-домена, и лезть в файл.

Если уж совсем извратиться, и есть JS, можно так загрузить файл, отрисовать в canvas2d затем получить png картинку toDataUrl и уже попробовать скушать ее.

pax	15.01.2015 00:55

Ответ: скачать файл в js и преобразовать в base64

А как это использовать? Создавать скрытые теги для картинок, но потом их как-то надо прочитать и передать в Unity в виде текста. А канвас не вариант, пока не хочется использовать html5. В общем забью пока на это дело.

moka	15.01.2015 01:02

Ответ: скачать файл в js и преобразовать в base64

PHP код:




var image = new Image();
image.onload = function() {
    canvas.width = image.naturalWidth;
    canvas.height = image.naturalHeight;
    ctx.drawImage(image, 0, 0);
    var pngBlob = canvas.toDataUrl();
};
image.src = 'http://...';

pax	15.01.2015 01:04

Ответ: скачать файл в js и преобразовать в base64

А как с нее данные получить после загрузки? Мне нужно текстуру в вэб плеере создать.

moka	15.01.2015 01:06

Ответ: скачать файл в js и преобразовать в base64

pngBlob - это блоб, на самом деле чистая png.
Можно заюзать toImageData() - даст вообще массив пикселей, делай с ними что хочешь, пакуй, шли, распаковывай.

pax	15.01.2015 01:08

Ответ: скачать файл в js и преобразовать в base64

ну это опять canvas и html5

moka	15.01.2015 16:31

Ответ: скачать файл в js и преобразовать в base64

Ага :)

pax	16.01.2015 14:03

Ответ: скачать файл в js и преобразовать в base64

Цитата:

Сообщение от moka (Сообщение 291791)

Если юзаешь JS, то глянь на флаг:

PHP код:




img.crossOrigin = "Anonymous";

В общем одна фигня

PHP код:




Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.VM812:115 image.onload

либо с Anonymous

PHP код:




Image from origin 'http://vk.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://steamcraft.landrays.com' is therefore not allowed access.

Хотя часть аватаров загрузилось, подскажите, как обработать последнюю ошибку?

moka	16.01.2015 15:01

Ответ: скачать файл в js и преобразовать в base64

Цитата:

Сообщение от pax (Сообщение 291880)

либо с Anonymous

PHP код:




Image from origin 'http://vk.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://steamcraft.landrays.com' is therefore not allowed access.

Хотя часть аватаров загрузилось, подскажите, как обработать последнюю ошибку?

Последнюю уже не выйдет, т.к. это уже обычно жестко регулируется. Ты по идее можешь сделать мелкий сервис, который будет на твоем back-end'е вытягивать аватарки, т.к. с node.js с правильными header'ами будет проще, и кидать их на S3, и уже в игре грузить из S3 или другого хранилища.

pax	16.01.2015 15:17

Ответ: скачать файл в js и преобразовать в base64

Мне бы хотя бы узнать, что эта ошибка произошла. И вернуть результат, что не получилось скачать...

moka	16.01.2015 15:21

Ответ: скачать файл в js и преобразовать в base64

Цитата:

Сообщение от pax (Сообщение 291883)

Мне бы хотя бы узнать, что эта ошибка произошла. И вернуть результат, что не получилось скачать...

Если в броузере происходит, и грузишь картинку Image объектом, то не выйдет. Броузер не сообщим об этом.
А если используешь Ajax, то будет сообщена ошибка как event.

pax	16.01.2015 15:25

Ответ: скачать файл в js и преобразовать в base64

Удалось поймать ошибку

PHP код:




function downloadImage(url, callback){
    console.log("downloading image: "+ url);
    var image = new Image();
    image.crossOrigin = "Anonymous";
    image.onload = function() {
        var canvas = document.createElement('canvas');
        var ctx = canvas.getContext('2d');
        canvas.width = image.naturalWidth;
        canvas.height = image.naturalHeight;
        ctx.drawImage(image, 0, 0);
        try{
            var pngBlob = canvas.toDataURL();
        } catch(e){
            callback("");
        }
        callback(pngBlob);
    };
    if(image.addEventListener) {
        image.addEventListener('error', function (e) {
            e.preventDefault(); // Prevent error from getting thrown
            callback("");
        });
    } else {
        // Old IE uses .attachEvent instead
        image.attachEvent('onerror', function (e) {
            callback("");
            return false; // Prevent propagation
        });
    }
    image.src = url;
}

moka	16.01.2015 15:46

Ответ: скачать файл в js и преобразовать в base64

Цитата:

Сообщение от pax (Сообщение 291885)

Удалось поймать ошибку

PHP код:




function downloadImage(url, callback){ 
    console.log("downloading image: "+ url); 
    var image = new Image(); 
    image.crossOrigin = "Anonymous"; 
    image.onload = function() { 
        var canvas = document.createElement('canvas'); 
        var ctx = canvas.getContext('2d'); 
        canvas.width = image.naturalWidth; 
        canvas.height = image.naturalHeight; 
        ctx.drawImage(image, 0, 0); 
        try{ 
            var pngBlob = canvas.toDataURL(); 
        } catch(e){ 
            callback(""); 
        } 
        callback(pngBlob); 
    }; 
    if(image.addEventListener) { 
        image.addEventListener('error', function (e) { 
            e.preventDefault(); // Prevent error from getting thrown 
            callback(""); 
        }); 
    } else { 
        // Old IE uses .attachEvent instead 
        image.attachEvent('onerror', function (e) { 
            callback(""); 
            return false; // Prevent propagation 
        }); 
    } 
    image.src = url; 
}

Надеюсь поддержка евентов на картинке норм, т.к. Image объект всегда отличался в броузерах.

pax	16.01.2015 16:07

Ответ: скачать файл в js и преобразовать в base64

Ради чего все затевалось:

moka	16.01.2015 19:03

Ответ: скачать файл в js и преобразовать в base64

А если спрятать нафиг все кроме драндулета в хорошем окружении, то все равно будет запрещать рендерить, имхо, если драндулет шаришь, то лучше иметь красивое окружение драндулета, а не просто скрин, который и так может кто угодно сделать..

pax	16.01.2015 19:07

Ответ: скачать файл в js и преобразовать в base64

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

Часовой пояс GMT +4, время: 14:23.