在我编写公司小程序的过程中,有一次在网页端添加了一张图片,结果在小程序端访问失败了,究其原因,竟然是因为该图片名称中有一个“&”符号,网页端添加后,自动转义成了“&”存储到了数据库。当然,这种格式如果是在HTML去访问图片地址,会自动在转义成“&”,但是小程序的WXML并没有这种功能,所以这就需要我们在小程序端自行操作进行转义了。

首先,明确一下会自动转义存储的常用的特殊字符有哪些:

字符 转义字符
" "
& &
< &lt;
> &gt;
[空格] &nbsp;

如果是在<text>标签中显示文本内容,可以直接通过设置decode=‘true’的属性进行转义。

但因为我是在<image>标签中访问,所以小程序中没有便捷方法可以转义,写了一个死方法——replace.js,如下:

//替换URL中特殊字符
function replaceSpecialChar(url) {
url = url.replace(/&quot;/g, '"');
url = url.replace(/&amp;/g, '&');
url = url.replace(/&lt;/g, '<');
url = url.replace(/&gt;/g, '>');
url = url.replace(/&nbsp;/g, ' ');
console.log("转义字符", url);
return url;
}
module.exports = {
replaceSpecialChar: replaceSpecialChar
}

需要用到的时候,在页面对应的js里面调用该方法:

var replace = require("../../utils/replace.js");
Page({
..............
url = replace.replaceSpecialChar(res.data.url)
})

这样就能访问到图片啦~~~

/****************************我是可爱的分割线********************************/

微信小程序特殊字符转义方法——&转义&amp;等等的更多相关文章

  1. 微信小程序数据请求方法wx.request小测试

    微信小程序数据请求方法 wx.request wxml文件: <view> <textarea value="{{textdata}}"/> </vi ...

  2. 微信小程序开发系列教程三:微信小程序的调试方法

    微信小程序开发系列教程 微信小程序开发系列一:微信小程序的申请和开发环境的搭建 微信小程序开发系列二:微信小程序的视图设计 这个教程的前两篇文章,介绍了如何用下图所示的微信开发者工具自动生成一个Hel ...

  3. 微信小程序最新授权方法,getUserInfo

    20180511微信小程序正式关闭原先getUserInfo的逻辑 不再允许自动弹出授权框. 方法一: index.wxml(准备一个用于给用户授权的页面,我这里直接用了一个全屏按钮) <vie ...

  4. 微信小程序——wxParse使用方法

    wxParse是一个微信小程序富文本解析组件.现在小程序里面自带了一个<rich-text>组件也能解析富文本,但是表现不尽人意.所以我还是采用的wxParse来解析富文本的. wxPar ...

  5. 微信小程序节点查询方法:wx.createSelectorQuery()的使用场景与注意事项

    小程序由于内置于微信,这使得它有了得天独厚的宣传和使用优势,本着学习的心态,我在官网上看了一遍开发文档,大致得出小程序框架的设计模式与使用注意事项(重点来了,其实开发文档某些方面叙述的并不仔细,甚至存 ...

  6. 微信小程序~生命周期方法详解

    生命周期是指一个小程序从创建到销毁的一系列过程 在小程序中 ,通过App()来注册一个小程序 ,通过Page()来注册一个页面 先来看一张小程序项目结构 从上图可以看出,根目录下面有包含了app.js ...

  7. 微信小程序--数据共享与方法共享

    目录 全局数据共享 Mobox npm安装及其注意事项 小程序对 npm 的支持与限制 npm 依赖包的安装与使用 Mobox 1. 全局数据共享 2. 小程序中的全局数据共享方案 3. 使用mobx ...

  8. 微信小程序 weui 使用方法

      https://github.com/Tencent/weui-wxss/ 下载地址用于小程序的https://github.com/Tencent/weui   下载地址用于H5    运用示例 ...

  9. 微信小程序,全局变量方法的使用

    方法一:app.js 内设置全局变量(如屏宽,屏高的设置) 1.app.js文件,定义全局变量 /定义全局变量 globalData:{ userInfo:null, sysInfo:null, wi ...

随机推荐

  1. hdu 4018 Parsing URL(字符串截取)

    题目 以下引用自百度百科: sscanf 的相关用法 头文件:#include<stdio.h>     1. 常见用法. 1 2 3 charbuf[512]; sscanf(" ...

  2. UVALive 3026(KMP算法)

    UVALive 3026     KMP中next[]数组的应用: 题意:给出一个字符串,问该字符串每个前缀首字母的位置和该前缀的周期. 思路:裸KMP直接上就是了: 设该字符串为str,str字符串 ...

  3. [LUOGU]4932 浏览器

    \(\_\_stdcall\)大佬出的题\(Orz\) 我们惊奇地发现,加入\(\_\_popcount(x)\)和\(\_\_popcount(y)\)的奇偶数性相同,那么\(\_\_popcoun ...

  4. 51.percentiles rank以及网站访问时延SLA统计

    主要知识点: percentile_ranks的用法 percentile的优化     一.percentile_ranks的用法 SLA:就是所提供的服务的标准. 比如一个网站的提供的访问延时的S ...

  5. springboot之多任务并行+线程池处理

    最近项目中做到一个关于批量发短信的业务,如果用户量特别大的话,不能使用单线程去发短信,只能尝试着使用多任务来完成!我们的项目使用到了方式二,即Future的方案 Java 线程池 Java通过Exec ...

  6. toj 1421

    题意:假如存在矩阵A,A[i][0] + A[i][1] + ...... + A[i][n - 1] == SR[i],A[0][j] + A[1][j] + ...... + A[n - 1][j ...

  7. MongoDB:更改数据库位置(Windows)

    MongoDB在Windows中默认的数据库目录是c:\data.如果在没有该目录的情况下,直接运行mongod.exe,就会报如下错误: 在某些情况下,我们并不想把mongoDB的数据库放在c盘,这 ...

  8. C++对象模型——对象复制语意学 (Object Copy Semantics)(第五章)

    5.3    对象复制语意学 (Object Copy Semantics) 当设计一个 class,并以一个 class object指定给 class object时,有三种选择:     1.什 ...

  9. Loadrunner | 录制脚本时弹不出IE的解决办法

    Loadrunner在录制脚本的时候有时候会遇到弹不出IE的问题,那怎么解决呢?别急,按照以下几个步骤操作,一般就可以解决这个问题. 1. IE浏览器取消勾选[启用第三方浏览器扩展] 启动IE,从[工 ...

  10. Spring 定时器 No qualifying bean of type [org.springframework.scheduling.TaskScheduler] is defined

    Spring 定时器 No qualifying bean of type [org.springframework.scheduling.TaskScheduler] is defined stac ...