Разработка интернет-магазина с применением Django

Размещено на http://www.allbest.ru/

Размещено на http://www.allbest.ru/

Содержание

ВВЕДЕНИЕ

1. АНАЛИЗ ПРЕДМЕТНОЙ ОБЛАСТИ

2. ОПРЕДЕЛЕНИЕ ИНСТРУМЕНТОВ РАЗРАБОТКИ

2.1 Выбор языка программирования

2.2 Выбор фреймворка

3. РАЗРАБОТКА САЙТА

3.1 Определение архитектуры сервера

3.2 Определение структуры проекта Django

3.3 Разработка модулей проекта

3.4 Выгрузка товаров на сайт

3.5 Определение внешней структуры сайта

4. ТЕСТИРОВАНИЕ

ЗАКЛЮЧЕНИЕ

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

Приложение 1

Приложение 2

Приложение 3



Аннотация

В данной работе описывается создание интернет-магазина с применением фреймворка Django. Целью работы является полнофункциональный сайт, осуществляющий продажу товаров для рыбалки и туризма. Был проведен анализ уже существующих решений, выбрана аппаратная и программная составляющая сервера. Выполнена разработка архитектуры проекта, реализована интеграция с 1С и системой интернет-эквайринга от Сбербанка. Проведено тестирование проекта, оценка его возможного усовершенствования и развития. В итоге получен сайт, полностью удовлетворяющий требованиям заказчика.



Введение

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

Интернет-магазин обладает рядом преимуществ по сравнению с торговой точкой:

· Нет привязки к часам работы. Доступ к сайту открыт в любое время суток

· Большая аудитория. В современном мире большинство людей пользуется интернетом, многие из которых потенциальные покупатели.

· Уменьшение затрат на производственные издержки. Затраты на продажу товаров в Интернет-магазине ниже, чем в торговой точке.

· Междугородняя торговля. Продажа товаров онлайн позволяет легко реализовывать свою продукцию за пределами одного населенного пункта.

В данной выпускной квалификационной работе описывается разработка интернет-магазина с помощью фреймворка Django. Интернет-магазин подходит для размещения большого количества информации, с помощью программного обеспечения позволяет оперативно обновлять ассортимент, контролировать рабочие процессы, формировать отчетность. В настоящее время имеется множество сайтов по продаже различных товаров и услуг, но многие из них не обеспечивают нужного функционала, а сайты, удовлетворяющие заданным требованиям, чаще всего построены на платных CMS, в следствие чего стоимость таких сайтов достаточно высока.

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

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

После сдачи проекта ведется поддержка и делаются возможные доработки и правки по пожеланию заказчика.



1. Анализ предметной области

К нашему интернет-магазину предъявляются следующие требования:

· Редактирование товаров из админ-панели

· Оформление заказа и хранение его в базе данных.

· Выгрузка товаров из 1с

· Быстрота SEO - продвижения

· Поддержка большого количества товаров (более 70000)

· Фильтрация товаров по атрибутам

· Расчет доставки

Для разработки интернет-магазина существует множество готовых решений, таких как wordpress, joomla, modx, 1с-битрикс и др. Ниже приведена таблица сравнения функционала различных CMS. Для сравнения были выбраны именно эти системы управления сайтом, так как на данный момент они являются наиболее популярными решениями.

Таблица 1 - Сравнение функционала CMS

	Бесплатность	Невысокая сложность	Документация на русском	Выгрузка товаров из 1с	Расчет доставки
Wordpress	+	+	+	+(платная)	+(платная)
Joomla	+	+	+	+(платная)	+(платная)
ModX	+	+/-	+/-	+	+
1с-Битрикс	-	+/-	+	+	+

Wordpress достаточно простая и функциональная система, но для таких узких задач, как выгрузка позиций товаров из 1с и расчет доставки имеет только платные расширения [5]. Данная CMS по большей части предназначена для создания блогов и информационных сайтов [3], поэтому для построения магазинов обычно используют плагин WooCommerce. Более 30% интернет-магазинов мира используют данный плагин, но в первую очередь данная система ориентирована на западный рынок, следовательно, встроена интеграция только с иностранными платежными системами и сервисами [14]. В данном решении могут возникнуть конфликты с другими плагинами, что в свою очередь принесет немалые неудобства. Так же в документации к плагину сказано, что рекомендуемое количество товаров не более 10 тысяч, следовательно, данная система нам не подходит по многим параметрам.

Joomla - бесплатная, гибкая система управления сайтом. Недостатками этого решения являются: проблемы SEO-оптимизации (могут появляться дубли страниц), возможны проблемы с безопасностью (из-за перегруженного кода) [6]. Имеется достаточно большое количество подключаемых модулей, но такие модули как выгрузка из 1с и расчет доставки являются платными, поэтому данная система нас не устраивает.

ModX имеет бесплатные модули выгрузки и расчета доставки [8]. Имеется русскоязычная документация, но сильно сжатая, множество важных моментов не описаны. В отличии от прошлых систем, данная имеет малочисленное русскоязычное сообщество и с ответами на многие вопросы возникают трудности. Так же ModX имеет специфичную терминологию, отличную от других CMS и обладает рядом типовых проблем с безопасностью [9]. Таким образом, данная система управления сайтом не является приемлемым решением поставленной задачи.

1с-битрикс является отличным решением для построения интернет-магазинов. Данная система имеет модули выгрузки и доставки, обладает немалым сообществом, официальной поддержкой, высокой защищенностью и простым интерфейсом [10]. Основной минус такой CMS - это высокая стоимость. К тому же есть проблемы с доработкой стандартных модулей и SEO-оптимизацией, следовательно, данное решение нам не подходит.



