在我编写公司小程序的过程中,有一次在网页端添加了一张图片,结果在小程序端访问失败了,究其原因,竟然是因为该图片名称中有一个“&”符号,网页端添加后,自动转义成了“&”存储到了数据库。当然,这种格式如果是在HTML去访问图片地址,会自动在转义成“&”,但是小程序的WXML并没有这种功能,所以这就需要我们在小程序端自行操作进行转义了。
首先,明确一下会自动转义存储的常用的特殊字符有哪些:
字符 | 转义字符 |
“ | " |
& | & |
< | < |
> | > |
[空格] | |
如果是在<text>标签中显示文本内容,可以直接通过设置decode=‘true’的属性进行转义。
但因为我是在<image>标签中访问,所以小程序中没有便捷方法可以转义,写了一个死方法——replace.js,如下:
//替换URL中特殊字符 function replaceSpecialChar(url) { url = url.replace(/"/g, '"'); url = url.replace(/&/g, '&'); url = url.replace(/</g, '<'); url = url.replace(/>/g, '>'); url = url.replace(/ /g, ' '); console.log("转义字符", url); return url; } module.exports = { replaceSpecialChar: replaceSpecialChar }
需要用到的时候,在页面对应的js里面调用该方法:
var replace = require("../../utils/replace.js"); Page({ .............. url = replace.replaceSpecialChar(res.data.url) })
这样就能访问到图片啦~~~
/****************************我是可爱的分割线********************************/