首页 > 其他分享 >浏览器端代码获取资源

浏览器端代码获取资源

时间:2022-08-18 10:11:48浏览次数:50  
标签:浏览器 文件名 aLink 代码 导出 获取 href let document

如何获取本地国标文件

很少把自己的代码发上来,因为一方面都是旁门左道,不是真正能够独当一面的成果。另一方面只是一时使用,过了这个阶段或者环境变了就没法用了。这次贴上来主要是可能觉得有人会需要。

现在国标已经被整理可以全文检索和预览了。之前使用的技术方案是能够通过简单的前端客户端脚本直接进行下载文本版本的。后来可能这个工作外包给了其它公司,而这个公司不再提供文本版本下载,只能浏览,并且对资源进行和混淆。

这个代码能够通过浏览器,将混淆后的资源导出为正常可浏览的图片,以求能够在离线的情况下继续浏览阅读。

代码分为三个部分,需要分别运行

1、导出图片资源

2、导出页面资源

3、导出最终页面图片

其中第二步需要修改引用第一步下载图片资源的文件名,在MS edge中,aLink.download的指定没有生效,因此只能在运行第二部分代码之前修改文件名为浏览器下载图片时的文件名

第三步需要一个web服务器以解决页面资源访问许可的问题。另外,此部分代码中引用了domtoimage https://github.com/tsayen/dom-to-image ,在此致谢。

导出过程中有时因带宽或者服务器响应能力问题会遗漏部分资源,需要针对性重新下载。

最终我使用pdfill pdftools 将图片结果合并成pdf文件存档。

希望对各位有所帮助

//导出图片素材
$(".page").each((i,a)=>window.initImage(a.id))
let appurl=location.href.substr(0,location.href.lastIndexOf("/"));
let imgurlscode=$.unique($(".page>span").map((i,a)=>a.style.backgroundImage));
let imgurls=imgurlscode.map((i,a)=>appurl+"/"+a.substr(a.indexOf('"')+1,a.lastIndexOf('"')-a.indexOf('"')-1));
imgurls.each((i,a)=>{
    //if(i!=26)return;
let aLink = document.createElement('a')
aLink.download = 'imgs'+i+'.png' // 文件名后缀需要和dataurl表示的相同,否则可能乱码
aLink.href = a;
aLink.click();
});
//导出页面素材,注意修改图片素材名称
let imgurlslocal=imgurlscode.map((i,a)=>"GBT13923-2022_1191-1684-"+i+".png");//??此处填写下载的图片名称前缀
let bodystr=$(".pdfViewer")[0].outerHTML;
imgurlscode.each((i,a)=>bodystr=bodystr.replaceAll(a.replaceAll('"',"""),"url(""+imgurlslocal[i]+"")"));
let e="<html><head><script src=\"http://localhost:20080/test/domtoimage.min2.6.js\"></script>"+$("style")[1].outerHTML+"</head><body>"+bodystr+"</body></html>";
let aLink = document.createElement('a')
aLink.download = 'fileName_ele.html' // 文件名后缀需要和dataurl表示的相同,否则可能乱码
aLink.href = "data:image/jpeg;base64,"+window.btoa(e);
aLink.click();

  //导出图片结果          
        let pages=Array.from(document.querySelectorAll(".pdfViewer>.page")).reverse();
    function savetopng(ps){
        if(ps.length==0)return;
        let ele=ps.pop();
        const node = document.getElementById(ele.id);
        domtoimage.toPng(node).then(
            function(e){
                let aLink = document.createElement('a')
                aLink.download = 'fileName_'+ele.id+'.png' // 文件名后缀需要和dataurl表示的相同,否则可能乱码
                aLink.href = e
                aLink.click();
                savetopng(ps);
            }
        );
    }
    savetopng(pages);

 

标签:浏览器,文件名,aLink,代码,导出,获取,href,let,document
From: https://www.cnblogs.com/qinshoublog/p/16597742.html

相关文章

  • 针对`Code View`友好的代码重构方法
    针对CodeView友好的代码重构方法本文记录在开发过程中,写出对CodeReView友好代码的若干方法。抽取函数将较为独立的语句抽取为函数,是一种很常见的重构手段,本文在此基......
  • Unity中报不能启用不安全代码的错误
    今天下载了网上的一个Demo,打开的时候报了一个不能加载不安全代码的错误这个问题我以前遇见过,但太久不用一时间没想起来在哪里设置,这里记录一下打开unity的 编辑==>项......
  • 代码实现斐波那契数列
    #定义函数deffab(n):#判断n的有效性ifn<=0:return'传递的参数必须大于0的正整数'#当n为1时返回斐波那契数的第1个数0elifn==1:......
  • 代码考核
    实现数组的flat实现数组的flat方法,支持传入递归深度代码模板:constreadline=require('readline');constrl=readline.createInterface({input:process.std......
  • mysql时间相减获取秒数
    anstime_to_sec(timediff(endTime,startTime))timestampdiff(second,startTime,endTime)unix_timestamp(endTime)-unix_timestamp(startTime)tipsmysql的时间相......
  • 代码实现 打印九九乘法口诀
    #for循环,其中range(1,10)取1-9之间的整数,不会取到10#range(1,10)相当于数学中的[1,10),取值范围是前闭后开foriinrange(1,10):#for循环,取1到i的整数......
  • python 代码测试(pytest)
    前话代码测试用于检验代码运行结果是否符合预期。优势一:编写测试函数,更规范,高效的核对代码运行结果,当被测试对象进行了调整和重构的时候,可以节省大量人工排查问题的时间......
  • Unity 代码调用重新生成csproj文件
    结论先放结论:editor代码中直接调用Unity.CodeEditor.CodeEditor.CurrentEditor.SyncAll();原因在一些操作后,比如修改csc.rsp的内容之后,需要重新生成csproj文件方......
  • 谷粒商城(无CURD代码)
    GUIGU-GULIMALL项目:写在开头:这份笔记仅仅记录了一些环境搭建以及基础篇中一些技术的使用,基本的CURD大部分没有记录,参考了很多网友的博客。若有冒犯,请联系我删除。参考......
  • 前端请求不到数据_后端写代码直接复制_部分内容没有修改
    ......