2. Определение инструментов разработки

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

2.1 Выбор языка программирования

Основные языки, используемые в разработке серверной части веб-приложений:

· PHP

· Ruby

· Python

PHP - основной язык программирования для веб-разработки. Большинство сайтов работают именно на нем. Но в настоящее время он теряет свою актуальность, ввиду особенностей своей структуры [15]. Самый популярный фреймворк - Laravel.

Ruby - объектно-ориентированный, динамический язык программирования, достаточно популярный на данный момент. Достаточно простой в изучении, обладает высокой скоростью разработки [13]. Самый распространенный фреймворк - RubyOnRails.

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

Преимущества выбранного языка программирования:

· динамическая типизация;

· автоматическое управление памятью;

· удобный, лаконичный синтаксис;

· имеет большое сообщество;

· большое количество полезных библиотек и расширений языка, которые легко использовать в своих проектах, благодаря унифицированному механизму импорта; [1]

· Программы, написанные на Python запускаются на большинстве современных ОС. Высокая переносимость обеспечивает использование языка в самых различных областях [2].

2.2 Выбор фреймворка

Python имеет две основных библиотеки для разработки веб-приложений: Flask и Django.

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

Django - это библиотека языка программирования Python для создания веб-приложений.

Преимущества Django:

· Быстрота: Django был разработан, чтобы помочь разработчикам создать приложение настолько быстро, на сколько это возможно. Это включает в себя формирование идеи, разработку и выпуск проекта, где Django экономит время и ресурсы на каждом из этих этапов.

· Безопасность: При разработке проекта с помощью Django обеспечивает защиту от основных ошибок, которые связаны с безопасностью и ставят под угрозу работоспособность проекта. Исключаются такие часто встречающиеся ошибки, как SQL-иньекции, clickjacking, кросс-сайт подлоги и кросс-сайтовый скриптинг.

· Разносторонность: Django может применяться как менеджер контента, используется в научно-вычислительные платформах, даже крупные организации - со всем этим можно эффективно справляться при помощи Django.

· Обширная документация. Множество примеров, объяснений и открытый исходный код.

· Встроенный ORM (Object-relational mapper). Не требуется использование SQL-синтаксиса в выражениях, что автоматом снижает риск появления SQL-injection уязвимости.

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

· Поддержка MTV (Model-Template-View). Данный паттерн проектирования очень близок к классическому MVC, он позволяет -- это хорошо отделять бизнес-логику от дизайна [2]. Схема взаимодействия такой архитектуры изображена на рисунке 1.

Рисунок 1 - Архитектура MTV

Основные элементы паттерна:

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

View: получает переданный запрос из URL dispatcher, производит его обработку и возвращает клиенту сформированный ответ. Для обработки запроса может потребоваться обратиться к модели и базе данных, если это действие нужно, то View работает с этими компонентами. В классическом паттерне MVC с представлениями (View) сопоставимы контроллеры.

Model: описывает данные, которые используются в модулях проекта. Классы, наследуемые от моделей Django, в основном совпадают с таблицами в базе данных, за исключение абстрактных моделей, для которых таблица в базе не создается.

Template: логику представления переводит в код html-разметки. В паттерне MVC эта составляющая архитектуры совпадает с View, т.е с представлениями.

Когда в приложение поступает запрос, то URL dispatcher определяет, с каким ресурсом сопоставляется данный запрос и передает этот запрос в него. Ресурс фактически представляет собой функцию или View, который получает запрос и производит его обработку. В процессе обработки View может потребоваться обращение к моделям и базе данных, получать из нее какие-либо данные, или записывать в нее данные. Результат обработки запроса возвращается обратно, и этот результат пользователь может наблюдать браузере. Обычно, результат обработки запроса представляет собой сгенерированный html-код, для генерации которого применяются шаблоны (Template), но также это могут быть данные в формате json или других популярных форматах. На страницах 19-20 описывается данный процесс для вывода страницы товара.



3. Разработка сайта

3.1 Определение архитектуры сервера

В качестве операционной системы возьмем Ubuntu 16.04 LTS, т.к. это надежная система с длительной поддержкой.

Веб-сервер может по запросу отдавать пользователям файлы из своей файловой системы, однако он не может напрямую работать с Djangо приложениями. Веб-серверу нужен интерфейс, который будет запускать Django приложение, передавать ему запрос от пользователя и возвращать ответ.

Для выполнения этих задач был разработан Web Server Gateway Interface -- WSGI -- стандарт взаимодействия Python программ и веб-сервра.

uWSGI -- одна из реализаций WSGI. Именно её мы и будем использовать в нашем проекте, потому что такой вариант достаточно легкий, работает отдельно от веб-сервера и его относительно легко настроить [16].

Веб-сервером нам будет служить Nginx, он должен отдавать пользователям файлы из папок media и static, где хранятся статические материал, а все остальные запросы перенаправлять в Django приложение. Nginx превосходен при отдаче статического контента и спроектирован так, чтобы передавать динамические запросы другому ПО предназначенному для их обработки. Так же данный веб-сервер выбирают из-за его эффективного потребления ресурсов и отзывчивости под нагрузкой, а также из-за возможности использовать его и как веб-сервер, и как прокси [17]. Следовательно, Nginx идеально подходит для решения наших задач.

3.2 Определение структуры проекта Django

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

Стандартная структура такого приложения включает в себя такие файлы как: admin.py - настройки вывода в админ-панель; models.py - хранит определение моделей, которые описывают используемые в приложении данные; urls.py - объявляются URL и перенаправление запроса в конкретное представление, views.py - определяет функции, которые получают запросы пользователей, обрабатывают их и возвращают ответ.

