小程序富文本解析

Charlie_Jade 发布于2019-08-23 12:35 / 2407人阅读

摘要：目前项目中的富文本来自于后台的编辑器，导致富文本比较粗糙，什么内容都有。我们目前的方案是先让富文本通过过滤工具进行过滤。

目前项目中的富文本来自于后台的编辑器，导致富文本比较粗糙，什么内容都有。直接使用wxparse进行解析会失败。我们目前的方案是先让富文本通过js-xss过滤工具进行过滤。然后在进行解析。

Js-xss使用方法：

下载整个js-xss项目

安装browserify
npm install -g browserify

在js-xss目录下，使用browserify重新打包
browserify lib/index.js > dist/xss.js -s xss

如果提示不能找到cssfilter文件，则需要通过下面命令获取这个文件

$ npm install cssfilter --save

先引入文件

const xss = require("../../../lib/js-xss/dist/xss.js");

//富文本解析

let that = this;
let article = _data.content;

let options = { // 自定义规则
  whiteList: {  // 白名单为空，表示过滤所有标签
    html: [],
    body: [],
    div: ["style"],
    p: ["style"],
    img: ["src"],
    strong: ["style"]
  },        
  stripIgnoreTag: true,      // 过滤所有非白名单标签的HTML
  allowCommentTag: false, //去掉HTML备注
  stripIgnoreTagBody: ["script", "style"] // script标签较特殊，需要过滤标签中间的内容
};
let myxss = new xss.FilterXSS(options);
// 以后直接调用 myxss.process() 来处理即可
article = myxss.process(article);

这时得到的article就是过滤之后的富文本内容了。
https://segmentfault.com/a/11...

GPU云服务器云服务器富文本百度富文本读取富文本 php富文本设计

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/98797.html

微信小程序富文本解析wxParse Alpha0.1-支持HTML及markdown解析

摘要：本项目由微信小程序开发论坛会员开发原文地址垂直微信小程序开发交流社区加载慢，等等微信小程序富文本解析自定义组件，支持及解析可能是第一个微信小程序富文本解析组件代码库地址示例版使用地址现状版本号目前还不太适合直接使用目前项目不本项目由微信小程序开发论坛-WeAppDev http://weappdev.com/ 会员开发原文地址: http://weappdev.com/t/wxp...

daydream 2019-08-01 15:51 评论0 收藏0
富文本解析-微信小程序 rich-text 组件

摘要：微信小程序富文本解析器微信小程序在组件后开始支持富文本解析，但需要对照一套自定义规则的数据格式，返回的富文本需要前端做数据转换。微信小程序富文本解析器微信小程序在rich-text组件后开始支持富文本解析，但需要对照一套自定义规则的 JOSN 数据格式，API 返回的富文本需要前端做数据转换。这个主要是用于某些需要 API 直接输出富文本的地方。比如后端输出title字段, 但 ...

renweihub 2019-08-23 11:31 评论0 收藏0
wxParse version0.2-更好的微信小程序富文本HTML及Markdown解析

摘要：信息版本号历史版本号具体代码请查看仓库分支地址解决问题微信小程序富文本解析组件详述因为微信小程序没有提供等解析，原展示类文本没有办法图文并茂的原生展示，主要目的就是弥补富文本解析空缺的组件，欢迎使用反馈开发信息微信小程序开发论坛垂直微信小程 wxParse信息版本号0.1 历史版本号0.2 具体代码请查看仓库分支V1 github地址: https://github.com/ici...

cucumber 2019-08-29 11:32 评论0 收藏0
wxParse version0.2-更好的微信小程序富文本HTML及Markdown解析

摘要：信息版本号历史版本号具体代码请查看仓库分支地址解决问题微信小程序富文本解析组件详述因为微信小程序没有提供等解析，原展示类文本没有办法图文并茂的原生展示，主要目的就是弥补富文本解析空缺的组件，欢迎使用反馈开发信息微信小程序开发论坛垂直微信小程 wxParse信息版本号0.1 历史版本号0.2 具体代码请查看仓库分支V1 github地址: https://github.com/ici...

zhonghanwen 2019-08-01 15:58 评论0 收藏0
小程序rich-text对富文本支持方案

摘要：小程序富文本解析目前小程序使用比较多的富文本方案一个是小程序自带的组件，一个是。使用方法文殊林舍山房由丽江铂尔曼度假酒店余明金老师设计，是丽江古城的网红民宿，年被评为全国家最美民宿，以及年最值得睡的张床。小程序富文本解析目前小程序使用比较多的富文本方案一个是小程序自带的rich-text组件，一个是wxPrase。 wxPrase原理是把原有的html标签全部解析成小程序的组件，这...

William_Sang 2019-08-29 17:21 评论0 收藏0