Question

Issue

Я пишу приложение, которое использует строки запроса.

Firefox декодирует URI в адресной строке, заменяя %20 пробелами. Это прерывает обновления и закладки для моего приложения.

Я использую React и Next. js (Я уверен на 99%, что проблема Firefox, а не Next. js). Вот событие щелчка:

onClick={() => Router.push(
  `/content/?program=${encodeURIComponent(program.name)}`
)}

Я также использовал:

onClick={() => Router.push({ 
  pathname: '/content/', 
  query: { program: program.name }
})}

Конечная точка для обоих:

/content/?program=Program%201

, но Firefox декодирует это:

/content/?program=Program 1

Интересно то, что window.location.search по-прежнему возвращает Program%201 (в отличие от Program 1 в адресной строке).

Я прочитал несколько сообщений StackOverflow по этому вопросу, но не нашел работающего решения.

Google использует "+" для пробелов, и это работает (даже в Firefox ). Поиск «почему это происходит» приводит к &q=why+is+this+happening

Несколько человек сказали, что %20 следует использовать вместо + при кодировании пробелов.

в браузере encodeURIComponent() и Функции encodeURI() заменяют пробелы на %20.

Должен ли я создать пользовательскую функцию encodeURI, которая работает в Google? Есть ли способ предотвратить взлом Firefox URI в адресной строке?

Использование строк запроса в URI без проблем с декодированием браузера