В нашем проекте создадим следующие приложения(модули):

1. Catalog - включает структуру каталога и скрипт выгрузки из 1с

2. Index - содержание слайдера и блоков на главной странице

3. Navigation - меню в шапке и подвале сайта

4. Onlineshop - оформление заказов и работа с корзиной товаров

5. Pages - текстовые страницы, новости

6. Site_settings - общие настройки сайта, редактируемые из админ-панели

3.3 Разработка модулей проекта

В начале разберем модуль Catalog. Данное приложение включают в себя следующие модели: Category, Product, PhotoProduct, NameAttr, StringAttrProduct, NumberAttrProduct, DictAttrProduct, DictValueAttr.

Модель Category наследуется от класса MPTTModel из устанавливаемого отдельно пакета, который обеспечивает построение древовидных структур. Данное условие нам требуется, так как категории товаров могут иметь вложенность. Так же это расширение обеспечивает отображение в админ-панели в виде дерева с реализацией технологии «drag-n-drop» (рисунок 2).



Рисунок 2 - Вид древовидной структуры в админ-панели

Обязательными полями выделены: название; слаг (короткое название, которое содержит только английские буквы, числа, подчеркивание или дефис) используются в URL, должен быть уникальным в пределах модели; активность (имеет два варианта значений: активна категория или нет, неактивные не отображаются на сайте, только в админ-панели, по умолчанию является активной); позиция (отвечает за порядок вывода в каталоге, от большего значения к меньшему); количество просмотров (формируется автоматически, по умолчанию присваивается значение 0). Необязательными полями представлены: родитель (внешний ключ на саму модель), фото; идентификатор 1с (ид категории из файла выгрузки); SEO - поля (SEO - заголовок и мета-данные). Листинг модели представлен в приложении 1.

Модель Product так же наследуется от класса MPTTModel, в рамках данной задачи нам это не требуется, но при дальнейшем развитии проекта может потребоваться возможность вложенности товаров. Модель имеет те же обязательные поля, что и у категорий, но к ним добавляются: категория (внешний ключ на категорию к которой принадлежит товар); статус (выбирается из списка вариантов: в наличии, под заказ и нет в наличии); цена; старая цена (если на товар установлена скидка, данный параметр отображается на сайте перечеркнутым); количество на складе; лучшее предложение (если данное поле активно, то товар отображается в блоке лучших предложений на главной странице); новинка ( если поле активно, то в карточке товара будет отображаться значок «new»). Помимо необязательных полей категорий: производитель, артикул, описание, рекомендованные товары (связь многие-ко-многим с другими товарами, связанные товары выводятся внизу карточки). Листинг модели представлен в приложении 1.

Модель PhotoProduct содержит фотографии товара, т.е. имеет два поля: фотография и внешний ключ на товар.

Модель NameAttr отвечает за наименование атрибута товара. Атрибуты могут быть трёх типов: строка, число, справочник. Строковые атрибуты нужны для записи единичных параметров (уникальных, например, встречающихся только у одного товара). Словарные атрибуты являются наиболее распространенными; так как значения выбираются из списка (словаря), дублирование значений практически исключается. Числовые атрибуты нужны, чтобы в такие значения в базе данных хранились в числовом формате и в случае проведения операций с этими данными можно было работать на уровне базы данных, так как это значительно ускоряет работу. Модель NameAttr имеет следующие поля: наименование, тип атрибута (в зависимости от типа выбираются различные типы значений); категории (связь многие-ко-многим с категориями в которых отображается фильтр по данному атрибуту); сортировка, активность, идентификатор 1с. С данной моделью связаны через внешний ключ три модели (StringAttrProduct, NumberAttrProduct, DictAttrProduct), содержащие значение атрибута, связывающие товар и наименование атрибута. В случае с DictAttrProduct (атрибуты справочники) добавляется еще модель DictValueAttr, которая включает в себя значения атрибутов, благодаря этому удается избежать многократного дублирования значений. Листинг модели NumberAttrProduct находится в приложении 1, модели для строковых и словарных атрибутов практически аналогичны.

Для вывода позиций на сайте в файле urls.py прописываем конструкцию, содержащую два обязательных параметра: регулярное выражение и название функции в которую передается объект запроса. Для страницы товара данная конструкция выглядит следующим образом, где cat_slug и pr_slug слаги категории и товара: «url(r'^(?P<cat_slug>.+?)/(?P<pr_slug>.+?)/$', get_product)».

Функция get_product принимает объект в качестве параметров объект запроса request, слаг категории, слаг товара и находится в файле views.py. Получаем товар по заданным слагом и с условием что товар активен. Если такого товара нет или он не активен выдаем ошибку 404. Если товар получен, то находим так же товар дня, так как он присутствует на данной странице. Далее передаем это в нужный шаблон, Django рендерит его и возвращает в качестве ответа. Функция get_product и ее шаблон приведены в приложении 1.

Модуль Onlineshop включает в себя следующие модели: Order и OrderItems.

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

Модель OrderItems - это товарные позиции заказа, то есть товар, его стоимость на момент покупки и количество товара.

Так же модуль Onlineshop содержит множество методов, реализующих функционал сайта. Например, одним из таких методов является добавление товаров в корзину. Данная функция находится в файле api.py. Запросы в нее поступают по адресу «api/addproduct/» (указано в файле urls.py). Запросы на сервер поступают динамически POST методом. В качестве параметров запроса выступают: тип запроса (добавление, удаление, изменение); ид товара; количество товара. Получаем объект товара, если тип запроса добавление или изменение, то проверяем есть ли вообще товары в сессии, если нет, то создаем в сессии словарь с добавленными товарами и переходим к дальнейшим действиям. Далее проверяем нет ли ид данного товара в сессии, если нет, то создаем, иначе либо добавляем, либо устанавливаем нужное количество. Обратно в ответе возвращаем информацию о возможных ошибках, количестве и сумме товаров в корзине. Листинг добавления в корзину с комментариями отображен в приложении 2.

