微信小程序特殊字符转义方法——&转义&等等
在我编写公司小程序的过程中,有一次在网页端添加了一张图片,结果在小程序端访问失败了,究其原因,竟然是因为该图片名称中有一个“&”符号,网页端添加后,自动转义成了“&”存储到了数据库。当然,这种格式如果是在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)
})
这样就能访问到图片啦~~~
/****************************我是可爱的分割线********************************/

微信小程序特殊字符转义方法——&转义&等等的更多相关文章
- 微信小程序数据请求方法wx.request小测试
微信小程序数据请求方法 wx.request wxml文件: <view> <textarea value="{{textdata}}"/> </vi ...
- 微信小程序开发系列教程三:微信小程序的调试方法
微信小程序开发系列教程 微信小程序开发系列一:微信小程序的申请和开发环境的搭建 微信小程序开发系列二:微信小程序的视图设计 这个教程的前两篇文章,介绍了如何用下图所示的微信开发者工具自动生成一个Hel ...
- 微信小程序最新授权方法,getUserInfo
20180511微信小程序正式关闭原先getUserInfo的逻辑 不再允许自动弹出授权框. 方法一: index.wxml(准备一个用于给用户授权的页面,我这里直接用了一个全屏按钮) <vie ...
- 微信小程序——wxParse使用方法
wxParse是一个微信小程序富文本解析组件.现在小程序里面自带了一个<rich-text>组件也能解析富文本,但是表现不尽人意.所以我还是采用的wxParse来解析富文本的. wxPar ...
- 微信小程序节点查询方法:wx.createSelectorQuery()的使用场景与注意事项
小程序由于内置于微信,这使得它有了得天独厚的宣传和使用优势,本着学习的心态,我在官网上看了一遍开发文档,大致得出小程序框架的设计模式与使用注意事项(重点来了,其实开发文档某些方面叙述的并不仔细,甚至存 ...
- 微信小程序~生命周期方法详解
生命周期是指一个小程序从创建到销毁的一系列过程 在小程序中 ,通过App()来注册一个小程序 ,通过Page()来注册一个页面 先来看一张小程序项目结构 从上图可以看出,根目录下面有包含了app.js ...
- 微信小程序--数据共享与方法共享
目录 全局数据共享 Mobox npm安装及其注意事项 小程序对 npm 的支持与限制 npm 依赖包的安装与使用 Mobox 1. 全局数据共享 2. 小程序中的全局数据共享方案 3. 使用mobx ...
- 微信小程序 weui 使用方法
https://github.com/Tencent/weui-wxss/ 下载地址用于小程序的https://github.com/Tencent/weui 下载地址用于H5 运用示例 ...
- 微信小程序,全局变量方法的使用
方法一:app.js 内设置全局变量(如屏宽,屏高的设置) 1.app.js文件,定义全局变量 /定义全局变量 globalData:{ userInfo:null, sysInfo:null, wi ...
随机推荐
- form:input 标签使用
<form:input path="suplier" htmlEscape="false" maxlength="50" id=&qu ...
- 入口文件 index.php
一. 运行流程 The index.php serves as the front controller, initializing the base resources needed to run ...
- VsCode 格式化插件配置
Beautify 1.在工作目录下建立.jsbeautifyrc文件: { "brace_style": "none,preserve-inline", &qu ...
- python爬虫17 | 听说你又被封 ip 了,你要学会伪装好自己,这次说说伪装你的头部
这两天 有小伙伴问小帅b 为什么我爬取 xx 网站的时候 不返回给我数据 而且还甩一句话给我 “系统检测到您频繁访问,请稍后再来” 小帅b看了一下他的代码 ): requests.get(url) 瞬 ...
- vim学习2-文档编辑
一.vim重复命令 1.重复执行上次命令 在普通模式下.(小数点)表示重复上一次的命令操作 拷贝测试文件到本地目录 $ cp /etc/protocols . 打开文件进行编辑 $ vim proto ...
- 【Codeforces 474D】Flowers
[链接] 我是链接,点我呀:) [题意] 让你吃东西 B食物一次必须要吃连续k个 但是对A食物没有要求 问你有多少种吃n个食物的方法(吃的序列) [题解] 设f[i]表示长度为i的吃的序列且符合要求的 ...
- 【MariaDB】MariaDB vs MySQL - 特性
原文链接: https://mariadb.com/kb/en/mariadb-vs-mysql-features/ xiaomo译------ 支持更多的存储引擎 除了标配的MyISAM, BLAC ...
- poj 2031
#include<stdio.h> #include<math.h> #include<stdlib.h> #define N 200 double co(doub ...
- NandFlash、NorFlash、DataFlash
1. NandFlash和NorFlash Flash存储芯片,俗称闪存,因其具有非易失性.可擦除性.可重复编程及高密度.低功耗等特点,广泛地应用于手机.数码相机.笔记本电脑等产品. ...
- [bzoj1131][POI2008]Sta_树形dp
Sta bzoj-1131 POI-2008 题目大意:给定一棵n个点的树,求一个根,使得深度和最大. 注释:$1\le n \le 10^6$. 想法:扭一扭即可. 扭的时候看看这个点当没当过根. ...