Как в Spring 3 задавать при сериализации в JSON другой Content-Type, либо отлавливать любой ответ с сервера на клиенте в ExtJS?

#spring #javascript #java #extjs

Здравствуйте.
Столкнулся с такой задачей:
     Использую в разработке Ext Js 3.1 и Spring 3. Используя функцию

fp.getForm().submit({
    url: 's3/uploadform.form',
    waitMsg: 'Загрузка файла...',
    success: function(fp, o){
        msg('Success', 'Загрузка завершена');
    }
});

Ext JS отправляет данные на сервер, где происходят нужные операции, и клиент ждет
от сервера ответ

{success:true}

В Spring 3 есть удобная вещь, которая автоматически сериализует возвращаемые объекты
в JSON при помощи библиотеки jackson. Для удобства, я создал объект со всеми нужными
полями плюс поле boolean success. Он прекрасно срабатывает, и отправляет назад клиенту

{"success":true, "anyField":"anyString"}

При этом используется подобная функция:

@RequestMapping(value = "/uploadform.form", method = RequestMethod.POST)
public @ResponseBody
TransactionResultMessage uploadForm(@Valid ImportXfd xfd, 
                                    BindingResult validationResults) {
    /*
     Тут все что надо и возвращение моего объекта
     TransactionResultMessage 
    */
}

И Ext JS не хочет принимать это.
В консоли ошибок JavaScript браузера, выводится

Resource interpreted as Document but transferred with MIME type application/json.

Такое выводится в google chrome. Mozilla вообще с какого-то этапа стала предлагать
сохранить пришедший ответ с сервера на диске. Тут, как я начал понимать, ExtJs ругается
на то, что приходит тип application/json. Но этот MIME тип генерирует Spring, и у меня,
логически, нет доступа к этому. Так вот новый вопрос:
      Как мне сделать Content-type, отправляемый с сервера, типа text/html, либо
принимать любой ответ с сервера как текстовый?
Заранее спасибо.    

Ответы

Ответ 1

Как утверждают доки ExtJS, форма ожидает text/html и с этим, видимо, ничего не поделать.
Но можно попробовать возвращать с сервера в методе обработчике бин, обернутый в ResponseEntity:
TransactionResultMessage message;
// Тут все что надо
HttpHeaders headers = new HttpHeaders();
headers.setContentType(new MediaType("text", "html", Charset.forName("UTF-8")));
return new ResponseEntity(message, headers, HttpStatus.OK);

Как blob.sql конвертировать на String

#java #jdbc #extjs

Есть вывод с базы JDBC, и там прописан код

                   str += ("[" +
                    "'" + rs.getInt("ID") + "', " +
                    "'" + rs.getString("NAME") + "',  " +
                    "'" + rs.getString("TYPE") + "',  " +
                    "'" + rs.getString("DATA") + "', " +
                    "'" + rs.getBlob("MESSAGE") + "', " +
                    "'" + rs.getInt("ID2") + "', " +
                    "'" + rs.getString("NAMEDOCUMENT") + "', " +
                    "'" + rs.getInt("ID1") + "', " +
                    "'" + rs.getString("STATUS") +
                    "'],");


поля Message у меня типа blob, и когда я принимаю его в Ext JS то value у него ссылка
на объект как конвертировать что бы на Ext JS выходило значения ??
    

Ответы

Ответ 1

BLOB (binary large object) — это двоичные данные неспецифицированного формата. Не
очень понятно, почему у вас Message (вероятно, текстовые данные) хранятся в виде BLOB.
Для больших текстовых данных должен использоваться тип CLOB (character large object).

Если вы хотите вывести содержимое BLOB, интерпретируя его, как текст, вам надо знать,
в какой кодировке этот текст был туда записан. Предположим, UTF-8. Тогда можно сделать так:

// ограничим максимальную длину блока данных, чтобы память не кончилась
int LENGTH_LIMIT = 100_000; 
Blob blob = rs.getBlob("MESSAGE");
long length = blob.length();
// а лучше кидать исключение, если неожиданно слишком большая длина
if(length > LENGTH_LIMIT) length = LENGTH_LIMIT;
byte[] data = blob.getBytes(0, (int)length);
String message = new String(data, StandardCharsets.UTF_8);
// теперь используйте message


В заключение скажу, что формировать JSON конкатенацией строк очень плохо. Вы сильно
попадёте на первой одинарной кавычке внутри текста сообщения. Есть много готовых библиотек
для того, чтобы сделать это быстро и безопасно.

Права доступа extjs

#extjs

Доброго времени суток. Столкнулся с задачей добавления прав доступа ко views extjs.
На уме только один вариант загружать json типа:
{
    view1: 1,
    view2: 0,
    view3: 0
}
Где 1 - write, 0 - read. И каждому view передавать параметром свой access. И уже
в initComponent ставить условие включать тот или иной элемент во view или нет. Есть
более красивые варианты? Может кто-то уже сталкивался с подобной задачей?    

Ответы

Ответ 1

Раз стоит задача, что каждый view может принимать разные вариации в зависимости от
прав доступа к нему, то да — "разруливать" эти вариации следует в initComponent. Вот
только информацию о правах доступа я бы передавал не параметрами, а реализовал бы глобально
доступный метод (через синглтон), который бы принимал аргументом имя view (и ещё, может
быть, его контекст) и давал бы ответы "read", "write", "none" и т.п. Каждый view в
своём initComponent опрашивал бы этот метод и получал бы ответ о том, как ему самого
себя представить юзеру.

Такой подход позволит реализовать любую кастомную логику выдачи ответов "read", "write",
"none" по имени view, и по умолчанию можно как раз настроить эту логику на опрос JSON
из вашего примера, который в свою очередь придёт с сервера.


Ответ 2

Возможно, есть более правильные и тривиальные решения, но в нашей конторе это реализовано
следующим образом.
Авторизация в системе у нас проходит без участия ExtJS (4.2), потому что стандартные
компоненты не позволяют работать функционалу автосохранения пароля в браузере. После
авторизации, на странице мы создаем некий DOM элемент со статичным ID, в котором храним
массив переменных с уровнем доступа, чтобы каждый раз не запрашивать их (в массиве
более 500 значений). Для доступа к данным используем Ext.get('element_id').

В initComponent и уже прогруженных View мы или дизейблим элементы, или вовсе их не
рендерим. Но на стороне API всегда сохраняется проверка прав доступа.

Как использовать 2 стора в EXTJS

#javascript #extjs

в extjs использую widget.accordion и там у меня 4 поля. 3 из них использует storeA
а четвертый storeB. 

initComponent: function() {
        Ext.apply(this, {
            items: [{
                xtype: 'grid',
                hideCollapseTool: true,
                columnLines: true,
                viewConfig: {
                    stripeRows: true
                },
                store: 'TelCatalogStore',
                columns: [{
                    text     : 'ID',
                    flex     : 1,
                    sortable : true,
                    dataIndex: 'id'
                }, {
                    text     : 'Наименования',
                    sortable : false,
                    dataIndex: 'name'
                }, {
                    text     : 'Номер',
                    sortable : false,
                    dataIndex: 'nomer'
                },
                    //тут storeB 
                {
                    text     : 'Статус',
                    width    : 75,
                    sortable : false,
                    renderer : this.changeRenderer,
                    dataIndex: 'status'
                }]
            }]
        });
        this.callParent();
    }


Как это реализовать?! 
    

Ответы

Ответ 1

С точки зрения Sencha стор должен быть один. Если надо два, то лучше склеить данные
на сервере. В качестве хака можно склеить несколько сторов в один, но встроеного для
этого ничего нет, надо будет все писать самостоятельно. Например можно склеивать данные
из нескольких запросов. Но архитектурно правильно все равно заниматься этим на стороне
сервера.

https://www.sencha.com/forum/showthread.php?251169-Creating-one-grid-view-with-multiple-stores

