AXIOS Post не работает с приложением REACT в Internet Explorer

Question

Примечание: У меня уже есть решение для этого, я хотел бы предоставить его здесь в качестве вопроса / ответа, чтобы, если другие столкнутся с этой проблемой, они могли видеть, будет ли работать то, что для меня работает.их.

Что я пытаюсь сделать: Я работаю над приложением REACT, которое должно отправлять данные в сервлет Java.Когда я смотрел в Интернете, я увидел, что AXIOS рекомендуют делать для этого только команды Post.

Проблема: У меня есть следующий код, который отлично работает в Edge, Chrome и Firefox, но не работает в ИнтернетеПроводник (с ошибкой URLSearchParams не найден в консоли браузера IE)

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

        var urlToPost = 'https://localhost:8080/someServlet/someMethod';

        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.
                alert('Error during submission');
            })            

Answer 1

Вам понадобится полифилл для URLSearchParams в IE

https://www.npmjs.com/package/url-search-params-polyfill

Answer 2

Было несколько предложений, которые я видел в Интернете о том, как решить эту проблему, и были некоторые, которые «работали» в IE, что означало, что я не получил ошибку в консоли браузера IE, но когда данные достигли сервлета Java, извлеченные поля данныхбыли нулевыми.

Таким образом, решение для меня заключалось в том, чтобы использовать jQuery для создания поста при использовании Internet Explorer, например:

       // This if statement checks to see if the user's browser is Internet Explorer
       // if its true then use jQuery to do the POST
       if((navigator.userAgent.indexOf("MSIE") !== -1 ) || (!!document.documentMode === true )) //IF IE > 10
       {
           var myObject = {
              var1: this.state.data1,
              var2: this.state.data2
            };
            var urlToPost = 'https://localhost:8080/someServlet/someMethod';
            $.post(urlToPost, myObject, 
                function(result) {  
                   // handle response
               })
              .done(function(result) {
                   // handle response
              })
              .fail(function(result) {
                  // handle response
              })
              .always(function(result) {
                 // handle response
              });

       } else {
        // use the AXIOS POST command code from my initial question above
       }

Перед этим мне пришлось установить jquery.и обещаем, используя следующие команды:

npm install jquery

npm install es6-обещание

Затем в верхней части моего файла реакции у меня быловключить следующие операции импорта:

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

С этими изменениями Internet Explorer больше не выдавал мне консольных ошибок, а имеющийся у меня сервлет Java смог извлечь ненулевые данные из объекта HTTP Response.