关于swagger中接口一键复制功能

在这里插入图片描述
第一步:右键添加网页
在这里插入图片描述
第二步,将网址输入改成以下代码

javascript: (function() {
    const rootApp = document.getElementById("app")?.__vue__;
    const store = rootApp.$store;
    const globals = store.state.globals;
    const swagger = globals.swagger;
    const currentInstance = swagger.currentInstance;
    const tags = currentInstance.tags;
    const tagsMap = {};
    tags.forEach(tag => tagsMap[tag.name] = tag);
    function addBtn() {
    document.querySelectorAll('.BasicLayout .knife4j-menu > ul > li.ant-menu-submenu').forEach(item => {
    const titleDom = item.querySelector('.ant-menu-submenu-title > span');
    titleDom.querySelector('.copy-button')?.remove();
    const _data = titleDom.__vue__.item;
    if (!tagsMap[_data.name]) return;
    const create_button = document.createElement('button');
    create_button.className = 'copy-button';
    create_button.style.cssText = `position: absolute;left: 14px;transform: translateY(-50%);top: 50%;justify-content: center;align-items: center;display: flex;height: 24px;width: 24px;white-space: nowrap;cursor: pointer;color: rgb(255, 255, 255);text-align: center;outline: none;transition: all 0.1s ease 0s;user-select: none;border: none;background-color: rgb(255, 101, 38);padding: 4px;font-size: 12px;border-radius: 12px;margin-left: 5px;`;
    create_button.innerHTML = '<svg focusable="false" class="" data-icon="copy" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M832 64H296c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h496v688c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8V96c0-17.7-14.3-32-32-32zM704 192H192c-17.7 0-32 14.3-32 32v530.7c0 8.5 3.4 16.6 9.4 22.6l173.3 173.3c2.2 2.2 4.7 4 7.4 5.5v1.9h4.2c3.5 1.3 7.2 2 11 2H704c17.7 0 32-14.3 32-32V224c0-17.7-14.3-32-32-32zM350 856.2L263.9 770H350v86.2zM664 888H414V746c0-22.1-17.9-40-40-40H232V264h432v624z"></path></svg>';
    create_button.onclick = function (e) {
    e.stopPropagation();
    let children_template = '';
    const host = currentInstance.host;
    const desktopCode = currentInstance.desktopCode;
    let serverName = '';
    let fileName = '';
    _data.children.forEach(api => {
    const apiUrl0 = api.url;
    if (!serverName) serverName = apiUrl0.split('/')[0];
    if (!fileName) fileName = apiUrl0.split('/')[1];
    const apiUrl1 = api.url;
    const apiUrl2 = api.url;
    let fn_name = apiUrl1.split('/').slice(1).join('_');
    fn_name = fn_name.replace(/-/g, '_');
    let url = fn_name;
    
    fn_name = fn_name.replace(/\{/g, '').replace(/\}/g, '');
    
    url = apiUrl2.split('/').join('/').replace(/\{/g, '${params.').replace(/\}/g, '}');
    url = '`/' + url + '`';
    const isGet = api.method === 'GET';
    const _api_template = `
    /**  \n
     * ${api.name} \n
     * ${location.origin}/${desktopCode}/doc.html#${api.path} \n
     */ \n
    export function ${fn_name}(params?:any, other?:any){ \n
    return http.request({ \n
    url: ${url}, \n
    method: '${api.method}', \n
    ${isGet ? 'params' : 'data'}: params, \n
    ...other \n
    }) \n
    } \n
    \n
    `;
    
    children_template += _api_template;
    });
    
    const copyContent = `
    import http from '@/http' \n
    /** \n
    * ${_data.name} \n
    */ \n
    \n
    ${children_template}
    `;
    try {
    copyText(copyContent);
    rootApp.$message.success(`复制成功!去src/api/modules/${serverName}/下创建文件粘贴吧!`);
    } catch (error) {
    rootApp.$message.error(`复制失败!问王泳超!`);
    };
    };
    titleDom.appendChild(create_button);
    });
    };
    addBtn();
    
    
    function copyText(text) {
    if (navigator.clipboard) {
    navigator.clipboard.writeText(text).then(function () {
    console.log('复制成功');
    }, function (err) {
    console.error('复制失败', err);
    });
    } else {
    const textarea = document.createElement("textarea");
    textarea.value = text;
    document.body.appendChild(textarea);
    textarea.select();
    document.execCommand("copy");
    document.body.removeChild(textarea);
    };
    }
})()

第三步:打开swager页面,点击保存的网页,就可以出现复制按钮
在这里插入图片描述

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值