Постоянный вызов инциализации компонентов [закрыт]

Нашел на просторах сети плагин DateRangePicker. На пустой странице с той же версией extjs(6.0.0) плагин работает нормально(как и мой код без плагина), но внутри моего кода при попытке его подключить - идет постоянный вызов инициализации компонентов. Прикрепляю ссылку на участок кода отражающий проблему: http://fiddle.sencha.com/#fiddle/1e5p

Ответ

я удалил строки 169 и 182 после чего все заработало(не знаю почему)

Серверная обработка изменений Store ExtJS

Здравствуйте! Разбираюсь с ExtJS, с переменным успехом... Ни как не могу принять на сервере данные отправляемые Store при изменении записей (добавлении, изменении или удалении). Пишет что данные уходят POST-ом, но на сервере ни $_POST, ни $_GET, ни $_REQUEST отправленные данные не показывает - как будто ничего не отправлялось (ну кроме случайного значение в $_GET - _dc=1357565039902). Вот что уходит на сервер (взял из консоли Хрома), соответственно, при удалении, обновлении и добавлении: Request URL:http://localhost/service/destroy/news.php?_dc=1357565811429 Request Method:POST Status Code:200 OK Query String Parameters: _dc:1357565811429 Request Payload: {"items":{"id":5}}
Request URL:http://localhost/service/update/news.php?_dc=1357566047052 Request Method:POST Status Code:200 OK Query String Parameters: _dc:1357566047052 Request Payload: {"items":{"datepubl":"2012-12-01T00:00:00","title":"the Update Plan","alias":"the-update-plan","new":"

small text new

","newfull":"

full text new

","id":4}}
Request URL:http://localhost/service/create/news.php?_dc=1357566179903 Request Method:POST Status Code:200 OK Query String Parameters: _dc:1357566179903 Request Payload: {"items":{"id":0,"datepubl":null,"dateclose":null,"title":"the NEW new","alias":"the-new-new","new":"text the NEW new","newfull":""}} Посылает эти запросы следующий Store var storeNews = Ext.create('Ext.data.Store', { autoLoad: true, autoSync: true, idProperty: 'id', remoteFilter: true, fields: [ { name: 'id', type: 'int' }, { name: 'datepubl', type: 'date' }, { name: 'dateclose', type: 'date' }, { name: 'title', type: 'string' }, { name: 'alias', type: 'string' }, { name: 'new', type: 'string' }, { name: 'newtext', type: 'string' } ], proxy: { type: 'ajax', api: { read: 'service/view/news.php', create: 'service/create/news.php', update: 'service/update/news.php', destroy: 'service/destroy/news.php' }, reader: { type: 'json', successProperty: 'success', root: 'data', messageProperty: 'message' }, writer: { type: 'json', writeAllFields: false, root: 'data' }, listeners: { exception: function(proxy, response, operation){ Ext.MessageBox.show({ title: 'REMOTE EXCEPTION', msg: operation.getError(), icon: Ext.MessageBox.ERROR, buttons: Ext.Msg.OK }); } } } }); Подскажите, пожалуйста, как принять переданные данные на сервера ? Или как их правильно отправить, если я делаю это не верно ?..

Ответ

Все проще чем кажется:
$data = json_decode(file_get_contents('php://input'));
Store хочет в ответе получить готовый вид этой записи. Только тогда он будет уверен, что эта строка таблицы существует на самом деле, а не является какой то "вымышленной". У каждой записи в store есть свойство phantom. Оно означает, существует ли запись реально, или она временно появилась в store. По добавлению store будет отсылать все фантомные записи. Когда store получит в ответе данные записи, он поймет, что сервер её обработал или сохранил, и присвоит значение phantom = false, то есть запись реальная.
print( json_encode( $data ) );
Если выполняется добавление записи, то ей должен быть присвоен ID, если такой имеет место быть.

Как в Spring 3 задавать при сериализации в JSON другой Content-Type, либо отлавливать любой ответ с сервера на клиенте в ExtJS?

