Подтвердить что ты не робот

SCRIPT5009: "URLSearchParams" не определен в IE 11

Я пытаюсь выполнить URLSearchParams, но я получаю сообщение об ошибке в IE 11, поскольку он там не поддерживается. Отлично работает в Chrome и Firefox.

Как я могу получить эквивалентную функциональность в IE 11? Я выполняю код в Laravel 5.4.

Вот строка кода, которую я пытаюсь выполнить.

var urlParams = new URLSearchParams(window.location.search);

Ошибка:

SCRIPT5009: "URLSearchParams" не определен

4b9b3361

Ответ 1

Получил решение, заменив код следующим:

$.urlParam = function(name){
    var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
    if (results == null){
       return null;
    }
    else {
       return decodeURI(results[1]) || 0;
    }
}

Так, например, "example.com?param1=name&param2=&id=6"

$.urlParam('param1');  // name
$.urlParam('id');      // 6
$.urlParam('param2');  // null

Ответ 2

Odhikari отвечает как (частичный) полиполн:

(function (w) {

    w.URLSearchParams = w.URLSearchParams || function (searchString) {
        var self = this;
        self.searchString = searchString;
        self.get = function (name) {
            var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(self.searchString);
            if (results == null) {
                return null;
            }
            else {
                return decodeURI(results[1]) || 0;
            }
        };
    }

})(window)

Ответ 3

Если кто-то найдет это в 2019 году, corejs теперь также поддерживает URLSearchParams в качестве полизаполнения, так что вы можете просто остаться с corejs и не нужно самостоятельно что-то готовить.

import 'core-js/features/url-search-params';

https://github.com/zloirock/core-js#url-and-urlsearchparams

Ответ 4

У меня была похожая проблема при попытке использовать URLSearchParams при попытке сделать пост AXIOS при использовании Internet Explorer. Так что это немного отличается от вашего описания, но я бы хотел опубликовать свое решение здесь на всякий случай.

Вот мой почтовый код AXIOS из моего приложения React, которое отлично работает для Edge, Chrome и Firefox, но в IE он выдает ошибку

SCRIPT5009: URLSearchParams не определен

:

        let axiosConfig = {
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            }
        };            
        // Putting together the data to be passed to local servlet.
        const params = new URLSearchParams();
        params.append('var1', this.state.data1);
        params.append('var2', this.state.data2);

        var urlToPost = 'https://localhost:8080/someLocalServlet/doSomething';

        var self = this;  
        axios.post(urlToPost, params, axiosConfig)
            .then((res) => {
                // Handling Response from Servlet.
                console.log("AXIOS POST RESPONSE RECEIVED: ", res);

            })
            .catch((err) => {
                // Handler exception error thrown by Servlet.
                console.log("AXIOS POST ERROR: ", err);

            })     

Чтобы заставить его работать с IE, я использовал jQuery для публикации и использовал объект var вместо URLSearchParams. Оператор if ниже проверяет, находится ли пользователь в IE:

    if((navigator.userAgent.indexOf("MSIE") !== -1 ) || (!!document.documentMode === true )) { //IF IE > 10
        var myObject = {
            var1: this.state.data1,
            var2: this.state.data2
        };
        var urlToPostTo = 'https://localhost:8080/someLocalServlet/doSomething';

        $.post(urlToPost, myObject, 
            function(result) {  
                alert( "success" );
            })
              .done(function(result) {
                alert( "second success" );
              })
              .fail(function(result) {
                alert( "error" );
              })
              .always(function(result) {
                    alert( "finished" );
              });        
    } else {
       // use the AXIOS POST code above
    }

Чтобы получить JQuery, я должен был сделать

NPM установить JQuery

Затем поверх моего файла React я импортировал следующее:

import $ from 'jquery'; 
import { polyfill } from 'es6-promise'; polyfill();

Ответ 6

class UrlSearchParams {
  constructor(query) {
    this.query = query;
  }
  getSearchObject = () => {
    const { query } = this;
    return query
    ? (/^[?#]/.test(query) ? query.slice(1) : query)
      .split("&")
      .reduce((params, param) => {
        let [key, value] = param.split("=");
        params[key] = value
          ? decodeURIComponent(value.replace(/\+/g, " "))
          : "";
        return params;
      }, {})
  : {};
  };
  getAll = () => {
    const searchParams = this.getSearchObject();
    return searchParams;
  }
  get = param => {
    const searchParams = this.getSearchObject();
    return searchParams[param];
  };
  setUrl = (param, value) => {
    const searchParams = this.getSearchObject();
    searchParams[param] = value;
    return Object.keys(searchParams)
    .map(key => key + "=" + searchParams[key])
    .join("&");
  };
}

export default UrlSearchParams;

Ответ 8

В IE 11 URLSearchParams определен в объекте окна, используйте его так:

  window.URLSearchParams(window.location.search);

Ответ 9

Существует более общий вопрос здесь

Как ответил Атес

function getQueryParams(qs) {
    var res = qs.split('+').join(' ');

    var params = {},
        tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(res)) {
        params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
    }

    return params;
}

function objectToSearchParams(obj) {
    var resultString = "";
    fields = Object.keys(obj);
    for(var key in fields){
        resultString = resultString + "&" + fields[key] + "=" + obj[fields[key]];
    }
    return "?" + resultString.substring(1);
}

Ответ 10

Я смог решить эту проблему с помощью url-search-params-polyfill. Просто импортируйте в файл, который вы используете, URLSearchParams в:

import 'url-search-params-polyfill';

И ваши существующие ссылки на URLSearchParams теперь должны работать!

Ответ 11

Прежде всего, нам нужно знать, что делает функция URLSearchParams. Он в основном кодирует параметры, которые не выровнены для поиска в веб-браузере. Например, у нас есть переменная вроде name = '*/*'. Если вы будете искать эти символы в любом веб-браузере, вы увидите следующее имя параметра поиска = '*%2F*'. Так что нам нужно конвертировать эти символы.

И это легко сделать с encodeURIComponent(string) функций encodeURIComponent(string) которые работают для всех браузеров, включая IE 11. Так что альтернатива URLSearchParams будет следующей,

const userInfo = 'username=' + username + '&password=' + encodeURIComponent(password);