0

これを実行すると、「送信中」のメッセージは表示されますが、「受信済み」のメッセージは表示されません。なぜ？失敗およびエラー ブロックのエラー メッセージは No Transport です。

html:

<ul>
    <li><a href="http://www.hotmail.com">hotmail.com</a></li>
    <li><a href="http://www.google.com">google.com</a></li>
</ul>

js:

<script type="text/javascript">
    $(document).ready(function () {
        $("a").each(function (index) {
            var sUrl = 'http://tinyurl.com/api-create.php?url=' + $(this).attr('href')
            alert('sending: ' + sUrl);
            $.ajax({
                url: sUrl,
                crossDomain: true
            }).fail(function (data) {
                alert('failed: ' + data.statusText);
            }).error(function (data) {
                alert('error: ' + data.statusText);
            }).done(function (data) {
                alert('received: ' + sUrl);
            });
        });
    });
</script>

編集: 受け入れられた回答は、内部で $.ajax を呼び出す $.getJSON を使用します。低レベルの $.ajax に興味があるかもしれない人はどうぞ。

$('a').each(function (index) {
    var app = 'http://json-tinyurl.appspot.com/';
    var sUrl = app + '?url=' + $(this).attr('href') + '&callback=?';
    $.ajax({
        url: sUrl,
        dataType: 'json',
        success: function (data) {
            alert('ajax:' + data.tinyurl);
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert("jqXHR=" + jqXHR.responseText + "\ntextStatus=" + textStatus + "\nerrorThrown=" + errorThrown);
        }
    });
});
4

2 に答える 2

2

クロスドメイン呼び出しを行っており、jsonpを使用していないため、問題が発生しています。tinyurl生成の問題の解決策については、こちらの回答を参照してください。

JqueryAjax呼び出しを介してTinyURLを作成します

これを参照として使用すると、固定コードは次のようになります。

$(document).ready(function() {
    $("a").each(function(index) {
        var sUrl = $(this).attr('href');
        $.getJSON("http://json-tinyurl.appspot.com/?&callback=?", {
            url: sUrl
        }, function(data) {
            alert(data.tinyurl);
        });
    });
});​
于 2012-05-26T20:51:06.143 に答える
2

crossDomain パラメーターは、あなたが思っていることをしません。JQuery ドキュメントから:

同じドメインで crossDomain リクエスト (JSONP など) を強制する場合は、crossDomain の値を true に設定します。これにより、たとえば、別のドメインへのサーバー側のリダイレクトが可能になります。

AJAX 経由で別のドメインから URL を要求している場合、JQuery はデフォルトでこれを true に設定することに注意してください。そのため、自分で設定する必要はありません。

コードが機能しない理由は、クロス ドメイン AJAX を適切に設定していないためです。セキュリティ上の潜在的な脆弱性があるため、ブラウザはAJAX リクエストに対して同一オリジン ポリシーに従います。したがって、AJAX 要求で tinyURL API にアクセスしようとしているという事実は、ブラウザーによって自動的にブロックされます。これを機能させるには、JSONP などのメカニズムを使用する必要があります。

JQuery/AJAX/JSONP を使用して TinyURL API から短縮 URL を取得する例が記載されているこのブログ投稿を試してください。最後に、JSONP に関するバックグラウンド リンクもいくつかあります。少し古いので、構文を現在の JQuery/TinyURL API に更新する必要があるかもしれないことに注意してください。JSONP の操作の背後にある基本的な考え方は変更されていません。

于 2012-05-26T20:52:43.643 に答える