Question

对不起，如果我重复了这个问题。

我正在尝试在我的jQuery中执行URLSearchParams函数但我在IE 11上遇到错误，而它在Chrome和Mozilla中完美运行。实际上它在IE11中不受支持。让我知道我们如何能够支持IE。我在Laravel 5.4中执行代码。

我做了研究，但无法得到解决方案。

以下是我尝试执行的代码行。

var urlParams = new URLSearchParams（window.location.search）;

错误：

SCRIPT5009：'URLSearchParams'未定义

Answer 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

Answer 2

Odhikari作为（部分）polyfill的回答：

(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)

Answer 3

我能够使用url-search-params-polyfill解决此问题。只需导入到您在以下位置使用URLSearchParams的文件中即可：

import 'url-search-params-polyfill';

您现在对URLSearchParams的引用现在应该可以使用！

Answer 4

在使用Internet Explorer尝试发布 AXIOS 帖子时尝试使用 URLSearchParams 时，我遇到了类似的问题。因此，它与您的描述有些不同，但我想在此发布我的解决方案，以防万一。

这是我的React应用程序中的 AXIOS 邮政编码，适用于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();

Answer 5

如果有人在2019年发现了这一点，corejs现在还支持URLSearchParams作为polyfill，因此您可以继续使用corejs，而不必自己准备一些东西。

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

Answer 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;

Answer 7

首先，我们需要知道URLSearchParams函数的作用。它基本上对不适合搜索Web浏览器的参数进行编码。例如，我们有一个变量，例如name = '*/*'。如果您在任何Web浏览器中搜索此字符，您将看到以下搜索参数名称= '*%2F*'。所以我们需要转换那些字符。

encodeURIComponent(string) 功能很容易实现，该功能适用于包括IE 11在内的所有浏览器。因此，URLSearchParams的替代方法如下：

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

SCRIPT5009：IE11中未定义'URLSearchParams'

7 个答案: