【JavaScript】使用 decodeURIComponent 的時候報錯 Uncaught URIError: URI malformed
問題:
在做頁面搜尋功能的時候,需要URL地址中拼接查詢關鍵字(key),然後 跳轉到拼接後的地址(https://xxx.com/search?q=key)。如果key裡面有中文字,瀏覽器會預設編碼掉,所以這個頁面調查詢介面的時候需要先解碼(/api/search?content=解碼後的key),出現了上面的錯誤。
原因:
查詢關鍵字包含一些瀏覽器敏感的關鍵詞,例如:# , & , =
,而導致報錯的是 %
,是因為編碼漢字是 % 開頭的,多加一個 % 會導致 decodeURIComponent 執行報錯。
解決:
在點選查詢拼接關鍵字key的時候,對key中含有敏感的詞進行轉譯,例如,將%號轉譯為 %25
其他一些關鍵字的編碼對應為:
特殊字元 | 含義 | 編碼 |
---|---|---|
% | 指定特殊字元 | %25 |
# | 表示錨點 | %23 |
& | URL Search分隔符 | %26 |
= | URL中指定引數的值 | %3D |
寫一個方法,把key中的敏感字編碼掉再去拼接字串查詢就可以了,這樣在使用decodeURIComponent 就沒問題了。
例如:
// 對查詢關鍵字中的特殊字元進行編碼
encodeSearchKey(key) {
const encodeArr = [{
code: '%',
encode: '%25'
}, {
code: '?',
encode: '%3F'
}, {
code: '#',
encode: '%23'
}, {
code: '&',
encode: '%26'
}, {
code: '=',
encode: '%3D'
}];
return key.replace(/[%?#&=]/g, ($, index, str) => {
for (const k of encodeArr) {
if (k.code === $) {
return k.encode;
}
}
});
},
相關推薦
【JavaScript】使用 decodeURIComponent 的時候報錯 Uncaught URIError: URI malformed
問題: 在做頁面搜尋功能的時候,需要URL地址中拼接查詢關鍵字(key),然後 跳轉到拼接後的地址(https://xxx.com/search?q=key)。如果key裡面有中文字,瀏覽器會預設編碼掉,所以這個頁面調查詢介面的時候需要先解碼(/api/sea
【原創】My97DatePicker報錯 Uncaught TypeError: Cannot read property 'length' of null 分析
公司ui前端框架的日曆外掛使用的是第三方的My97DatePicker,在使用過程中,為了滿足日期格式化的要求 寫了下面兩種寫法 下面這樣展示 “年-月-日 時:分:秒” 是正常,且無報錯 但是換個格式,下面這個是"時分秒"的格式就有問題 報錯如下: VM3
【PHP】 解決報錯:Error: php71w-common conflicts with php-common-5.4.16-43.el7_4.x86_64
with gpo pos erro conf 問題 error col 擴展 背景: 手動安裝的PHP7 環境 問題:在安裝擴展的時候。無論輸入 php-* 來安裝任何擴展。都會報錯 Error: php71w-common conflicts with php-c
【ide】MyBatis報錯: org.apache.ibatis.binding.BindingException: Invalid bound statement (not found):
align basedir schedule ima reflect oda apache ref mapper at org.apache.ibatis.binding.MapperMethod$SqlCommand.<init>(MapperMethod.j
【Android】AS報錯:Configuration on demand is not supported by the current version of the Android Gradle
轉載請註明出處,原文連結:https://blog.csdn.net/u013642500/article/details/80218299 【錯誤】 Configuration on demand is not supported by the current version o
【Android】AS報錯解決方法:Non-static method '*' cannot be referenced from a static context
轉載請註明出處,原文連結:https://blog.csdn.net/u013642500/article/details/80156306 【錯誤】 Non-static method '*' cannot be referenced from a static context
關於在JSP中寫【if】和【else】語句報錯Syntax error on token "else", delete this token
這裡轉載一篇文章:https://blog.csdn.net/sinat_37062120/article/details/79208949 jsp中插入java程式碼 <%if (***)%> <%=***%> <%else %> <%=***%&
【linux】linux報錯:安裝nginx時,make報錯解決方法
目錄 一、報錯情況 二、解決方法 三、openssl舊版本下載和安裝 一、報錯情況 (1)輸入命令,報錯: make (2)具體報錯: make[1]: *** [objs/src/event/ngx_event_openssl.o] 錯誤
【Python】django報錯:TypeError: __init__() missing 1 required positional argument: 'on_delete'解決辦法
錯誤程式碼: from __future__ import unicode_literals from django.db import models from django.utils.encoding import python_2_unicode_compatible
【Python】django報錯SyntaxError: from __future__ imports must occur at the beginning of the file解決方法
D:\PythonWorkstation\django\django_station\queryset>python manage.py makemigrations Traceback (most recent call last): File "manag
【vue】elementUI報錯:_self.$scopedSlots.default is not a function
Vue 會盡可能高效地渲染元素,通常會複用已有元素而不是從頭開始渲染。 這樣也不總是符合實際需求,所以 Vue 為你提供了一種方式來表達“這兩個元素是完全獨立的,不要複用它們”。只需新增一個具有唯一值的 key 屬性即可。見詳情 錯誤程式碼 <!-- 程式碼塊1 --> <el-tab
【adb】adb 報錯 solution
報錯 一: Windows上出現: C:\Users\nick.chen>adb reboot adb server version (32) doesn't match this client (39); killing... error: unknown host serv
JavaScript decodeURIComponent Uncaught URIError: URI malformed
使用 JavaScript 的 decodeURIComponent 方法解碼使用 Java 的 產生錯誤的原因:2、你也可能是使用其它後端語言編碼的,請檢查姿勢是否正確。3、傳入的字串格式被破壞。4、
【記錄】tensorflow報錯DLL load failed:找不到指定程式
更新anoconda後出現了版本不相容情況,keras不能正常使用,更新了tensorflow後測試報錯如下: 解決方法如提示:protobuf 這個庫版本不相容,按搜尋到的方法將重新安裝指定版本即可。命令如下: pip install protobuf==3.6.0
【ubuntu】出現報錯:the system is running in low-graphics mode
在出現該彈窗時,ctrl + Alt + F1 輸入使用者名稱+密碼 //機器上之前有一個老版本,請按照下面這些命令來做。Nvidia和ATI/AMD顯示卡的命令都一樣。 sudo add-ap
【JavaScript】頁面載入 解決Uncaught TypeError: Cannot set property of undefined at
在初學js的時候,有同學會遇到 Uncaught TypeError: Cannot set property 'onmouseover' of undefined at **.html 的問題 這個問題牽扯到頁面載入順序的問題。 我們知道 頁
【資料庫】mysql報錯 編碼碼1130 和錯誤碼1146
1、錯誤編碼1130 問題:1130-Hose‘172.16.12.129’is not allowed to connect to this MySQL server 原因:MySQL伺服器沒有建立,遠端客戶的賬戶資訊 解決: 1.1 登入 :mysql -uroot 1
url傳參出現Uncaught URIError: URI malformed錯誤解決
url加密傳參有時候會出現Uncaught URIError: URI malformed的錯誤,這是因為你的url中包含了“%”字元,瀏覽器在對“%”執行decodeURIComponent時報錯,正確的解決是將%全部替換為%25再進行傳輸: urlStr.replace
【代碼審計】XDCMS 報錯註入
信息 輸入 alt 變量 出現 img 語句 limit lec 審計的都是之前很老的一些的CMS,把學習的過程分享出來,如果有正在和我一起學習的兄弟們,希望看到文章之後會有所收獲 --------------------------------------------
轉發【指令碼安裝Docker報錯(container-selinux >= 2.9)處理解決方法】
轉發【指令碼安裝Docker報錯(container-selinux >= 2.9)處理解決方法】 參考:https://blog.csdn.net/qq_41772936/article/details/81080284 我的測試環境 - VMWare12 - CentO