TL:DR

Учитывая, что вы используете PHP, мое главное предложение — посмотреть и использовать какое-нибудь существующее решение, такое как CSRF -Protector, который специально разработан для использования с PHP и должен работать с любым клиентским фреймворком, включая ExtJS. Это, вероятно, намного лучше и безопаснее, чем все, что вы можете сделать самостоятельно.

ПРИМЕЧАНИЕ. Вики проекта теперь содержит две разные страницы со ссылками для скачивания: web-application" rel="nofollow noreferrer">это содержит ссылки на устаревшую версию и здесь ссылка на последнюю версию. Обязательно загрузите текущую версию или клонируйте репозиторий!

Длинный ответ

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

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

Есть и другие способы защиты от CSRF. Для простоты я буду обсуждать только токен Synchronizer (CSRF), описанный на странице, упомянутой выше.

Защита CSFR с использованием токенов Synchronizer (CSRF) всегда работает следующим образом:

1. Существует незащищенная (с точки зрения CSRF) страница\действие\запрос, которая включает в себя какую-то форму или ссылку на действие, которое выполняет защищенное действие (запрос). В вашем примере это страница, которая включает класс ExtJs APP.MyApp. Этот запрос также должен сгенерировать токен CSRF, сохранить его в сеансе (для последующей проверки), а также каким-то образом включить его в сгенерированный ответ.
2. Запрошено защищенное действие, пока к запросу прикреплен токен защиты
3. Действие на стороне сервера, обрабатывающее защищенный запрос, извлекает токен из запроса и проверяет его на соответствие значению, хранящемуся в сеансе.

Теперь есть больше способов отправки сгенерированных токенов CSRF с сервера на клиент - мета, cookie, скрытое поле (все упомянутые в вашем вопросе). Правильный способ сделать это действительно зависит от вашего приложения и желаемого уровня защиты.

Основные соображения:

• Как генерируется страница, инициирующая защищенный запрос
• Какой тип токена вы используете (для сеанса или для каждого запроса)

Генерация токенов VS образ жизни приложения\страницы

Как описано в пункте 1 выше, токен генерируется только тогда, когда запрашивается страница, инициирующая защищенное действие.

Это нормально для многостраничного приложения, потому что перед тем, как можно будет вызвать защищенное действие, должна быть сгенерирована страница, содержащая форму\ссылку (и токен). Это означает, что очень легко использовать токены для каждого запроса, и вы можете отправить токен в мета или сформировать скрытое поле.

С другой стороны, в приложении SPA, где инициирующая страница создается только один раз, а защищенное действие может выполняться несколько раз без полного обновления страницы, ваши возможности ограничены. Либо вы должны использовать токен для каждого сеанса (см. ниже), передаваемый через meta\header, либо вы должны использовать какой-то более сложный механизм для получения нового токена с помощью AJAX каждый раз перед вызовом защищенного действия. В этом случае лучше использовать куки, как описано в ссылке выше, в главе «Двойная отправка куки».

Тип токена

Сначала вам нужно решить, будет ли ваш токен для сеанса или для каждого запроса. Токены для каждого запроса генерируются для каждого запроса страницы, инициирующей защищенное действие, и отбрасываются после его использования (т. е. защищенное действие выполняется после успешной проверки токена). Может храниться в мета\заголовке\скрытом поле. По определению они также не могут использоваться в приложениях SPA. Существуют также проблемы с удобством использования, такие как кнопка «Назад», приводящая к ложному положительному событию безопасности на сервере, если предыдущая страница защищена.

Токены сеанса генерируются только один раз. Это может привести к снижению безопасности, поскольку допускает повторные атаки, но если ваш сайт защищен от XSS (что и должно быть), все в порядке. Сеансовые токены легче использовать в приложениях SPA. Можно передать через мета\скрытое поле.

РЕДАКТИРОВАТЬ - CSRF-протектор VS ExtJs

Похоже, что текущая версия CSRF-Protector (v0.2.1) не работает с запросами POST, содержащими полезную нагрузку JSON (application/json) — см. эта проблема в системе отслеживания ошибок проекта. Чтобы обойти это, убедитесь, что вы всегда выполняете POST с Content-type: application/x-www-form-urlencoded.

Для обычных запросов с использованием Ext.Ajax.request используйте params config вместо jsonData (fiddle)

Ext.Ajax.request({
            url: 'https://jsonplaceholder.typicode.com/posts/',
            method: 'POST',
            params: {
                "userId": 1,
                "id": 1,
                "title": "sunt",
                "body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et"
            }
        })

Для хранилищ убедитесь, что вы настроили средство записи с encode: true (см. ="nofollow noreferrer">документы), как это (fiddle):

var store = new Ext.data.Store({
    model: 'MyApp.model.Post',
    storeId: 'postsStore',
    autoLoad: true,
    autoSync: true,
    loading: true,

    proxy: {
        type: 'rest',

        actionMethods: {
            create: 'POST',
            read: 'GET',
            update: 'PUT',
            destroy: 'DELETE'
        },

        api: {
            create: 'https://jsonplaceholder.typicode.com/posts',
            read: 'https://jsonplaceholder.typicode.com/posts',
            update: 'https://jsonplaceholder.typicode.com/posts',
            destroy: 'https://jsonplaceholder.typicode.com/posts'
        },

        reader: {
            type: 'json',
            rootProperty: 'data',
            totalProperty: 'total',
            successProperty: 'success'
        },

        writer: {
            type: 'json',
            writeAllFields: true,
            encode: true,
            rootProperty: 'data'
        }
    }
});