На стороне клиента запрос на добавление посылается с помощью JavaScript, а точнее его библиотеки jQuery (рисунок 3).

Рисунок 3 - Функция добавления товара в корзину

В начале прописываем, чтобы при нажатии на элемент с определенным классом (в нашем случае это кнопка «добавить в корзину») событие передавалось в нашу функцию. Отменяем все события, установленные по умолчанию (переход по ссылке). Извлекаем из нашего элемента параметр «data-id», в который мы выводим ид товара. Далее посылаем ajax-запрос на сервер с параметрами типа добавления и ид товара. Если в ответе сервера значение error равно 0, то заменяем текст кнопки на «В корзине» и меняем число товаров в корзине шапки сайта, иначе выводим уведомление, что данного товара нет больше в наличии.

На сайте предусмотрена онлайн-оплата. Она осуществляется с помощью Интернет-эквайринга от Сбербанка. Обмен с платежным шлюзом осуществляется посредством REST API (обмен с помощью http-запросов). Если пользователь выбирал оплату онлайн, то после оформления заказа его перенаправляет на страницу платежного шлюза, где требуется ввести данные карты. В запросе передается сумма заказа, аутентификационные данные и ссылка, на которую требуется перенаправить пользователя в случае успешной оплаты. После того как пользователь произвел оплату и его перенаправило по нужной ссылке, в обработчике мы посылаем запрос на получение статуса заказа в платежный шлюз и если он действительно оплачен, то меняем на сайте статус заказа на «оплачен». Листинг данного обработчика приведен в приложении 2.

Далее разберем модуль Navigation. В шапке расположена навигация для быстрого перехода по разделам с любой страницы сайта (рисунок 10). Модель данного меню имеет поля: title, href - поле для статических ссылок, position - поле для позиции пункта меню при выводе, object_href - поле для объекта модели, содержащего ссылку. Метод get_menus предназначен для получения объектов меню, отсортированных в соответствии с их позицией (от большей к меньшей). Метод get_absolute_url используется для получения ссылки пункта меню, если есть связанный объект, то получаем его и возвращаем его ссылку, иначе возвращаем статическую ссылку. Данная модель и ее основные методы приведены на рисунке 4.



Рисунок 4 - Модель пункта меню в шапке сайта.

Так как мы не можем связать HeaderMenu со всеми моделями проекта, отображенными на сайте, то введем промежуточную модель HrefModel. Она содержит всего одно поле object_path, отвечающее за путь до объекта модели. Модель имеет три основных метода, в которые передается произвольный объект: generate_object_path - возвращает строку с именем модуля, названием модели и ИД объекта; set_object - сохраняет путь до объекта в HrefModel, если его еще нет и del_object - удаляет данный объект. Модель HrefModel c методами приведена на рисунке 5.



Рисунок 5 - Промежуточная модель для поиска объектов

Чтобы объекты попадали в HrefModel у каждой требуемой модели переопределяем методы save и delete, вызывая в них соответствующие функции сохранения и удаления HrefModel (Рисунок 6).

Рисунок 6 - Переопределение методов с сохранением в HrefModel

Остальные модули строятся по аналогичному принципу, поэтому не будем подробно их рассматривать.



3.4 Выгрузка товаров на сайт

Товары в базе данных заполняются не вручную, а импортируются из 1С. 1С -- программное обеспечение, предназначенное для автоматизации деятельности на предприятии. Данное ПО использует большая часть российских компаний. По статистике продуктами 1С в области автоматизации деятельности предприятия занято 87% данного рынка России [12].

В 1С заносятся товары и их категории. У товаров указываются различные характеристики, описание, фото, информация о цене и количестве на складах. Имеется возможность инициировать выгрузку номенклатуры посредством протокола ftp. 1С формирует папку с картинками и два файла формата «XML»: import.xml (содержит полную информации о всех позициях) и offers.xml (содержит только информацию о цене и количестве). Далее эти файлы загружаются по указанному адресу. Примеры файлов находятся в приложении 3.

Для загрузки данных из файла на сайт, удобнее всего будет создать команду нашему приложению. Чтобы это реализовать добавим в модуль каталог management/commands. Каждого модулю в этом каталоге, Django создаст соответствующую команду. Наша команда будет находить нужный файл в папке, проходить по позициям и записывать их в базу данных.

В целях упрощения работы с форматом XML, применим библиотеку lxml, а конкретно ее модуль для парсинга ElementTree (etree).

В первую очередь с помощью функции scandir ищем в папке импорта требуемые файлы, если файлы не найдены, то завершаем процесс импорта. Далее импортируем категории товаров, которые в 1с находятся под тегом «Группа» (так как XML-документ имеет пространство имен, то при каждом поиске к тегу прибавляем название пространства имен). Используем метод iterparse, в который передаем путь до файла, название искомого тега и список отслеживаемых событий (в нашем случае лишь одно событие - конец файла), а возвращает он Python-итератор для контекста выбранного элемента. Плюсом данного метода является то, что он не считывает файл целиком. Проходим циклом по результату поиска и у каждого элемента извлекаем нужные нам параметры с помощью метода find, в который передаем наименование тега. У возвращаемого результата метода берем атрибут text и удаляем возможные пробелы и символы переноса, чтобы выделить только нужную информацию. Слаг для категории формируем из названия с помощью функции slugify, если категория с таким слагом уже существует, но ид различается, то добавляем цифру в конец до тех пор, пока не достигнем уникальности. Проверяем существует ли данная категория в базе, если да, то обновляем информацию, иначе создаем новую. Далее импортируем все свойства и их значения. В проекте представлено три типа свойств: словарные, числовые и строковые, в выгрузке тип свойства явно указывается под тегом «ТипЗначений». Следующим шагом импортируем товары. Находим в базе категорию товара по ид и привязываем к нему. Так же по ид ищем свойства и связываем с товаром. Последним шагом импортируем картинку, копируя ее в папку media. Функция импорта категории приведена на рисунках 7-8.

