URL Кодировать строку в jQuery для запроса AJAX

188

Я использую Google Instant Search в своем приложении. Я хотел бы отключить HTTP-запросы, поскольку пользователь вводит ввод текста. Единственная проблема, с которой я сталкиваюсь, заключается в том, что когда пользователь попадает в пространство между первым и последним именем, пространство не кодируется как +, тем самым нарушая поиск. Как я могу либо заменить пространство на +, либо просто безопасно URL-код Кодировать строку?

$("#search").keypress(function(){       
    var query = "{% url accounts.views.instasearch  %}?q=" + $('#tags').val();
    var options = {};
    $("#results").html(ajax_load).load(query);
});
  • 0
    Вы можете использовать $.param .
Теги:
http

5 ответов

417
Лучший ответ

Попробуйте encodeURIComponent.

Кодирует компонент Uniform Resource Identifier (URI), заменяя каждый экземпляр определенных символов на одну, две, три или четыре escape-последовательности, представляющие кодировку UTF-8 символа (будут только четыре escape-последовательности для символов, состоящих из два "суррогатных" персонажа).

Пример:

var encoded = encodeURIComponent(str);
  • 2
    Это решило мою проблему - когда я передавал URL-адрес в качестве параметра для моего AJAX-запроса, он терял все после символа & для всех строк запроса в нем. Когда я добавил это, это решило мою проблему. Спасибо!
  • 0
    Это круто. Полезно знать об этой встроенной функции.
Показать ещё 1 комментарий
21

encodeURIComponent отлично работает для меня. мы можем указать url как это в ajax-вызове. Код, показанный ниже:

  $.ajax({
    cache: false,
    type: "POST",
    url: "http://atandra.mivamerchantdev.com//mm5/json.mvc?Store_Code=ATA&Function=Module&Module_Code=thub_connector&Module_Function=THUB_Request",
    data: "strChannelName=" + $('#txtupdstorename').val() + "&ServiceUrl=" + encodeURIComponent($('#txtupdserviceurl').val()),
    dataType: "HTML",
    success: function (data) {
    },
    error: function (xhr, ajaxOptions, thrownError) {
    }
  });
8

Лучший способ:

encodeURIComponent выделяет все символы, кроме следующих: alphabetic, decimal digits, - _ . ! ~ * ' ( )

Чтобы избежать неожиданных запросов на сервер, вы должны вызывать encodeURIComponent по любым введенным пользователем параметрам, которые будут переданы как часть URI. Например, пользователь может ввести "Thyme & time = again" для комментария переменной. Не используя encodeURIComponent для этой переменной, вы получите комментарий = Thyme %20 & time = again. Обратите внимание, что знак амперсанда и знак равенства указывают новую пару ключей и значений. Поэтому вместо того, чтобы иметь ключ комментария POST, равный "Thyme & time = again", у вас есть две клавиши POST, одна из которых равна "Thyme", а другая (время) равна снова.

Для приложения /x -www-form-urlencoded (POST), за http://www.w3.org/TR/html401/interac...m-content-type, пробелы должны быть заменены на '+', поэтому можно запросить замену encodeURIComponent с дополнительной заменой "%20" на "+".

Если кто-то хочет быть более строгим в соблюдении RFC 3986 (который резервирует!, ', (,) и *), даже если эти символы не имеют формализованных видов использования ограничений URI, можно безопасно использовать следующее:

function fixedEncodeURIComponent (str) {
  return encodeURIComponent(str).replace(/[!'()]/g, escape).replace(/\*/g, "%2A");
}
  • 1
    For application/x-www-form-urlencoded (POST), per http://www.w3.org/TR/html401/interac...m-content-type, spaces are to be replaced by '+', so one may wish to follow a encodeURIComponent replacement with an additional replacement of "%20" with "+". Как это сделать?
  • 0
    но для того, чтобы это было полезно, должен быть эквивалент urldecode
3

Я использую MVC3/EntityFramework в качестве исходного кода, передняя часть потребляет все мои контроллеры проектов через jquery, отправляя напрямую (используя $.post), не требует указания данных, когда вы передаете параметры напрямую, кроме URL-адреса жёстко. Я уже тестировал несколько символов, даже отправил URL-адрес (этот http://www.ihackforfun.eu/index.php?title=update-on-url-crazy&more=1&c=1&tb=1&pb=1) в качестве параметра и не имел проблемы вообще, хотя encodeURIComponent отлично работает когда вы передаете все данные внутри URL-адреса (жестко запрограммированного)

Жестко закодированный URL i.e. >

 var encodedName = encodeURIComponent(name);
 var url = "ControllerName/ActionName/" + encodedName + "/" + keyword + "/" + description + "/" + linkUrl + "/" + includeMetrics + "/" + typeTask + "/" + project + "/" + userCreated + "/" + userModified + "/" + status + "/" + parent;; // + name + "/" + keyword + "/" + description + "/" + linkUrl + "/" + includeMetrics + "/" + typeTask + "/" + project + "/" + userCreated + "/" + userModified + "/" + status + "/" + parent;

В противном случае не используйте encodeURIComponent и вместо этого попробуйте передать параметры в методе post ajax

 var url = "ControllerName/ActionName/";   
 $.post(url,
        { name: nameVal, fkKeyword: keyword, description: descriptionVal, linkUrl: linkUrlVal, includeMetrics: includeMetricsVal, FKTypeTask: typeTask, FKProject: project, FKUserCreated: userCreated, FKUserModified: userModified, FKStatus: status, FKParent: parent },
 function (data) {.......});
  • 2
    Это было бы, вероятно, лучшим решением в то время :)
0

попробуйте этот

var query = "{% url accounts.views.instasearch  %}?q=" + $('#tags').val().replace(/ /g, '+');
  • 0
    Отлично. Благодарю.
  • 5
    Решение Андерса Фьелдстада намного лучше. Замена пробелов со знаком плюс может сработать, но если у вас есть другие символы (с умляутами и т. Д.), У вас возникнет куча неприятностей.
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню