2014-12-17 3 views
1

Новое в Django и Ajax в целом.Должен ли я визуализировать ответы ajax на стороне сервера?

Мне было интересно узнать общий вопрос о хорошем веб-дизайне: Если функция вида, которая возвращает вызов, называемый с помощью ajax, возвращает структуры данных и оставляет рендеринг HTML-страниц на стороне клиента (что означает javascript) или это также «хорошо» практика, чтобы отобразить весь HTML и вернуть его в javascript, чтобы он мог вставить его где-нибудь в коде?

Я не хочу, чтобы логика моих шаблонов повторялась javascript. Я хочу использовать шаблоны для рендеринга HTML и вернуть его клиенту. Но ... это не соответствует точке аякса, не так ли?

я наткнулся на эту фантастическую должность: Rendering JSON objects using a Django template after an Ajax call

Поскольку это старый, я не отправлял ответ там, а возродили этот вопрос здесь. Можно ли технически отобразить на стороне сервера? да. Лучшая практика? Я не знаю.

Возможно, лучшей практикой является то, что мои HTML-страницы образуют «пустые пространства», уже хорошо сформированные и просто передают данные назад и вперед.

Я хотел бы услышать ваше мнение по этому вопросу.

После удержания, поскольку это обсуждение имеет тенденцию быть основанным на мнениях (оно есть), и этот формат не подходит для этого форума, хотя было бы полезно обновить сообщение, чтобы включить более тонкое разрешение обсуждения с очень технические последствия.

Что в вашем опыте «djangonian» было бы лучшей практикой для создания веб-страницы, такой как лента новостей, которая может динамически обновляться с помощью вызовов ajax, которые возвращают необработанные данные клиента (с использованием JSON для пример), а не предварительно обработанный HTML?

Я уточню: У меня есть сайт. На этом канале пользователь видит много сообщений и комментариев за сообщение. Каждое сообщение представляет собой собственную HTML-форму и уже структурировано как HTML. Пример источника страницы:

<form id="post_looloo_by_testuser" method="post" action="/bz/login/" class="single_post_form">  
    <input type='hidden' name='csrfmiddlewaretoken' value='GfOHEMxx433XBUpg3yakTYPRQCVq132f' /> 
    <p class="box_single_post"> 
     <span name="post"> 
     <label class="single_post_form"> 
      says: looloo 
     </label> 
     </span> 

     <span name="comments_for_post"> 
     <span name="single_comment"> 
      <label class="single_comment"> 
      testuser2 commented: moomoomoo 
      </label> 
     </span> 
     </span> 


     <span name="comments_for_post"> 
     <span name="single_comment"> 
      <label class="single_comment"> 
      testuser2 commented: qweqwe 
      </label> 
     </span> 
     </span> 


     <span name="add_comment"> 
     <input id="id_add_comment" maxlength="140" name="new_comment" type="text" placeholder="Add a comment..."/> 
     </span> 
    </p> 
</form> 

На вершине, как и на Facebook, пользователь может добавить новый пост мгновенно.

<form id="add_post_form" method="post" action="" class="new_post_form" username="testuser"> 
    <input type='hidden' name='csrfmiddlewaretoken' value='GfOHEMxx433XBUpg3yakTYPRQCVq132f' /> 
    <span name="add_post">   
    <input id="id_add_post" maxlength="140" name="new_post" type="text" placeholder="Say something"/> 
    <input id="add-post-btn" type="submit" name="submit" value="Add" username="testuser"/> 
    </span> 
</form> 

Кнопка «Добавить» (на самом деле представить в виде) затем ссылаться на Ajax вызов определенной точки зрения в мое приложение на стороне сервера. Я хочу, чтобы представление возвращало информацию, такую ​​как пользователь, которому принадлежит сообщение, текст сообщения, список комментариев и т. Д. Информация будет возвращена как JSON или XML. Не как предварительно обработанный HTML. Я хочу, чтобы мой javascript обрабатывал информацию и обновлял фид пользователя с новым сообщением сверху, избегая при этом обновления страницы (отсюда и использование ajax).

Проблема заключается в том, что пользователь может, конечно, добавить бесконечное количество сообщений (или ограниченное число, но больше одного). Почему это имеет значение? см. ниже вопрос:

Как создать страницу подачи таким образом, чтобы я мог просто обновлять переменные на странице с помощью динамически извлекаемой информации и по-прежнему допускать добавление дополнительных сообщений?

Если бы я заранее знал, что доступно только одно такое новое сообщение, я бы создал предварительно созданную почтовую форму, невидимую, и javascript установил значения в эту форму и установил бы ее на видимую. Но как насчет второго сообщения, которое добавляет пользователь? и третий? и так далее ...

Я хотел бы узнать из вашего опыта. Спасибо.

+0

Hello.Duly отметил. Я редактировал свой пост, чтобы лучше соответствовать характеру этого форума. Спасибо. – dotaneli

ответ

0

Я думаю, что очень важно немного отступить и вырвать некоторую терминологию здесь. Визуализация, как вы используете его, может относиться к нескольким вещам:

  • Рендеринг HTML-теги и правила CSS в браузере, чтобы создать представление веб-страницы для пользователя, на основе данных, полученных от сервера или серверов.
  • Предоставление данных на какой-либо отклик на стороне сервера, который должен использоваться браузером клиента, или любой другой инструмент, который используется для использования используемого протокола (HTTP в этом случае).

