个别服务端接口的参数都是json格局,然而因为某些起因当入参须要XML格局的怎么办? 如装置在本地零碎的ic卡驱动服务须要写卡操作的接口入参为xml格局:

现有参数,data项能够有多个:

    var json = {      iccard: {        operation: "writeCard",        data:[{Id:1, Number:10001},...]      }    };

理论XML格局:

<iccard><operation>writeCard</operation>//接口操作标识writeCard为写卡。<data><Id>1</Id><Number>10001</Number></data><data><Id>2</Id><Number>10002</Number></data><data><Id>3</Id><Number>10003</Number></data>...</iccard>

一种形式是把json数据通过正则把参数全都转成有闭合标签尖括号<xxx>的字符串。其实是能够应用一个更简便、稳固的办法,应用x2js库把json转成xml格局,下载安装x2js库并导入:

import x2js from "x2js";var x2jsxml = new x2js();  if(iccardApi=="writeCard"){    var json = {      iccard: {        operation: "writeCard",        data: data.param      }    };    data.param = x2jsxml.js2xml(json);//转成xml格局  }

在申请之前对入参进行解决后把data带到入参中,应用Promise和Ajax封装一个专门解决ic卡XML接口对接的CCardAjax函数
ICCard.js:

"use strict";import { Loading } from "element-ui";import x2js from "x2js";var x2jsxml = new x2js();const baseUrl = "http://localhost:8888/iccard"; //ic卡控件地址let ICCardObj = {};//iccardApi(read读卡,writeCard写卡)ICCardObj.ajax = (iccardApi, data, that) => {  var isHideErrorTip = false;  if ("isHideErrorTip" in data) { //是否不显示未插卡提醒    isHideErrorTip = data.isHideErrorTip;    delete data.isHideErrorTip;  }  if(iccardApi=="writeCard"){    var json = {      iccard: {        operation: "writeCard",        data: data.param      }    };     data.param = x2jsxml.js2xml(json);  }  var loading = Loading.service({    lock: true,    text: "正在执行操作...",    spinner: "el-icon-loading",    background: "rgba(0, 0, 0, 0.3)"  });  return new Promise((resolve, reject) => {    $.ajax({      url: baseUrl + "/" + iccardApi,      type: "GET",      data: data,      success: function(res) {        loading.close();        if (res.resultCode == "error") { //未插卡 读卡失败          reject(res);          if (!isHideErrorTip) {            that.$message({              title: "正告",              message: "请插卡!",              type: "error"            });          }        } else {          resolve(res.dataList);          console.log("读取胜利");        }      },      error: function(res) {//读卡失败        loading.close();        if (!isHideErrorTip) {          that.$message({            title: "正告",            message: "未启动IC卡控件,请先正确启动",            type: "error"          });        }        reject(res);      }    });  });};export default ICCardObj;

ICCardAjax绑定到vue原型链上供各组件应用:

import ICCardAjax from "@/assets/js/ICCard.js";Vue.prototype.ICCardAjax = ICCardAjax;

组件中应用:

    //读卡-查问    readICCard() {      return new Promise((resolve, rej) => {        this.ICCardAjax.ajax("read", {}, this)          .then(res => {            resolve(res);            //读卡胜利            ...          })          .catch(res => {            rej(res);            ...         //读卡失败          });      });    },   writeCard(data) {      return new Promise((resolve, rej) => {        this.ICCardAjax.ajax("writeCard", { param: data }, this)          .then(res => {            resolve(res);            console.log("写卡胜利");          })          .catch(res => {            rej(res);            this.$message({              message: "写卡失败",              type: "error"            });          });      });    },    //写个卡    querySubmit() {     this.writeCard([                {                  Id: 4,                  Number: 111                },                 {                   Id: 4,                  Number:222                },                 {                   Id: 4,                  Number: 333                }                  ]).then(res => {                this.$message({                  message: "写查询卡胜利!",                  type: "success"                });                this.readICCard();              });    },```