доступ к данным в jquery .when .done функции (также eval это зло?)

Question

Я пытаюсь выполнить динамическую загрузку, включающую файлы javascript, css и html.

Я хотел бы сделать это так:

$.when($.ajax(htmlPath), $.get(cssPath), $.ajax({
    url: javascriptPath,
    dataType: "text"
}))
.done(function(response){
// i want to pass the data for each of these to the respective functions        
    appendHtml(what goes here??);       
    appendCss(what goes here??);
    executeJs(what goes here??);
})
.fail(function(){
    console.log("failed");
});

Так что я запуталсяо том, как я выделяю ответные обратные вызовы.В настоящее время объект ответа, который вы видите в моей функции .done, является ТОЛЬКО файлом HTML, который я вызвал.Эта функция делает правильные вызовы AJAX, и все серверы отвечают на правильные файлы, но как мне получить к ним доступ после ВСЕХ вызовов?Это нужно, чтобы я не применял css / js к HTML, которого еще нет, и т. Д. Кроме того, я делаю, чтобы файл javascript возвращался в виде строки, а затем я выполнял eval () в функции executeJs.Насколько я понимаю, это правильное использование eval, потому что это файл, возвращаемый нашим собственным сервером, поэтому я не понимаю, как его можно подделать.Это предположение верно?

Кроме того, в моей функции appendCss я просто добавляю ее к элементу "style" в голове.Есть ли большая проблема с этим?Я использую все это для создания функциональности «на основе виджетов / приложений», где у меня есть js, css и html для каждого «приложения», и я просто хочу запросить у них сервер, когда они нужны и приложение загружается.

Answer 1

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

Проблема с eval() в таком контексте не обязательно заключается в том, что вы не доверяете коду, возвращаемому с вашего собственного сервера;это то, что кто-то может изменить работающий javascript так, чтобы переменная javascriptPath указывала на то место, где вы этого не ожидали.

---

Что касается вашего фактического вопроса, ваш done обратный вызовфактически будет передано три параметра, потому что ваш вызов when включал три обещания.

Из-за способа, которым вы определили свой обратный вызов (как function(response)), вы видите только первый - возвратзначение из вызова HTML.Два других параметра игнорируются.

Каждый из трех передаваемых параметров будет массивом из трех элементов: [wasSuccessful, statusText, jqxhr].Чтобы сделать что-то полезное с ними, вы можете структурировать свой обратный вызов примерно так:

$.when($.ajax(htmlPath), $.get(cssPath), $.ajax({
    url: javascriptPath,
    dataType: "text"
}))
.done(function(htmlResponse, cssResponse, jsResponse){
    if (htmlResponse[0]) {
        appendHtml(htmlResponse[2].responseText);
    }
    if (cssResponse[0]) {
        appendCss(cssResponse[2].responseText);
    }
    if (jsResponse[0]) {
        executeJs(jsResponse[2].responseText);
    }
})

(при условии, что у вас уже есть соответствующие функции appendHtml, appendCss и executeJs, уже написанные)

---

На этой странице есть несколько хороших примеров: http://api.jquery.com/jQuery.when/

И на этой странице есть документация по объекту jqxhr (третий элемент в каждом из массивов, которые передаются вашему готовомуфункция): http://api.jquery.com/jQuery.ajax/#jqXHR

Answer 2

Чтобы получить доступ ко всем ответам, просто передайте три аргумента обратному вызову done().Попробуйте это:

$.when($.ajax(htmlPath), $.get(cssPath), $.ajax({
    url: javascriptPath,
    dataType: "text"
}))
.done(function(responseHTML, responseCSS, responseJS){
    console.log(responseHTML[0]);       
    console.log(responseCSS[0]);
    console.log(responseJS[0]);
})

если вы попытаетесь напечатать arguments объект внутри done (), вы можете ясно увидеть, что все ответы передаются в обратный вызов

Answer 3

Что касается использования eval, рассмотрите возможность использования JSONP (dataType: 'jsonp').Таким образом, jQuery позаботится о выполнении кода для вас.Я предполагаю, что jQuery также использует eval() под капотом, но тогда, по крайней мере, вы знаете, что это сделано надлежащим образом.Что касается безопасности, см. Также связанный вопрос о том, когда eval () является злом, если вы этого еще не сделали.