Рисунок 7 - Импортирование категорий в цикле



Рисунок 8 - Функция импорта категории

Для организации автоматического запуска выгрузки используем сторонний модуль “chronograph”. Данный модуль работает с программой cron для периодического выполнения заданий в UNIX-системах [18]. Данный модуль обеспечит нам выгрузку по расписанию с редактированием периодичности задач из панели и информацией о выполнении задач (рисунок 9).



Рисунок 9 - Отображение модуля “chronograph” в админ-панели.

В поле Command мы выбираем команду, которую следует выполнить. В нашем случае это самостоятельно написанная команда import1c. Args содержит аргументы, передаваемые в команду, от которых зависит поведение скрипта. В поле Frequency выбирается периодичность выполнения команды от минуты до недели. Поля в пункте Next run отвечают за время и дату следующего запуска, после выполнения команды дата следующего запуска переводится автоматически, в зависимости от выбранной периодичности.

3.5 Определение внешней структуры сайта

Выделим основные части нашего сайта:

· Шапка

· Подвал

· Главная страница

· Каталог товаров

· Новости

· Контакты

· Корзина

· Оформление заказа

Шапка сайта играет очень важную роль, так как присутствует на всех страницах сайта, из нее можно перейти в любой раздел сайта. Скриншот расположен на рисунке 10.

Рисунок 10 - Шапка сайта

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

Рисунок 12 - Поиск по сайту

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

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

Рисунок 13 - Подвал сайта

Главная страница в большинстве случаев является первой, на которую попадает пользователь при переходе на сайт, поэтому она содержит всю основную информацию, которая может заинтересовать пользователя и направить в нужный раздел сайта. Главная страница отображена на рисунках 14-16.

Рисунок 14 - Главная страница сайта 1/3

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

Чуть ниже располагается блок с производителями, товары которых распространяет данная компания.

Рисунок 15 - Главная сайта 2/3

Блок с лучшими предложениями недели и рекламный блок так же помогают дополнительно привлечь потенциальных покупателей к различным специальным предложениям.

Рисунок 16 - Главная страница 3/3



Внизу главной расположен блок с последними новостями компании и блок с полезными видеоматериалами.

Структура главной страницы сайта сразу помогает сориентировать пользователя в нужный раздел и информирует о акциях и специальных предложениях.

В каталоге товаров пользователь может просматривать категории и товары. Есть возможность фильтровать товары по различным параметрам, таким как: стоимость, производитель, габариты и так далее. Предусмотрен выбор сортировки по возрастанию цены, по убыванию и по популярности (количество просмотров). Страница категории с товарами отображена на рисунке 17.

Рисунок 17 - Страница категории

В блоке слева находятся фильтры. Для каждой категории определено два обязательных фильтра - цена и наличие, остальные фильтры формируются в зависимости от их заполненения в товарах данной категории. При нажатии кнопки «показать» происходит фильтрация и товары динамически обновляются (без перезагрузки страницы) с помощью технологии ajax. Справа расположена кнопка выбора сортировки, по умолчанию она имеет значение: по возрастанию цены.

На странице товара находится описание товара, характеристики, информация о цене и наличии, а также фотографии (рисунок 18).

Рисунок 18 - Страница товара 1/2

Справа расположен блок с информацией о цене и тремя кнопками для действий с товаром. Кнопка «купить» добавляет одну единицу товара в корзину. При нажатии на кнопку «в кредит» всплывает форма, отправив которую менеджеру магазина поступит сообщение о заявке на оформление кредита, чтобы в дальнейшем он связался с клиентом и обсудил вопросы возможного кредитования. Кнопка «купить в 1 клик» направляет пользователя на страницу оформления заказа. В самом низу страницы находятся рекомендованные товары (рисунок 19).



Рисунок 19 - Страница товара 2/2

В разделе новости имеются текстовые страницы с информацией компании, а также полезные видеоматериалы (рисунок 21). Кнопки «больше статей» и «больше видео» обеспечивают динамическую подгрузку материалов. При клике на иконку в подразделе видеоматериалов открывается модальное окно со встроенным в фрейм видео с видеохостинга «Youtube» (рисунок 20).

Рисунок 20 - Модальное окно с видео



Рисунок 21 - Раздел новостей

Страница с контактами содержит в себе карту с отметками всех торговых точек компании и их контактные данные с информацией о режиме работы и фотографией. Скриншот страницы контактов расположен на рисунке 22.



Рисунок 22 - Страница «контакты»

Корзина товаров содержит список всех добавленных товаров с информацией о итоговой сумме (рисунок 23).

Рисунок 23 - Корзина товаров

С помощью кнопок «+» и «-» можно редактировать количество товаров, обновление количества и итоговой суммы так же осуществляется динамически. При выбранном количестве товаров большем чем на складе появляется уведомление о превышении заданного количества и заданное число будет возвращено к предыдущему (рисунок 24).

Рисунок 24 - Предупреждение о превышение количества.