Здравствуйте. Столкнулся с такой задачей:      Использую в разработке Ext Js 3.1 и Spring 3. Используя функцию fp.getForm().submit({ url: 's3/uploadform.form', waitMsg: 'Загрузка файла...', success: function(fp, o){ msg('Success', 'Загрузка завершена'); } }); Ext JS отправляет данные на сервер, где происходят нужные операции, и клиент ждет от сервера ответ {success:true} В Spring 3 есть удобная вещь, которая автоматически сериализует возвращаемые объекты в JSON при помощи библиотеки jackson. Для удобства, я создал объект со всеми нужными полями плюс поле boolean success. Он прекрасно срабатывает, и отправляет назад клиенту {"success":true, "anyField":"anyString"} При этом используется подобная функция: @RequestMapping(value = "/uploadform.form", method = RequestMethod.POST) public @ResponseBody TransactionResultMessage uploadForm(@Valid ImportXfd xfd, BindingResult validationResults) { /* Тут все что надо и возвращение моего объекта TransactionResultMessage */ } И Ext JS не хочет принимать это. В консоли ошибок JavaScript браузера, выводится Resource interpreted as Document but transferred with MIME type application/json. Такое выводится в google chrome. Mozilla вообще с какого-то этапа стала предлагать сохранить пришедший ответ с сервера на диске. Тут, как я начал понимать, ExtJs ругается на то, что приходит тип application/json. Но этот MIME тип генерирует Spring, и у меня, логически, нет доступа к этому. Так вот новый вопрос:       Как мне сделать Content-type, отправляемый с сервера, типа text/html, либо принимать любой ответ с сервера как текстовый? Заранее спасибо.

Ответ

Как утверждают доки ExtJS, форма ожидает text/html и с этим, видимо, ничего не поделать. Но можно попробовать возвращать с сервера в методе обработчике бин, обернутый в ResponseEntity TransactionResultMessage message; // Тут все что надо HttpHeaders headers = new HttpHeaders(); headers.setContentType(new MediaType("text", "html", Charset.forName("UTF-8"))); return new ResponseEntity(message, headers, HttpStatus.OK);

Как blob.sql конвертировать на String

Есть вывод с базы JDBC, и там прописан код
str += ("[" + "'" + rs.getInt("ID") + "', " + "'" + rs.getString("NAME") + "', " + "'" + rs.getString("TYPE") + "', " + "'" + rs.getString("DATA") + "', " + "'" + rs.getBlob("MESSAGE") + "', " + "'" + rs.getInt("ID2") + "', " + "'" + rs.getString("NAMEDOCUMENT") + "', " + "'" + rs.getInt("ID1") + "', " + "'" + rs.getString("STATUS") + "'],");
поля Message у меня типа blob, и когда я принимаю его в Ext JS то value у него ссылка на объект как конвертировать что бы на Ext JS выходило значения ??

Ответ

BLOB (binary large object) — это двоичные данные неспецифицированного формата. Не очень понятно, почему у вас Message (вероятно, текстовые данные) хранятся в виде BLOB. Для больших текстовых данных должен использоваться тип CLOB (character large object).
Если вы хотите вывести содержимое BLOB, интерпретируя его, как текст, вам надо знать, в какой кодировке этот текст был туда записан. Предположим, UTF-8. Тогда можно сделать так:
// ограничим максимальную длину блока данных, чтобы память не кончилась int LENGTH_LIMIT = 100_000; Blob blob = rs.getBlob("MESSAGE"); long length = blob.length(); // а лучше кидать исключение, если неожиданно слишком большая длина if(length > LENGTH_LIMIT) length = LENGTH_LIMIT; byte[] data = blob.getBytes(0, (int)length); String message = new String(data, StandardCharsets.UTF_8); // теперь используйте message
В заключение скажу, что формировать JSON конкатенацией строк очень плохо. Вы сильно попадёте на первой одинарной кавычке внутри текста сообщения. Есть много готовых библиотек для того, чтобы сделать это быстро и безопасно.