微信小程序特殊字符转义方法——&转义&等等
在我编写公司小程序的过程中,有一次在网页端添加了一张图片,结果在小程序端访问失败了,究其原因,竟然是因为该图片名称中有一个“&”符号,网页端添加后,自动转义成了“&”存储到了数据库。当然,这种格式如果是在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 ...
随机推荐
- 【剑指Offer】剑指offer题目汇总
本文为<剑指Offer>刷题笔记的总结篇,花了两个多月的时间,将牛客网上<剑指Offer>的66道题刷了一遍,以博客的形式整理了一遍,这66道题属于相对基础的算法题目,对于 ...
- idea SSM里配置redis
参考文章 https://blog.csdn.net/qq_17635843/article/details/78522776
- HDU 4027(线段树)
HDU4027 题意:操作指令为0时,对区间[x,y]之间的数字进行开平方:指令为1的时候,对区间[x,y]之间的数字求和并输出: 思路:线段树处理就OK了,但是64位内的数最多开8次平方就为1了(开 ...
- Linux之FTP/TFTP(vsftp、vsftpd) HTTP(httpd、apache) DHCP(dhcpd)
FTP/TFTP(vsftp.vsftpd): FTP是File Transfer Protocol(文件传输协议)而中文简称为"文传协议".用于Internet上的控制文件的双向 ...
- 66.零停机下reindex
主要知识点: 理解reindex的使用场景和必要性 学会reindex 一.理解reindex的使用场景和必要性 假设:在某一个index中依靠dynamic mapping插入数据, ...
- python下操作mysql 之 pymsql
python下操作mysql 之 pymsql pymsql是Python中操作MySQL的模块, 下载安装: pip3 install pymysql 使用操作 1, 执行SQL #!/usr/ ...
- BZOJ 2501 [usaco2010 Oct]Soda Machine
[题意概述] 给出一个[0,1,000,000,000]的整数数轴,刚开始每个位置都为0,有n个区间加操作,最后询问数轴上最大的数是多少. [题解] 我写的是离散化后线段树维护区间最值. 其实貌似不用 ...
- 3.1 一个简单的Java应用程序
如下一个最简单的应用程序,它将只发送一条消息到控制台窗口中: package myjavapp; public class FirstSample { public stati ...
- textarea 提交到数据库的内容,输出到 html 中显示正常的格式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- [cf 599C] Day at the Beach
题意:有n个数,将其分组使整个数列排序后每组中的数仍在该组中,求最多的分组数. 代码很易懂 #include <iostream> #include <algorithm> # ...