Vue-router decodeURI twice cause URL contains encoded % an URIError: URI malformed

[hq5544]

Version

3.0.3

Reproduction link

Sorry, It is hard to supply a minimal reproduction

Steps to reproduce

Visit http://a.b.c/#/test?d=%25
Vue-router will throw a warning URIError: URI malformed, and abandon all the query params.

What is expected?

DecodeURI once is enough.

What is actually happening?

DecodeURI twice.

---

ref:

vue-router/src/history/hash.js

Lines 100 to 106 in 627027f

	export function getHash (): string {
	// We can't use window.location.hash here because it's not
	// consistent across browsers - Firefox will pre-decode it!
	const href = window.location.href
	const index = href.indexOf('#')
	return index === -1 ? '' : decodeURI(href.slice(index + 1))
	}

vue-router/src/util/query.js

Lines 37 to 63 in 627027f

	function parseQuery (query: string): Dictionary<string> {
	const res = {}
	query = query.trim().replace(/^(\?|#|&)/, '')
	if (!query) {
	return res
	}
	query.split('&').forEach(param => {
	const parts = param.replace(/\+/g, ' ').split('=')
	const key = decode(parts.shift())
	const val = parts.length > 0
	? decode(parts.join('='))
	: null
	if (res[key] === undefined) {
	res[key] = val
	} else if (Array.isArray(res[key])) {
	res[key].push(val)
	} else {
	res[key] = [res[key], val]
	}
	})
	return res
	}

The getHash method already decoded href, but parseQuery decode it again. So caused URIError: URI malformed.
Maybe decoding in getHash is not necessary.

[hq5544]

Relevant post in forum:
https://forum.vuejs.org/t/vue-router-decodes-uri-twice-creates-errors-when-are-in-params/56685

[posva]

Indeed, we should not decode the search nor the hash in hash mode

[jgradzki]

@posva When this fix will be released?

[hq5544]

@posva When this fix will be released?

Has released in 3.0.4 81cfe71 .

[jgradzki]

Thanks for fast response, i guess i have similar but diffrent issue

URIError: URI malformed at decodeURIComponent (<anonymous>) at matchRoute (<deleted>/node_modules/vue-router/dist/vue-router.common.js:1530:42)

for (var i = 1, len = m.length; i < len; ++i) {
    var key = regex.keys[i - 1];
          console.log(m[i]);
    var val = typeof m[i] === 'string' ? decodeURIComponent(m[i]) : m[i];
    if (key) {
      // Fix #1994: using * with props: true generates a param named 0
      params[key.name || 'pathMatch'] = val;
    }
  }

value that triggers error: product/100-%-polipropylen-–-bcf

[posva]

Check #2725

BTW % is not a valid character in a url (per spec). You have to use the escaped version %25

[jgradzki]

Thanks alot!