base64 编码
问题： 最近做项目活动时，经常会分享链接到第三方平台，
url上拼接的中文字符串虽然已经经过encodeURIComponent 编码，但是还是会被浏览器自动解码
导致分享出去的链接地址并不能正确的打开，
ps: 浏览器解析经过encodeURIComponent编码的url，只会解析出中文字符，貌似其他字符还是编码后的，并不会解码（@_@）想要拿到的链接格式
image.png
-
实际获取链接格式（ps: android版twitter会自动获取页面url，而拿到的url为下面格式）
image.png
为了解决这个问题
- 采用了base64编码
// base64编码之前转义(escape)字符串
function b64EncodeUnicode(str) {
return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, (match, p1) => String.fromCharCode(`0x${p1}`)))
}
// 例
b64EncodeUnicode('味儿')
此时得到的编码后的字符串为 5ZGz5YS/
注意到字符串结尾有特殊字符‘／’,如果这样的字符串直接放在url会影响hash路径的获取
所以我们需要进行二次编码
- encodeURIComponent 将
5ZGz5YS/编码为5ZGz5YS%2F
最终得到的URL：
image.png
- 此处应该有掌声（呱唧呱唧=w=）
ps： 编码之后需要解码时要注意：
- 先进行
decodeURIComponent解码 - 再进行
b64DecodeUnicode 解码
function b64DecodeUnicode(str) {
return decodeURIComponent(atob(str).split('').map(c => `%${(`00${c.charCodeAt(0).toString(16)}`).slice(-2)}`).join(''))
}
