Как использовать XMLHttpRequest в GWT?

XMLHttpRequest является альтернативой HTTP-вызовам со стороны клиента GWT и позволяет контролировать все аспекты запросов/ответов. Но как его использовать? адрес javadoc: http://www.gwtproject.org/javadoc/latest/com/google/gwt/xhr/client/class-use/XMLHttpRequest.html


person hadiafifi    schedule 28.08.2018    source источник
comment
какую версию gwt вы используете? это проект maven?   -  person Halko Karr-Sajtarevic    schedule 28.08.2018
comment
Elemental2 - это путь :)   -  person Luigi Polvani    schedule 28.08.2018


Ответы (1)


Вы не упомянули, какую версию GWT вы используете, поэтому я предполагаю, что она самая последняя. Это означает 2.8.2 или новее.

Elemental2 - это путь

Как упоминалось в комментариях выше, Elemental2 - правильный путь. Я объясню это немного.

Если вы думаете о перспективной реализации (зная о новом подходе GWT3/J2CL), пожалуйста, не используйте устаревший материал GWT. Это значит, пожалуйста, используйте elemental2.dom.XMLHttpRequest вместо com.google.gwt.xhr.client.XMLHttpRequest (упомянутого вами). Пожалуйста, не используйте зависимость gwt-user, если это возможно, так как она будет объявлена ​​устаревшей (если она уже не используется).

Elemental2 — это проект с открытым исходным кодом, доступный здесь: https://github.com/google/elemental2. Это своего рода базовая библиотека для нового GWT. Для облегчения миграции существующих проектов GWT2.x на GWT3.x часть старого gwt-user в настоящее время переносится на новый подход с использованием техники JsInterop и упомянутого Elemental2. Так что определенно Elemental2 - это то, что вам нужно.

Elemental2 и JsInterop в целом

Спецификация пока не так богата, если говорить о новом подходе JsInterop, но на данный момент вы найдете хотя бы некоторое введение: http://www.gwtproject.org/doc/latest/DevGuideCodingBasicsJsInterop.html

Примеры

Пример для XMLHttpRequest можно найти в этой статье: http://www.g-widgets.com/2016/09/09/gwt-http-requests-alternatives/

Если вы ищете примеры, также неплохо выполнить поиск на сайте Github следующим образом: https://github.com/search?q=elemental2.dom.XMLHttpRequest&type=Code.

(Чтобы использовать поиск Github, вам необходимо войти в систему, в противном случае вы увидите Ого! Вы вызвали злоупотребление, бла-бла... )

Один из результатов приведет вас к очень интересному проекту (у вас уже есть превью будущего GWT): https://github.com/gwtproject/gwt-http. Это перспективный порт устаревшего модуля com.google.gwt.http.HTTP GWT. Это поможет перенести проекты GWT2.x на GWT3.x.

Когда вы посмотрите на тестовый пакет, вы найдете несколько примеров: https://github.com/gwtproject/gwt-http/tree/master/src/test/java/org/gwtproject/http/client . Итак, это, наконец, ответ на ваш вопрос: как его использовать? :-)

Дополнительные примеры источника для XMLHttpRequest (с использованием Elemental2) из Gist: https://gist.github.com/search?utf8=%E2%9C%93&q=elemental2.dom.XMLHttpRequest. Это, вероятно, даже лучше для начала, так как они короткие и четкие.

Что такое Elemental2?

Elemental2 дает вам проверенный тип доступа к собственному API браузера. Так что, если вы знакомы с API браузера, вы должны быть в состоянии реализовать свои вещи, даже на основе какого-то нативного примера JavaScript. Пожалуйста, думайте о новом GWT как о безопасном JavaScript (кроме того, очень производительном и хорошо оптимизированном). С помощью JsInterop вы создаете привязки, так что это похоже на привязки для TypeScript. Так что фактически у вас есть возможность напрямую работать с API браузера, без каких-либо особенностей GWT.

Библиотеки? Еще примеры...?

Иметь дело с XMLHttpRequest — это немного низкий уровень.

У вас также есть возможность пользоваться библиотекой. Один из результатов поиска Github приведет вас к этому репозиторию: https://github.com/ibaca/autorest-streaming-example, который является примером интересной библиотеки REST: https://github.com/intendia-oss/autorest. Современный и реактивный, работает с Observables, RxJava и так далее. Эта библиотека использует JsInterop, а также перенесена на Elemental2, что делает ее готовой к GWT3/J2CL, см. изменение: https://github.com/intendia-oss/autorest/commit/58516802cd42134544e6e3787207b5431fae94b5 .

С помощью поискового запроса Github, который я вам предоставил, теперь вы можете найти еще больше примеров кода для XMLHttpRequest. Поэтому, пожалуйста, просто посмотрите и найдите лучший для ваших нужд.

Альтернативным подходом может быть использование фреймворка, например Errai от RedHat: http://erraiframework.org/. Это помогает вам решать многие проблемы на другом уровне абстракции.

