IE11でURLSearchParamsがエラーになる


エラー

Vue.jsで開発中に、axiosでPOSTするのにURLSearchParamsを使ったらIE11でエラーが出てしまった。

[Vue warn]: Error in v-on handler (Promise/async): "ReferenceError: 'URLSearchParams' は定義されていません。"

axios

こんな感じで使っていた。

const params = new URLSearchParams();
params.append("hoge", "hoge");

axios
  .post(url, params)
  .then(res => {
    return res;
  })
  .catch(error => {
    return error;
  });

URLSearchParams

URLSearchParamsはそもそもIE11では使えないものらしい。
https://developer.mozilla.org/en-US/docs/Web/API/URL#Browser_compatibility

url-search-params-polyfill

以下のpolyfillを追加して解消した。
jerrybendy/url-search-params-polyfill: a simple polyfill for javascript URLSearchParams

追加

npm i --save url-search-params-polyfill
main.js
import "url-search-params-polyfill";

参考

IE11 > axios > POSTのつもりがうまく送れてないとき
IE11でURLSearchParamsを使った処理でエラーが発生する