摘要：
最近，该公司要求从接口返回xml格式的数据，然后由前端解析和呈现。类似的情况以前也处理过。接口是用java编写的。如果您这次想编写演示，请使用eggjs尝试返回xml格式的接口，然后前端将处理结果。nodejs的结尾是eggjs的开头。根据官方文件，应首先运行应用程序。接下来，您需要安装依赖的egg-view-ejsnpmiegg-view-ejs-S配置文件/config/plugin.js并添加“usestrict”导出；。。。修改/config/config。违约js“限制”；module.exports=appInfo=˃{…config.view={mapping:{'.xml'：'ejs'，}，}；…}/App/router.js添加了一个路由“usestrict”；module.exports=应用=˃｛const｛router，controller｝=应用；…//模拟xml格式数据路由器的返回。获取；…｝；添加相应的控制器/app/controller/xml。js“限制”；constController=require.Controller；classXmlControllerextendsController｛asyncindex（）｛const｛ctx｝=this；//使用模板引擎awaitctx。渲染；｝｝module.exports=XmlController；在项目目录应用程序中创建视图文件夹，并创建index.xml模板Success可以测试，并且可以测试在邮递员中运行的结果：˂？
最近公司有个需求，需要从接口返回xml格式数据，再由前端解析后渲染。之前处理过类似的场景，接口是用java写的。本次想写个demo，用eggjs尝试返回xml格式接口，再由前端处理结果。
nodejs端
首先是eggjs，根据官方文档，先把应用跑起来。
接着需要安装依赖egg-view-ejs
npm i egg-view-ejs -S
配置文件 /config/plugin.js 添加
'use strict';
...
exports.ejs = {
enable: true,
package: 'egg-view-ejs',
};
...
修改 /config/config.default.js
'use strict';
module.exports = appInfo => {
...
config.view = {
mapping: {
'.xml': 'ejs',
},
};
...
}
/app/router.js 加个路由
'use strict';
module.exports = app => {
const { router, controller } = app;
...
// 模拟返回xml格式数据
router.get('/xml', controller.xml.index);
...
};
新增对应的控制器 /app/controller/xml.js
'use strict';
const Controller = require('egg').Controller;
class XmlController extends Controller {
async index() {
const { ctx } = this;
// 使用模板引擎
await ctx.render("index.xml",{lists:[{name:'Tom'},{name:'Jerry'}]});
}
}
module.exports = XmlController;
在项目目录 app 中创建 view 文件夹, 并创建 index.xml 模板
<?xml version="1.0" encoding="UTF-8"?>
<oauth>
<status>200</status>
<data>
<% for( let i = 0; i < lists.length; i++ ) { %>
<list> <name><%=lists[i].name%></name> </list>
<% } %>
</data>
<message>Success</message>
</oauth>
可以测试了，在postman中运行结果：
<?xml version="1.0" encoding="UTF-8"?>
<oauth>
<status>200</status>
<data>
<list>
<name>Tom</name>
</list>
<list>
<name>Jerry</name>
</list>
</data>
<message>Success</message>
</oauth>
前端
可以用一个html文件测试
引入axios.js cdn依赖
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
引入 jquery.js 和 jquery.xml2json.js cdn 依赖
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<script src="http://www.jsons.cn/Down/jquery.xml2json.js"></script>
xml2json可以把xml格式转化成json
axios.get('http://localhost:7001/xml').then(res=>{
console.log(res.data);
//读取返回字符串
const _xml = new DOMParser().parseFromString(res.data, "text/xml");
console.log(_xml);
//获取 code 节点中内容
const htmlContent = _xml.getElementsByTagName("data")[0].innerHTML;
console.log(htmlContent);
//获得json数组
const json_obj = $.xml2json(res.data);
console.log(json_obj);
})