Думаю, теперь у вас есть рекомендации для изучения.

С другой стороны, сейчас 2018 год, так почему бы не использовать Fetch API?

Когда я думаю о современном веб-приложении, я бы скорее подумал о Fetch API, а не XMLHttpRequest. Все современные браузеры теперь реализуют функцию fetch() изначально. Разве это не лучший способ решить вашу проблему? fetch() — это механизм на основе промисов, который позволяет вам делать сетевые запросы, подобные XMLHttpRequest. Promises и Fetch обрабатываются Elemental2. Затем вы можете использовать его из своего Java-кода примерно так же, как в примерах Mozilla.

Подробнее о Fetch API читайте здесь:

Более того, в этом нет ничего нового, как видите. Если в старых браузерах polyfill будет эмулировать отсутствующую функцию: https://github.com/github/fetch.

Что касается примеров, то я не так много вижу на Github: https://github.com/search?utf8=%E2%9C%93&q=elemental2.dom.DomGlobal+fetch&type=Code, но хоть что-то.

Fetch API кажется самым актуальным решением проблемы.

Пожалуйста, найдите очень простой пример fetch() с использованием Elemental2.

Раздел импорта:

import static elemental2.dom.DomGlobal.fetch;
import static elemental2.dom.DomGlobal.console;
import elemental2.dom.Response;

Затем используйте в своем коде:

    fetch("https://randomuser.me/api/?gender=female&results=1")
            .then(Response::json)
            .then(data -> {
                console.log(Global.JSON.stringify(data));
                return null;
            }).
            catch_(error -> {
                console.log(error);
                return null;
            });

В результате вы должны увидеть что-то вроде этого:

{"results":[{"gender":"female","name":{"title":"mrs","first":"caroline","last":"coleman"},"location":{"street":"3703 new road","city":"swansea","state":"leicestershire","postcode":"ZH67 0YS","coordinates":{"latitude":"14.7870","longitude":"-107.8990"},"timezone":{"offset":"-6:00","description":"Central Time (US & Canada), Mexico City"}},"email":"[email protected]","login":{"uuid":"25357d90-cce4-4fe6-a3db-8ab77c0272ba","username":"smallpeacock582","password":"citizen","salt":"VX3s05Ah","md5":"84649cce1db8c6f2cbe33098221aa570","sha1":"005abf7d2ca0ff5b1a0bfd6dcee6d4860ef6e75d","sha256":"caadff0a16e27b0d9893aea483aedc7cf7c4707096c33a58acf44336bb2b54be"},"dob":{"date":"1978-03-14T15:47:16Z","age":40},"registered":{"date":"2013-08-10T19:09:41Z","age":5},"phone":"015396 74385","cell":"0726-723-103","id":{"name":"NINO","value":"JA 32 24 22 P"},"picture":{"large":"https://randomuser.me/api/portraits/women/45.jpg","medium":"https://randomuser.me/api/portraits/med/women/45.jpg","thumbnail":"https://randomuser.me/api/portraits/thumb/women/45.jpg"},"nat":"GB"}],"info":{"seed":"98f4f4a344470fbd","results":1,"page":1,"version":"1.2"}}

Вы можете дополнительно преобразовать результат в объект Java, используя метод, называемый JsInterop DTO. Если вам интересно, найдите некоторую информацию здесь: https://stackoverflow.com/a/50565283/5394086.

Не рекомендуемый подход

Если вы, к сожалению, предпочитаете использовать старый GWT, поэтому ‹= 2.7, то я думаю, вы можете поискать некоторые примеры на Github, используя аналогичный поисковый запрос, но для этого устаревшего com.google.gwt.xhr.client.XMLHttpRequest. В этом случае я также предлагаю вам не делать вещи на таком низком уровне, а использовать библиотеку, например https://github.com/reinert/requestor (который, к сожалению, больше не поддерживается, а разработка GWT 2.7 остановлена, но для этой версии GWT это, вероятно, лучший выбор). Но опять же, пожалуйста, не идите по этому пути и вместо этого используйте GWT ›= 2.8.2 с подходом Elemental2/JsInterop.

person Marcin Szałomski    schedule 29.08.2018
comment
Я хотел бы добавить github.com/DominoKit/domino-rest в качестве простой оболочки для elemental2. XmlHttpRequest, а также GWT XmlHttpRequest уже портированы для тех, кто ищет простой перенос, портированную библиотеку можно найти здесь github.com/rjeeb/gwt-xhr - person Vegegoku; 30.08.2018
comment
Только одно: fetch API реализован в Edge, начиная с v14. Старые версии Egde или все версии IE не поддерживают API выборки. - person El Hoss; 01.02.2019
comment
Тогда полифил для вас. Пожалуйста, взгляните на текст выше, где находится предложение: ...Если в старых браузерах полифилл будет эмулировать отсутствующую функцию... для ссылки. - person Marcin Szałomski; 02.02.2019