Клиентское приложение Javascript - маршрутизация URL без тэга

Question

Я работаю над новым клиентским приложением с последней версией Ember.js. Существует одна страница PHP, которая создает скрипты, css, файлы шаблонов и т. Д. И доставляет их все в index.php. Я использую директиву htaccess, чтобы все запросы были переписаны в /index.php. PHP только там, чтобы удобно упаковать Javascript, насколько я знаю.

В настоящее время маршруты в браузере выглядят так и работают нормально.

/#/about 
/#/favorites 
/#/etc 
/#/posts/5/edit 

Однако, я бы хотел, чтобы они выглядели так: это не работает нормально.

/about 
/favorites 
/etc 
/posts/5/edit 

Точный же клиентский код по-прежнему поставляется со вторым вариантом, но он всегда попадает в обработчик маршрута указателя. Я видел, как приложения на стороне клиента снимают это раньше - чего мне не хватает? Нужно ли иметь соответствующие обработчики маршрутов на стороне PHP?

Редактировать: Я ищу конкретный ответ о том, как подойти к этому. Сеть полна информации «о, вы просто делаете это», которая оставляет всех остальных почесывать головы.

Answer 1

В ember.js (версия 1.0.0rc3) это может быть достигнуто с помощью Ember.js location API:

App.Router.reopen({ 
    location: 'history' 
}); 

И затем установка веб-сервера для перенаправления трафика к приложению Ember.

Чтобы дать конкретный пример здесь является основным Apache .htaccess файл перенаправления трафика приложения Ember, расположенного в index.html:

RewriteEngine on 
RewriteCond %{REQUEST_FILENAME} !-f 
RewriteCond %{REQUEST_FILENAME} !-d 
RewriteRule ^(.*)$ /index.html#$1 [L] 

Как Alex White точек из Apache 2.2.16 и выше поддерживает более простую конфигурацию перенаправления трафика на одной цели:

FallbackResource /index.html 

FallbackResource является частью mod_dir модуля и требует AllowOverride Indexes быть установлен.

Обязательно тщательно протестируйте маршруты приложения. Одной из распространенных ошибок является Uncaught SyntaxError: Unexpected token <, что обусловлено использованием относительных ссылок на файлы CSS и JS. Подготовьте их отметкой /, чтобы сделать их абсолютными.

Эта функциональность not supported in Internet Explorer <10.

Answer 2

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

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

Answer 3

@Pascal: Он не говорит о реальном обновлении страниц, а с помощью Эмбера history (location: 'history').

Чтобы ответить на ваш вопрос, вам необходимо настроить .htaccess, чтобы обслуживать содержимое, как обычно, JavaScript. После того, как ваши URL-адреса настроены для загрузки вашего приложения, Ember позаботится обо всем, как обычно, от URL-адреса.

Answer 4

Лучше, чем RewriteRule, вы можете использовать это для Apache 2.2.16+:

FallbackResource /index.html 

в конфигурации Apache, так что RewriteRule не нужно запускать для каждого запроса. Это гарантирует, что каждый маршрут в вашем приложении ember попадает в файл index.html.