【工作细节记录】维护项目中前端JS组件丢失后,应如何维护开发之启发
事因:
我所维护的项目为旧项目,接手项目后并没有什么开发文档留下,导致很多时候一出现问题就需要自己去研究整个过程。
项目中一直使用一个"$.download()"的方法进行文件下载。后续出现很奇怪的情况,我将原本项目的js都引用到新的项目中去,
可是在我的环境中无法成功执行,在另一位同事的环境下却可以正常执行。(若看到此文章的大神能提供一些比较好的解决
方式给我亦可以留言,十分感谢!)
小白之一些维护开发想法:
倘若原本的方法,作为一个开发者的你,并不了解究竟有多少处使用。很多开发者都会自己重写这个方法支持原本调用。
考虑到现在的项目仅几处使用。均改使用form提交,实现下载功能。
以下转载 :https://www.cnblogs.com/hamsterPP/p/6763458.html
实现过程:
已知一个下载文件的后端接口,前端如何请求该接口,实现点击按钮、下载文件到本地。
【体验非常不好】方法一:window.open("下载文件的后端接口");
*html结构*
<button type="button" id="btn1">下载一个zip(方法1)</button>
<button type="button" id="btn2">下载一个zip(方法2)</button>
/*js部分*/
var $eleBtn1 = $("#btn1");
var $eleBtn2 = $("#btn2"); //已知一个下载文件的后端接口:https://codeload.github.com/douban/douban-client/legacy.zip/master
//方法一:window.open()
$eleBtn1.click(function(){
window.open("https://codeload.github.com/douban/douban-client/legacy.zip/master");
});
然而有个问题:浏览器会打开一个新窗口,然后迅速自动关闭,体验非常不好。
方法二:通过form提交
由于ajax函数的返回类型只有xml、text、json、html等类型,没有“流”类型,所以通过ajax去请求该接口是无法下载文件的,所以我们创建一个新的form元素来请求接口。
/*js部分*/
//方法二:通过form
$eleBtn2.click(function(){
var $eleForm = $("<form method='get'></form>"); $eleForm.attr("action","https://codeload.github.com/douban/douban-client/legacy.zip/master"); $(document.body).append($eleForm); //提交表单,实现下载
$eleForm.submit();
});
【工作细节记录】维护项目中前端JS组件丢失后,应如何维护开发之启发的更多相关文章
- 记录下项目中常用到的JavaScript/JQuery代码二(大量实例)
记录下项目中常用到的JavaScript/JQuery代码一(大量实例) 1.input输入框监听变化 <input type="text" style="widt ...
- Springboot项目中 前端展示本地图片
Springboot项目中 前端展示本地图片 本文使用的是Springboot官方推荐的thymeleaf(一种页面模板技术) 首先在pom文件加依赖 <dependency> <g ...
- 项目中常用js方法整理common.js
抽空把项目中常用js方法整理成了common.js,都是网上搜集而来的,大家一起分享吧. var h = {}; h.get = function (url, data, ok, error) { $ ...
- 前端js的书写规范和高效维护的方案_自我总结使用的方案
作为程序员,人生最值得幸福的事有几件: 解决困扰了很长时间的问题 升职加薪 找个漂亮又靠谱的对象 深得领导的喜欢 带领团队冲锋陷阵 ... 哈哈,这些都是梦想,暂时想想就好了.这肯定和我说的东西不符合 ...
- .Net Core ORM选择之路,哪个才适合你 通用查询类封装之Mongodb篇 Snowflake(雪花算法)的JavaScript实现 【开发记录】如何在B/S项目中使用中国天气的实时天气功能 【开发记录】微信小游戏开发入门——俄罗斯方块
.Net Core ORM选择之路,哪个才适合你 因为老板的一句话公司项目需要迁移到.Net Core ,但是以前同事用的ORM不支持.Net Core 开发过程也遇到了各种坑,插入条数多了也特别 ...
- WebGIS中前端JS生成等值面方法探讨
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.背景 在之前的博文<WebGIS中等值面展示的相关方案简析&g ...
- 转 mvc项目中,解决引用jquery文件后智能提示失效的办法
mvc项目中,解决用Url.Content方法引用jquery文件后智能提示失效的办法 这个标题不知道要怎么写才好, 但是希望文章的内容对大家有帮助. 场景如下: 我们在用开发开发程序的时候,经常 ...
- 项目中调用ExcelCom组件时的配置流程
异常提示如下: Microsoft Office Excel 不能访问文件“*.xls”. 可能的原因有: 1 文件名称或路径不存在. 2 文件正被其他程序使 ...
- VS项目中使用Nuget还原包后编译生产还一直报错?
Nuget官网下载Nuget项目包的命令地址:https://www.nuget.org/packages 今天就遇到一个比较奇葩的问题,折腾了很久终于搞定了: 问题是这样的:我的解决方案原本是好好的 ...
随机推荐
- mysql组复制集群简介
mysql组复制集群拓扑: 环境: centos6.5 mysql5.7.19 一.组复制搭建: 配置hosts文件 再三台服务器上分别启动一个mysql实例,共三个. 参考配置文件如下: serve ...
- 高手的C++学习忠告,虚心学习下~~[转载]
1.把C++当成一门新的语言学习(和C没啥关系!真的.): 2.看<Thinking In C++>,不要看<C++变成死相>: 3.看<The C++ Programm ...
- Django的时间字段DateTimeField
一. Django的时间字段DateTimeField 创建django的model时,有DateTimeField.DateField和TimeField三种类型可以用来创建日期字段,其值分别对应着 ...
- class一些内置方法
一. __getattribute__ class Foo: def __init__(self,x): self.x=x def __getattr__(self, item): print('执行 ...
- 自动化测试之firebug、firepath、IDE的使用
1firebug安装-firefox添加组件-firebug 如图 firepath依赖于firebug 展示路径用,安装和firebug一样
- Project Euler 26 Reciprocal cycles( 分数循环节 )
题意: 单位分数指分子为1的分数.分母为2至10的单位分数的十进制表示如下所示: 1/2 = 0.5 1/3 = 0.(3) 1/4 = 0.25 1/5 = 0.2 1/6 = 0.1(6 ...
- vue 动态获取div宽高有时候为0的情况
项目背景: 需要使用echarts进行图表展示.由于div宽高是不固定的,因此需要先获取父级的宽高再把值赋予到图表的div中. 需要使用 this.$nextTick(() => { }) ...
- OOP面向对象 三大特征 继承封装多态
OOP面向对象 ----三大特征 继承封装多态 面向对象(Object Oriented,OO)是软件开发方法.面向对象的概念和应用已超越了程序设计和软件开发,扩展到如数据库系统.交互式界面.应用结构 ...
- IP协议解读(三)
今天我们来介绍网络层中的ICMP协议 ICMP报文格式 图一: 从图片上我们能够分析出.前三位的字段都是固定的.8位类型字段,8位代码字段.16位校验和字段.其它字段因ICMP报文类型不同而不同.8位 ...
- 回车登录(支持IE 和 火狐等浏览器)
$("body").keydown(function(e){ var curKey = e.which; if(curKey == 13){ $("#Btn_login& ...