Это разные виды деятельности, которые действительно не связаны друг с другом, но я думаю, что способность использовать один и тот же термин для обозначения обоих может сбить вас с толку. Django выдаст ответ на HTTP-запрос с запросом ресурса, независимо от того, содержит ли этот ответ HTML или JSON или обычный текст.

Теперь, говоря, что вы хотите сделать больше работы по созданию веб-страницы, чтобы найти определенный способ на стороне сервера (шаблон) или на стороне клиента (js), скорее, является вопросом стиля (с некоторые допущения в отношении практик, которые могут возникнуть из вашего конкретного случая использования, конечно).

Для моих собственных целей я обычно предпочитаю отображать общие данные (возможно, название организации, переменные о навигации и т. Д.) В шаблоне, и если я показываю неизвестный или большой объем данных, извлеченных из db, Я закрою вызов AJAX для этого и покажу пользователю указание, что данные загружаются.

Но опыт будет вашим руководством относительно того, что подходит и когда.

1

Нет, не следует.

AJAX-вызовы должны содержать только запрошенный ресурс в стандартном формате, а не какой-либо пользовательский HTML, например, если я делаю запрос для /cars Я ожидаю получить список экземпляров car в стандартном формате (JSON или XML) , сервер базы данных не должен знать и не заботиться о том, как я представляю эти данные.

Также рекомендуется генерировать HTML-код на стороне клиента, чтобы избежать передачи ненужных данных по проводу, скажем, я запрашиваю /cars и получаю несколько сотен тысяч из них, каждый из которых имеет разметку HTML-таблицы. это много ненужной разметки, которая может быть добавлена ​​на стороне клиента без необходимости передавать ее по кабелю, поэтому она экономит полосу пропускания, и это важно, особенно для мобильных пользователей.

Наконец, контроллеры для конечных точек, вызываемых через AJAX, должны быть простыми и не содержать какого-либо кода, связанного с просмотром, сначала сократить время отклика на несколько миллисекунд, а во-вторых, чтобы, если вы хотите изменить пользовательский интерфейс, вы будете измените его в своих файлах HTML/CSS/JS, которые в зависимости от сложности вашего решения могут быть частью другого приложения вообще (что, если ваше приложение служит только для предоставления API для стороннего веб-клиента? Вам понадобится третий чтобы управлять презентацией, пока вы предоставляете только исходные данные).

Что касается вашего редактирования, я действительно не понимаю, в чем проблема с добавлением на страницу потенциально бесконечного количества элементов HTML ... Вам не нужно, чтобы каждый элемент был объявлен заранее в файле HTML, вы могут создавать бесконечное количество их на лету через Javascript, а затем вставлять их туда, где вы хотите.

Для вашего вопроса «как бы я делал вопрос с подачей новостей на AJAX?», Это зависит от моей мотивации, и это зависит от базовой серверной страницы с дополнительным обновлением AJAX (шаблон живет как на сервере, так и в Javascript для представления данных AJAX) в полное приложение Ember с сервером, предоставляющим JSON API.

+0

Я склонен согласиться с тем, что дизайн-мудрый - он более изящный и менее связан с дизайном серверной части, отвечающей структурами данных, а не сформированным HTML. Он также позволяет, как вы полагаете, для подключения нескольких типов потребителей. то есть веб-браузеры, мобильные приложения и т. д. Очевидно, что HTML, который я визуализую для отображения в веб-браузере, вероятно, недостаточно хорош для моего HTC. Мое родное приложение Android и/или родное приложение для приложений iOS ожидало бы, конечно, данных «raw-er», если я захочу избежать HTML. Но - скажем так. Но все же - могу ли я избежать повторения своих шаблонов в javascript? – dotaneli

+0

@ dotaneli вы можете попробовать искать механизмы шаблонов, которые являются объектно-ориентированными, так что вы можете повторно использовать те же файлы шаблонов как в интерфейсе, так и в бэкэнде. Другим вариантом было бы предоставление «динамических» данных (данных, которые вы обновляете через AJAX) непосредственно на стороне клиента при загрузке страницы, и в этом случае эти части шаблонов будут только в Javascript. –

+0

@ dotaneli oh и, кстати, нет такой вещи, как браузер, который ожидает данные «raw-er», браузер просто следует тому, что говорит ваш код, он не заботится о шаблонах проектирования или эффективности; мой плохой пример о том, как отправить тысячи экземпляров модели с ненужной разметкой, будет работать очень медленно на некоторых подключениях, но это сработает, и у браузера не будет причин жаловаться. –

1

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

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

В этом случае, если вы измените что-либо в django, вам придется дублировать код клиента.

Лично я считаю, что рендеринг на сервере безопаснее и проще.

0

Спасибо всем за ваши ответы.

Я хотел обновить, что я решил пойти с элегантным решением, которое также оказывается более практичными, то есть позволить сторону клиента сделать работу:

я только передать постные элементы JSON на сторону клиента ; Я позволю клиенту сгенерировать соответствующий HTML.

Действительно, это своего рода «повторение», поскольку серверная и клиентская стороны имеют одинаковые сегменты кода, обрабатывающие создание точно таких же сегментов HTML.

Тем не менее, мне стало ясно, что слабая связь в данном случае имеет решающее значение для возможности масштабирования на другие интерфейсы без ПК, таких как Android, IOS, Windows Phone и т.д.

Более того - это быстрее, чем путь. Не нужно обременять серверную часть обработкой неограниченного количества HTML, когда клиентская сторона может это сделать.

Спасибо всем снова.

Мое заключение - сделайте это правильно, даже если это, по-видимому, будет стоить дороже.

Смежные вопросы