показване на изображение на клиент преди качване на сървър в gwt

Бих искал да покажа изображение и неговите размери на клиента, преди да го кача на сървъра. Всеки път, когато се опитвам да създам Image уиджет на gwt ext, той не приема локален файл (във файловата система). Приема само http заявки. Опитах също String img = GWT.getHostPageBaseURL() + "image_name" и функцията за замяна, но със същия резултат. Най-накрая се преместих на ImagePreloader, но той също се нуждае от URL адрес.

ImagePreloader.load("URL of image", new ImageLoadHandler()
{
    public void imageLoaded(ImageLoadEvent event) 
    {
        if (event.isLoadFailed())
            Window.alert("Image " + event.getImageUrl() + "failed to load.");
        else
            Window.alert("Image dimensions: " + event.getDimensions().getWidth() + " x " + event.getDimensions().getHeight());
    }
});

Може ли някой да предложи решение, което не включва първо качване на изображението?


person Community    schedule 04.04.2014    source източник


Отговори (2)


Моля, разгледайте примерния JS код по-долу:

function readURL(input) {

if (input.files && input.files[0]) {
    var reader = new FileReader();

    reader.onload = function (e) {
        $('#blah').attr('src', e.target.result);
    }

    reader.readAsDataURL(input.files[0]);
}
}

 $("#imgInp").change(function(){
   readURL(this);
});

и свързания HTML:

 <form id="form1" runat="server">
    <input type='file' id="imgInp" />
    <img id="blah" src="#" alt="your image" />
</form>
person nitin verma    schedule 23.02.2016
comment
-1 Току-що копирахте друг SO отговор, който не е ваш, и го публикувахте тук. И дори не сте включили jsfiddle, който показва, че работи. - person Baz; 23.02.2016

Разгледайте този свързан въпрос и отговорете:

Визуализирайте изображение, преди да бъде качено

Можете да го включите с помощта на JSNI. Вече знам за решение в рамките на GWT.


Току-що намерих gwtupload, който твърди, че може да визуализира изображения, преди да ги качи.

person Baz    schedule 04.04.2014
comment
Благодаря за отговора, използвах gwtupload, но неговият сървлет създава локална структура на директория, отколкото изпращането на URL адреса до клиента, той работи след качване на файла ... - person ; 07.04.2014
comment
аз съм нов в jsni. как се използва, не знам, използвах го на прост java скрипт и html, но не работи. Моля помогнете ... - person ; 07.04.2014
comment
да, виждам го, но в следния html код как се извиква функцията и как мога да извикам тази функция с помощта на GWt Ext качване на файл ‹form id=form1 runat=server› ‹input type='file' id=imgInp /› ‹img id =blah src=# alt=вашето изображение /› ‹/form› - person ; 08.04.2014