Объединение Angularjs и CodeIgniter
Я работаю над существующим сайтом, написанным в CodeIgniter, и мы рассматриваем использование AngularJS для некоторых страниц, для которых требуется много функциональных возможностей интерфейса, но мы не хотим заменять все все представления CodeIgniter (сразу).
Итак, я нажимаю ссылку, управляемую маршрутизатором angular, и обрабатывается javascript, но следующая ссылка может быть "нормальным" запросом, который должен обрабатываться каркасом CodeIgniter.
Есть ли элегантный способ объединить эти два метода? Я не против некоторых дополнительных клиентских накладных расходов, потому что сайт еще не работает в производстве.
Ответы
Ответ 1
Похоже, вы пытаетесь постепенно использовать маршрутизацию Code Igniter (CI), поскольку ваше приложение angular растет. Это не сложно, но требует много деталей. Какой метод будет работать, зависит от структуры вашего проекта. Примечание. Я удалил index.php из URL-адресов Ignit Code, поэтому приведенные ниже пути могут отличаться от стандартных.
1) Код Зажигатель установлен в корневой каталог
Если CI установлен в корневом каталоге вашего сервера, вы можете создать папку внутри CI (например, у меня есть папка "ng" ). Ваш проект будет выглядеть так:
/controllers
/models
/ng
(etc)
/index.php (code igniter index file)
поместите файл .htaccess в /ng
со следующим:
Order allow, deny
Allow from all
Это позволяет напрямую обращаться к файлам в /ng
, а не отправлять эти запросы обратно через систему маршрутизации CI. Например, вы можете загрузить это прямо сейчас:
example.com/ng/partials/angular-view.html
Основная веб-страница по-прежнему будет создана Code Igniter, но теперь она может включать в себя angular активы, такие как частичные представления и т.д. В конце концов вы можете заменить большую часть того, что делает Code Igniter, просто вернув простую страницу, и angular загружает частичные виды из /ng
, как и для.
Этот метод хорош, потому что Code Igniter может контролировать, загружается ли эта начальная страница вообще (через некоторый код аутентификации пользователя в вашем контроллере CI). Если пользователь не вошел в систему, они перенаправляются и никогда не видят приложение angular.
2) Запуск кода в каталоге
Если CI установлен в каталоге, например example.com/myapp/(code igniter)
, вы можете просто создать каталог рядом с ним, example.com/myappNg/
/myapp/
/myapp/controllers/
/myapp/models/
/myapp/(etc)
/myapp/index.php (code igniter index file)
/myappNg/
/myappNg/partials/
/myappNg/js/
/myappNg/(etc)
Теперь в вашем приложении angular вы можете запрашивать ресурсы из CI, создавая пути относительно корня домена, а не относительно приложения angular. Например, в Angular вы больше не будете запрашивать частичный вид из папки angular partials/angular-view.html
, скорее вы захотите запросить представления из CI /myapp/someResource
. Обратите внимание на ведущий /
. "someResource" может вернуть html-документ, или JSON, или что-то еще, что вы делаете с Code Igniter.
В конце концов вы можете заменить количество путей, ссылающихся на /myapp/
. Как только вы больше не используете CI для чего-либо, вы можете просто поместить свой angular index.html в /myapp/
, и он будет продолжать ссылаться на ваши пути в /myappNg/
.
TL; DR Сделайте ваше приложение angular полностью доступным и отделите его от Code Igniter. Постепенно переходите к использованию частичных представлений angular и других источников JSON вместо привязки к страницам Code Igniter. В конце концов замените конечную точку Code Igniter файлом HTML, который загружает Angular.
Изменить: исправлено правописание
Ответ 2
Я никогда не использовал Angular - тем не менее это может помочь.
Итак, я нажимаю ссылку, управляемую маршрутизатором Angular, и это обрабатывается javascript
Предоставляет ли этот JavaScript запрос Ajax одному из ваших контроллеров CI? Если это так, CI теперь имеет метод is_ajax_request()
, который позволяет вам проверить, поступает ли запрос (POST или GET) через ajax. Вы можете действовать по-разному на основе запроса, исходящего от Ajax по сравнению с обычным запросом.
Руководство пользователя (внизу страницы): http://ellislab.com/codeigniter/user-guide/libraries/input.html
Надеюсь, что это поможет!
Ответ 3
Я унаследовал приложение CI, и я использую Angular с CI в основном для запросов на маршрутизацию. В моем случае я не использую шаблоны Angular, поэтому я использую "пустой", но с параметром пробела для параметра шаблона в моей конфигурации $routeProvider. Это позволяет мне выполнять обычные запросы ajax CI без особого изменения исходного кода на стороне сервера.
angular.module('my_app', []).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/', { template: " ", controller: my_routes.mainpage}).
when('/design/:designId/:action', {template: " ", controller: my_routes.show_design}).
when('/vote_design/:designId', {template: " ", controller: my_routes.vote_design}).
otherwise({redirectTo: '/'});
}]);
Ответ 4
Лучше всего сохранить код бэкэнд отдельно от кода angular
и использовать код codeInginter как API
/Codeigniter Code
/ Angular Код
Поскольку CodeIgniter поставляется с его частью функции безопасности, это должно быть вашим лучшим выбором.
Ответ 5
Я взял сайт CI от другого программиста, с которым я работаю, который находится в отпуске на несколько месяцев. Наш сайт построен в основном с большим количеством angular из-за характера его цели. Наше решение было немного другим.
Все, что зависит от стандартной инфраструктуры CI, - это пары папок: js\angular\controllers
и js\angular\modules
в папке приложения CI, для хранения всех файлов модели и контроллера angular. Затем загрузите документы angular в базовую папку приложения.
Ответ 6
В дополнение к ответу, предоставленному Аароном Мартином, его можно также использовать как подход клиент-сервер.
Предположим, что мы создали две папки в корне нашего проекта:
Клиент будет содержать весь код AngularJS и клиентских библиотек, включая библиотеки Bower и Npm.
Маршрутизация клиентской стороны также будет обрабатываться маршрутизатором AngularJS.
Там будут фабрики или сервисы, которые будут выступать в качестве поставщиков для angularjs на стороне клиента.
Этот файл будет содержать код отправки запроса и получения ответа со стороны сервера.
Сервер. Папка будет иметь код Laravel или CodeIgniter или любой другой фреймворк PHP.
Вы создадите все API-запросы и соответствующим образом разработаете функциональные возможности.
Следовательно, раздел PHP (Server Directory) в целом будет хранить все файлы мультимедиа и файлы базы данных. Кроме того, он также будет иметь любые получающие ссылки для RSS-каналов и так далее.
Клиент должен получить весь ответ в формате JSON или XML, когда он запрашивает какой-либо API на своем сервере.
Это, по моему мнению, является одной из лучших практик разработки Webapps.