Междоменная проблема с внедрением API сокращателя URL Google - PullRequest
5 голосов
/ 14 января 2011

Я пытаюсь реализовать API сокращения URL Google с помощью jQuery, совершая вызов AJAX.Я сделал что-то вроде этого:

$(function() {
    $('#btnshorten').click(function() {    
        var longURL = $('#tboxLongURL').val();

        $.ajax({
            url: 'https://www.googleapis.com/urlshortener/v1/url?shortUrl=http://goo.gl/fbsS&key=AIzaSyANFw1rVq_vnIzT4vVOwIw3fF1qHXV7Mjw',
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            data: '{ longUrl: "' + longURL +'"}',
            dataType: 'json',
            success: function(response) {
                var result = eval(response); // Evaluate the J-Son response object.
            }
         });
    }); 
});

Но это вызывает ошибку в IE.Он показывает «Доступ запрещен», а в Firebug - «Метод 405 не разрешен».Я что-то здесь не так делаю?

Ответы [ 3 ]

17 голосов
/ 30 декабря 2011

В Javascript есть два способа реализации API сокращения URL Google:

МЕТОД # 1: Используя jsonlib, http://call.jsonlib.com/jsonlib.js Попробуйте это здесь: http://jsfiddle.net/Qh4eR/

var longUrl = "http://google.com";
document.write("Long Url: "+longUrl);

function googlurl(url, cb) {
  jsonlib.fetch({
    url: 'https://www.googleapis.com/urlshortener/v1/url',
    header: 'Content-Type: application/json',
    data: JSON.stringify({longUrl: url})
  }, function (m) {
    var result = null;
    try {
      result = JSON.parse(m.content).id;
      if (typeof result != 'string') result = null;
    } catch (e) {
      result = null;
    }
    cb(result);
  });
}
googlurl(longUrl , function(s) { document.write("<BR>Short Url: "+s); });

МЕТОД # 2: Используя клиентскую библиотеку Google, https://apis.google.com/js/client.js, попробуйте здесь: http://jsfiddle.net/pPHKe/2/

//var apiKey = 'YOUR_API_KEY';
//gapi.client.setApiKey(apiKey);
var longurl = 'http://www.google.com/';

gapi.client.load('urlshortener', 'v1', function() {
    var request = gapi.client.urlshortener.url.insert({
        'resource': {
            'longUrl': longurl
        }
    });
    var resp = request.execute(function(resp) {
        if (resp.error) {
            $("#show").html('Error. ' + resp.error.message);
        } else {
            $("#show").html("Short URL for "+longurl+" is: " + resp.id);
        }
    });
});
5 голосов
/ 14 января 2011

Да, боюсь, действительно.Вы не можете совершать междоменные вызовы ajax из-за безопасности браузера.

Я знаю, что Ext JS предлагает объект ScriptTagProxy, который может выполнять эту работу, но я не уверен, что jQuery имеет что-то подобное.

Альтернативой может быть создание своего рода «прокси» серверного сценария на вашем собственном хосте, который мог бы принимать параметры из вашего вызова ajax, сделать запрос HttpWebRequest или аналогичный googleapis.com и вывести ответ, который нужно выбратьснова ваш Ajax-вызов.Затем просто измените параметр URL-адреса ajax, чтобы он вызывал новый прокси-скрипт вместо googleapis.Другими словами - пусть серверная сторона выполняет междоменный запрос.

0 голосов
/ 14 января 2011

Вы можете использовать динамический тег сценария для выполнения междоменных вызовов ajax.Как указано здесь , у этого метода есть некоторые проблемы: трудно определить, когда контент доступен, стандартной методологии нет, и его можно рассматривать как «угрозу безопасности».отлично работает в моем случае.обратитесь к здесь для хорошего примера.Подход немного сложнее.

...