На странице заказа отображена информация о позициях в заказе и форма для контактных данных, возможен выбор оплаты онлайн (рисунок 25).

Рисунок 25 - Оформление заказа

После оформления, в зависимости от варианта оплаты пользователя перенаправит либо на главную страницу, либо на страницу оплаты Сбербанка.



4. Тестирование

Тестирование выступает завершающим этапом в разработке сайта. В результате тестирования выявляются ошибки в проекте, оценивается соответствие требованиям заказчика. На основе тестирования принимается решение о готовности проекта к сдаче заказчику.

На начальном этапе проектирования проверяется весь функционал сайта. В данном проекте были протестированы следующие элементы:

· отправка контактных форм

· добавление товаров в корзину

· удаление товаров из корзины

· счетчики просмотров товаров и категорий

· изменение количества уже добавленного товара

· фильтрация

· поиск

· выгрузка из 1С

· редактирование позиций из интерфейса администратора

· оформление заказа

В тестировании безопасности сайт не нуждается, так как Django обеспечивает защиту от основных видов атак. Дополнительные меры безопасности с заказчиком не обсуждались.

Тестирование быстродействия (проверка скорости загрузки сайта для оценки скорости работы скриптов, загрузки изображений и контента. Данный вид тестирования позволяет выявлять проблемные участки сайта, чтобы в дальнейшем оптимизировать процесс загрузки. А также результаты позволяют оценить соответствие сайта поставленным требованиям быстродействия. Показательными результатами будет время ответа сервера при загрузке страницы категории, так как на данной странице находятся фильтры, формирование которых наиболее ресурсозатратно. Результаты отображены на рисунке 26.

Рисунок 26 - Время загрузки страницы категории.

Сайт тестировался с общим количеством товаров около 53 тысяч. По результатам тестирования видно, что время ответа сервера составляет 1.45 секунды, остальное время можно не принимать во внимание, так как оно напрямую зависит от скорости интернет-соединения.



Заключение

Результатом выполнения выпускной квалификационной работы является web-сайт, полностью удовлетворяющий требованиям заказчика. Данный Интернет-магазин ориентирован на розничных и мелкооптовых покупателей. С его помощью можно просматривать качественные и количественные характеристики товаров и услуги, предоставляемые компанией, совершать их заказ. Также сайт содержит информацию о торговых точках, складах, контактах и акциях. Имеется возможность задать вопрос и предусмотрена онлайн-оплата заказа, что упрощает процесс покупки товаров.

При разработке проекта были проанализированы современные технологии и паттерны программирования, позволяющие создавать конкурентоспособные web-сайты. Отличным решением для выполнения поставленной задачи оказались язык программирования Python и фреймворк Django.

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



Список ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

1. Информация о языке программирования Python [Электронный ресурс] - Режим доступа: https://ru.wikipedia.org/wiki/Python

2. Преимущества языка Python [Электронный ресурс] - Режим доступа: https://metanit.com/python/

3. Django документация [Электронный ресурс] - Режим доступа: https://djbook.ru/rel1.9/intro/overview.html

4. Плюсы и минусы Django [Электронный ресурс] - Режим доступа: https://python-scripts.com/django-obzor

5. Обзор Wordpress [Электронный ресурс] - Режим доступа: http://seoslim.ru/gg/chto-takoe-wordpress-cms-opisanie-raboty.html

6. Характеристика Joomla [Электронный ресурс] - Режим доступа: https://ru.wh-db.com/article/preimushestve-i-nedostatki-joomla/

7. Сравнение Wordpress и Joomla [Электронный ресурс] - Режим доступа: http://fb.ru/article/143114/joomla-ili-wordpress-chto-luchshe-joomla-ili-wordpress

8. Обзор ModX [Электронный ресурс] - Режим доступа: https://modx.ru/o-sisteme-modx/modx-evolution/

9. Плюсы и минусы ModX [Электронный ресурс] - Режим доступа: https://contextonline.ru/blog/plyusy-minusy-cms-modx/

10. 1с-битрикс (Описание cms) [Электронный ресурс] - Режим доступа: https://www.1c-bitrix.ru/solutions/eshop/

11. Описание архитектуры Django [Электронный ресурс] - Режим доступа: https://metanit.com/python/django/1.1.php

12. Статистика использования 1С [Электронный ресурс] - Режим доступа: http://sci-article.ru/stat.php?i=1469161854

13. Сравнение языков Python и Ruby [Электронный ресурс] - Режим доступа: https://losst.ru/sravnenie-python-vs-ruby

14. Плюсы и минусы woocommerce [Электронный ресурс] - Режим доступа: https://oriolo.ru/wordpress-i-woocommerce/

15. Плюсы и минусы PHP, Ruby, Python [Электронный ресурс] - Режим доступа: http://www.internet-technologies.ru/articles/php-ruby-python-harakteristika-yazykov-programmirovaniya.html

16. Описание uWSGI [Электронный ресурс] - Режим доступа: https://ru.wikipedia.org/wiki/UWSGI

17. Характеристики Nginx [Электронный ресурс] - Режим доступа: https://sheensay.ru/nginx

18. Информация о cron [Электронный ресурс] - Режим доступа: http://help.ubuntu.ru/wiki/cron



Приложение 1

Исходный код некоторых элементов модуля Catalog

Модель Category:

class Category(mptt_models.MPTTModel, WebObjectInterface):

parent = mptt_fields.TreeForeignKey('self', verbose_name = "Категория-родитель", blank=True, null=True, related_name='child', on_delete = models.CASCADE)

title = models.CharField(verbose_name = "Наименование", null = True, blank = True, max_length = 300)

photo = FilerImageField(verbose_name = "Фото", null = True, blank = True, default = "", related_name = "category_photo")

slug = models.SlugField(verbose_name = "Слаг", default = "", null = False, blank = False, unique = True, max_length = 300)

id_1c = models.CharField(verbose_name = "Идентификатор в системе 1С",null = True,blank = True, max_length = 300)

# seo настройки

seo_title = models.CharField(verbose_name ="SEO заголовок страницы", null = True, blank = True, max_length = 300)

meta_description = models.TextField(verbose_name = "Meta Description", null = True, blank = True)

meta_keywords = models.TextField(verbose_name = "Meta Keywords", null = True, blank = True)

active = models.BooleanField(default = True, verbose_name = "Активная категория")

description = RichTextUploadingField(verbose_name = "Описание категории", null = True, blank = True)

position_on_site = models.IntegerField(verbose_name = "Позиция отображения на сайте", default = 500)

count_showing = models.IntegerField(default = 0, verbose_name = "Количество просмотров")

Модель Product:

class Product(mptt_models.MPTTModel, WebObjectInterface):

# Внешний ключ на родительский товар, может быть пустым #

parent = mptt_fields.TreeForeignKey('self',verbose_name = "Товар-родитель", related_name = 'child', blank = True, null = True)

# Внешний ключ на категорию товара, может быть пустым #

category = models.ForeignKey(Category, verbose_name = "Категория товара", related_name = "products", blank = True, null = True)

# Внешний ключ на производителя, может быть пустым, по умолчанию пустая строка #

manufacturer = models.ForeignKey(Manufacturer, verbose_name = "Производитель", blank = True, null = True, default="", related_name = "products")

# Активность товара(отображается на сайте, иначе только в админ-панели), по умолчанию товар активен. #

active = models.BooleanField(verbose_name = "Активный товар", default = True)

# Слаг используется для генерации URL, поле должно иметь уникальное значение, обязательное поле #

slug = models.SlugField(verbose_name = "Слаг" , null = False, blank = False, unique = True, max_length = 300)

# Название товара, обязательное поле #

title = models.CharField(verbose_name = "Заголовок", null = False, blank = False, max_length = 300)

# Описание товара, необязательное поле #

description = RichTextUploadingField(verbose_name = "Описание", null = True, blank = True)

# Артикул, необязательное поле #

upc = models.CharField(verbose_name = "Артикул", blank = True, null = True, max_length = 100)

# Статус товара выбирается из списка значений "В наличии","Под заказ" и "Нет в наличии" #

status = models.IntegerField(verbose_name = "Статус", choices = status_product, default = 0)

# Идентификатор в системе 1с, необязательное поле, так как товар может быть добавлен вручную #

id_1c = models.CharField(verbose_name = "Идентификатор 1С",null = True,blank = True, max_length = 300)

# Различные сео настройки, необязательные поля #

seo_title = models.CharField(verbose_name = "SEO заголовок", blank = True, null = True, max_length = 300)

meta_description = models.TextField(verbose_name = "Meta Description", null = True, blank = True)

meta_keywords = models.TextField(verbose_name = "Meta Keywords", null = True, blank = True)

seo_content = RichTextUploadingField(verbose_name = "SEO статья", null = True, blank = True)

# Цена товара, по умолчанию равна 0 #

price = models.IntegerField(verbose_name = "Цена", default = 0)

# Старая цена товара; если не 0, то товар отображается как "со скидкой" #

old_price = models.IntegerField(verbose_name = "Старая цена", default = 0)

# Количество товара на складе, при добавлении в корзину проверяется возможность покупки #

count = models.IntegerField(default = 0, verbose_name = "Количество товаров")

# Количество просмотров #

count_showing = models.IntegerField(default = 0, verbose_name = "Количество просмотров")

# Если поле активно, то товар отображается в блоке "Лучшее предложение недели" #

best_offer = models.BooleanField(verbose_name = "Лучшее предложение недели", default = False)

# Если поле активно, товар отображается в новинках #

new = models.BooleanField(verbose_name = "Новинка", default = False)

# Связь товара многие-ко-многим с самим собой, данное поле содержит рекомендованные товары #

recommendets = models.ManyToManyField("self", symmetrical=False,blank = True, verbose_name = "Рекомендованные товары", related_name="variations_to")

Модель NameAttr:

class NameAttr(models.Model):

title = models.CharField(verbose_name = "Наименование", blank = False, null = False, max_length = 150)

# Три типа атрибутов: строковые, числовые и словарные

type_attr = models.IntegerField(verbose_name = "Тип атрибута", choices = types_attrs, default = 0, help_text = "в зависимости от типа атрибута будут выводиться различные зависимости")

ordering = models.IntegerField(verbose_name = "Сортировка", default = 0 )

active = models.BooleanField(verbose_name = "Отображать на сайте", default = True)

categorys = models.ManyToManyField(Category,verbose_name = "Категории в которых отображается фильтр", default = "",blank = True, related_name = "attrs_category")

id_1c = models.CharField(verbose_name = "Идентификатор в системе 1С", blank = True, null = True, max_length = 300)

Модель NumberAttrProduct:

class NumberAttrProduct(models.Model, AttrProductInterface):

product = models.ForeignKey(Product, verbose_name = "Товар", null = False, blank = False, related_name = "productnumberattrs")

type_attr = models.ForeignKey(NameAttr, verbose_name = "Наименование атрибута", related_name = "numberattrs")

value_attr = models.FloatField(verbose_name = "Значение атрибута")

Функция get_product для вывода страницы товара:

def get_product(request, cat_slug, pr_slug):

try:

product = catalog_models.Product.objects.get(active = True, slug = pr_slug, category__slug = cat_slug)

except:

raise Http404

settings = Settings.get_singleton()

object = product

product_day = IndexSettings.objects.first().render_product_day()

Шаблон страницы товара:

<!-- наследуем базовый шаблон с шапкой и подвалом -->

{% extends "base.html" %}

<!-- подключаем тег для сжатия картинок -->

{% load thumbnail %}

<!-- переопределяем блок контента наследуемой страницы-->

{% block content %}

<section class="card page">

<div class="container">

<div class="row">

<div class="col-12">

<nav class="breadcrumbs">

<ul class="breadcrumbs__list">

<!-- циклом проходимся по результатам метода продукта

генерирующему хлебные крошки и выводим их -->

{% for cat in product.get_breadcrumps%}

<li>

{%if not forloop.last%}

<a href="{{cat.0}}">{{cat.1}}</a>

{%else%}

{{cat.1}}

{%endif%}

</li>

{% endfor %}

</ul>

</nav>

<div class="main__heading page__heading card__heading">

<!--получаем название товара-->

<span class="main__heading_name page__heading_name">{{product.get_title}}</span>

<div class="card__heading_wrapper">

<!-- если у товара есть производитель выводим блок с ним -->

{% if product.get_manufacturer %}

<div class="card__heading_brand">

<img src="{{product.get_manufacturer.get_photo}}" alt="">

</div>

{% endif %}

<!-- если у товара есть артикул, то выводим его -->

{% if product.get_upc %}

<span class="card__heading_articul">Артикул: {{product.get_upc}}</span>

{% endif %}

</div>

</div>

</div>

</div>

</div>

<div class="container">

<div class="row">

<div class="col-12">

<div class="card__wrapper">

<div class="row">

<div class="col-md-6 col-12">

<div class="card__slider">

<!-- выводим фото товара, если их нет, то выводим заглушку -->

{% for photo in product.get_photos %}

<!-- обрезаем выводимое изображение до требуемого нам размера в пикселях-->

<div class="card__slider_slide"><img src="{% thumbnail photo.photo 639x415 crop %}" alt=""/></div>

{% empty %}

<div class="card__slider_slide"><img src="/static/images/stub639.jpg" alt=""/></div>

{% endfor %}

</div>

<div class="card__slider_nav">

{% for photo in product.get_photos %}

<div class="card__slider_slide"><img src="{% thumbnail photo.photo 153x100 crop %}" alt=""/></div>

{% endfor %}

</div>

</div>

<div class="col-md-6 col-12">

<div class="card__infoblock">

<div class="card__infoblock_actions">

<!-- выводим информацию о стоимости -->

<div class="card__infoblock_price"><b class="card__infoblock_price--current">{{product.get_format_price}}</b>

<strike class="card__infoblock_price--oldest">{{product.get_format_old_price}}</strike>

</div>

<div class="card__infoblock_buttons">

<button class="card__infoblock_buttons--incart the_button" data-name="Купить" data-id="{{product.id}}"></button>

<button class="card__infoblock_buttons--incredit the_button modal_v_kredit">В кредит</button>

<button class="card__infoblock_buttons--onclick">Купить в 1 клик</button>

</div>

</div><span class="card__infoblock_tagging">Цена в интернет-магазине может отличаться от магазинов</span>

<div class="card__infoblock_attrs">

<!-- выводим основные атрибуты товара-->

{% for attr in product.get_main_attrs %}

<span class="card__infoblock_attr">

<span class="card__infoblock_attr__name">{{attr.type_attr}}: </span>

<span class="card__infoblock_attr__value"> {{attr.get_value}}</span>

</span>

{% endfor %}

{% if product.get_attrs %}

<a class="card__infoblock_anchor" href="#card_description">Все характеристики товара</a>

{% endif %}

</div>

</div>

</div>

</div>

</div>

<div class="card__wrapper">

<div class="row">

<div class="col-md-4 col-12">

<div class="card__description" id="card_description">

<div class="main__heading"><span class="main__heading_name">Описание</span></div>

<div class="page__single_content">

{{product.get_description|safe}}

</div>

</div>

</div>

<div class="col-md-4 col-12">

<!-- выводим остальные атрибуты товара -->

{% if product.get_attrs %}

<div class="card__characters">

<div class="main__heading"><span class="main__heading_name">Характеристики</span></div>

<div class="card__characters_attrs">

{% for attr in product.get_attrs %}

<div class="card__characters_attr"><span class="card__charaters_attr__name">{{attr.type_attr}}</span><span class="card__characters_attr__value">{{attr.get_value}}</span></div>

{% endfor %}

</div>

</div>

{% endif %}

</div>

<div class="col-md-1 col-12"></div>

<!-- выводим товар дня -->

<div class="col-md-3 col-12">

{{product_day}}

</div>

</div>

</div>

{% if product.get_recommendations %}

<div class="main__heading card__heading">

<span class="main__heading_name">Рекомендуем</span>

</div>

{% endif %}

</div>

<!-- выводим рекомендованные товары -->

{% for r in product.get_recommendations %}

{{r.render_product_index}}

{% endfor %}

</div>

</div>

</section>

<!-- закрываем переопределяемый блок -->

{% endblock %}



Приложение 2

Исходный код некоторых элементов модуля Onlineshop

Добавление товара в корзину:

# Добавление товара в корзину

def add_product_to_checkout(request):

# Из объекта запроса получаем POST-параметр "type", если такой параметр отсутствует, то тип операции будет "add"(добавление одного товара)

type_add = request.POST.get("type", "add").strip(" \n\t")

# Если тип "delete", то передаем реквест в функцию удаления товара из сессии и возвращаем информацию о количестве товаров в корзине и сумме

...