Статьи

Быстрый совет: междоменный запрос AJAX с YQL и jQuery

По соображениям безопасности мы не можем делать междоменные запросы AJAX с помощью jQuery. Например, я не могу вызвать метод load () и передать «cnn.com». Поскольку мы будем загружать скрипты и тому подобное, а также желаемый контент, это будет представлять значительную угрозу безопасности. Тем не менее, могут быть моменты, когда это именно то, что вам нужно. Благодаря YQL мы можем довольно легко разрешить эту функцию!

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
// Accepts a url and a callback function to run.
function requestCrossDomain( site, callback ) {
     
    // If no url was passed, exit.
    if ( !site ) {
        alert(‘No site was passed.’);
        return false;
    }
     
    // Take the provided url, and add it to a YQL query.
    var yql = ‘http://query.yahooapis.com/v1/public/yql?q=’ + encodeURIComponent(‘select * from html where url=»‘ + site + ‘»‘) + ‘&format=xml&callback=cbFunc’;
     
    // Request that YSQL string, and run a callback function.
    // Pass a defined function to prevent cache-busting.
    $.getJSON( yql, cbFunc );
     
    function cbFunc(data) {
    // If we have something to work with…
    if ( data.results[0] ) {
        // Strip out all script tags, for security reasons.
        // BE VERY CAREFUL.
        data = data.results[0].replace(/<script[^>]*>[\s\S]*?<\/script>/gi, »);
         
        // If the user passed a callback, and it
        // is a function, call it, and send through the data var.
        if ( typeof callback === ‘function’) {
            callback(data);
        }
    }
    // Else, Maybe we requested a site that doesn’t exist, and nothing returned.
    else throw new Error(‘Nothing returned from getJSON.’);
    }
}
1
2
3
requestCrossDomain(‘http://www.cnn.com’, function(results) {
   $(‘#container’).html(results);
});

Мне пришлось продвигаться довольно быстро в видео, поэтому, возможно, регулярное выражение, которое удаляет теги <script>, требует дополнительной детализации.

1
.replace(/<script[^>]*>[\s\S]*?<\/script>/gi, »);

Когда мы загружаем желаемую страницу, она также загружает скрипты! Вы должны быть очень осторожны, когда делаете междоменный запрос. Это определенно помогает убрать теги <script>, но вы должны сделать больше в реальном проекте.

Давайте рассмотрим регулярное выражение шаг за шагом.

1
<script[^>]*>

Найти все открытые теги сценариев; однако они могут иметь разные формы: <script type = «text / javascript» src = «bla.js»> </ script> или <script type = «text / javascript»> здесь много кода … < / скрипт> . По этой причине мы добавляем класс символов ([^>] *), что означает «Найти ноль или более всего, что НЕ является закрывающей скобкой. Это позаботится об атрибутах и ​​значениях.

1
[\s\S]*?

Далее мы хотим удалить весь код, а также любой пробел. \ s относится к пробелу. \ S относится ко всему, что НЕ является пробелом. Еще раз, мы добавляем * после класса символов, чтобы обозначить, что мы хотим ноль или более вхождений.

1
<\/script>

Наконец, найдите закрывающие теги скрипта.


Это только для того, чтобы дать представление о том, как мы можем достичь этой функциональности. Только так много может быть освещено в пятиминутном видео. Не стесняйтесь обсуждать в комментариях, и вам всегда рекомендуется раскошелиться на исходный код, чтобы улучшить его!