2012-02-06 3 views
4

Я хочу использовать Content Site Protection для своего веб-приложения. Если вы не слышали об этом, одним словом: это позволит мне отключить любой встроенный javascript в моем веб-приложении, помогая предотвратить XSS.Javascript и CSP - лучшие практики

В результате все мои javascript-коды должны быть во внешних файлах.

Код javascript 'library/framework' уже есть, но обычно мои страницы содержат как минимум несколько строк кода JS, создавая компоненты, относящиеся к определенной странице.

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

var registrationForm = new MyApp.registrationValidator($('.regform')); 
registrationForm.init(); 

Этот гипотетический код получает ссылку на регистрационную форму, и может регистрировать весь код проверки.

Теперь мне нужно переместить этот код во внешний файл. Я мог бы:

Вариант A: создать небольшой .js-файл для каждой страницы, который выполняет только код, предназначенный для этой страницы.

  • Pros - Простые и относительно быстро
  • Минусы - Это дополнительный JS файл для каждой страницы, я бы предпочел, чтобы быть в состоянии свести к минимуму все мои JavaScript в одном файле, чтобы уменьшить запросы.

Вариант B: Выполнить весь мой 'код' создание экземпляра в файл JavaScript. Я просто определю, есть ли на странице какие-либо классы .regForm css и только экземпляр объектов, если они появляются на странице.

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

Вариант C: Дайте моему <body> тег идентификатор или класс, и выполнить правильный код, основанный на большом коммутаторе.

  • Плюсы: все еще может быть сжат в один .js-файл, и мне не нужен файл .js на страницу.
  • Против: Полагаю, я чувствую, что это немного уродливо.

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

Что мне больше всего интересно, у вас есть опыт в этой ситуации, и как вы его решили?

ответ

3

Вариант D (вариант A и B): взгляните на системы развертывания, которые будут компилировать (и минимизировать) несколько исходных файлов javascript в один, принимая во внимание только необходимые файлы для этой страницы.

Для PHP, Assetic - такая система.

+0

Спасибо! Это хорошее предложение, и отличный проект, чтобы отвлечься от него. Хотя я чувствую, что хотел бы в конечном итоге предоставить пользователю 1 большой пакет js, а не новую загрузку для большинства страниц. – Evert

1

Если вы хотите использовать фреймворк, например jQuery (для динамической загрузки и выполнения внешнего javascript), вы можете использовать преимущества A и B в сочетании. каждая страница будет загружать тот же .js, который определяет (по наличию или отсутствию элементов dom), которые другие .js-файлы загружают динамически.

+0

Мы используем jQuery, а также позвоночник. Я пытался использовать это в Варианте B, но спасибо за то, что я сделал намного лучшую работу, описывая, что я имел в виду :) – Evert

+0

, если вы хотите избавиться от кода инициализации на стороне клиента, вы можете определить php/asp/jsp которые .js присоединяются к выходу html. для php я точно знаю, что вы можете выполнять перемещение dom xml. – maddrag0n