事因:

  我所维护的项目为旧项目,接手项目后并没有什么开发文档留下,导致很多时候一出现问题就需要自己去研究整个过程。

项目中一直使用一个"$.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组件丢失后,应如何维护开发之启发的更多相关文章

  1. 记录下项目中常用到的JavaScript/JQuery代码二(大量实例)

    记录下项目中常用到的JavaScript/JQuery代码一(大量实例) 1.input输入框监听变化 <input type="text" style="widt ...

  2. Springboot项目中 前端展示本地图片

    Springboot项目中 前端展示本地图片 本文使用的是Springboot官方推荐的thymeleaf(一种页面模板技术) 首先在pom文件加依赖 <dependency> <g ...

  3. 项目中常用js方法整理common.js

    抽空把项目中常用js方法整理成了common.js,都是网上搜集而来的,大家一起分享吧. var h = {}; h.get = function (url, data, ok, error) { $ ...

  4. 前端js的书写规范和高效维护的方案_自我总结使用的方案

    作为程序员,人生最值得幸福的事有几件: 解决困扰了很长时间的问题 升职加薪 找个漂亮又靠谱的对象 深得领导的喜欢 带领团队冲锋陷阵 ... 哈哈,这些都是梦想,暂时想想就好了.这肯定和我说的东西不符合 ...

  5. .Net Core ORM选择之路,哪个才适合你 通用查询类封装之Mongodb篇 Snowflake(雪花算法)的JavaScript实现 【开发记录】如何在B/S项目中使用中国天气的实时天气功能 【开发记录】微信小游戏开发入门——俄罗斯方块

    .Net Core ORM选择之路,哪个才适合你   因为老板的一句话公司项目需要迁移到.Net Core ,但是以前同事用的ORM不支持.Net Core 开发过程也遇到了各种坑,插入条数多了也特别 ...

  6. WebGIS中前端JS生成等值面方法探讨

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.背景 在之前的博文<WebGIS中等值面展示的相关方案简析&g ...

  7. 转 mvc项目中,解决引用jquery文件后智能提示失效的办法

    mvc项目中,解决用Url.Content方法引用jquery文件后智能提示失效的办法   这个标题不知道要怎么写才好, 但是希望文章的内容对大家有帮助. 场景如下: 我们在用开发开发程序的时候,经常 ...

  8. 项目中调用ExcelCom组件时的配置流程

    异常提示如下:         Microsoft Office Excel 不能访问文件“*.xls”. 可能的原因有:        1 文件名称或路径不存在.       2 文件正被其他程序使 ...

  9. VS项目中使用Nuget还原包后编译生产还一直报错?

    Nuget官网下载Nuget项目包的命令地址:https://www.nuget.org/packages 今天就遇到一个比较奇葩的问题,折腾了很久终于搞定了: 问题是这样的:我的解决方案原本是好好的 ...

随机推荐

  1. Spring cloud服务的提供者建立

    1.0我们要在这里要建立一个服务的提供者模块,是一个module,类似于服务的公共模块 第一步:添加架包 <project xmlns="http://maven.apache.org ...

  2. 找到多个与名为“HOME”的控制器匹配的类型。如果为此请求(“{CONTROLLER}/{ACTION}/{ID}”)提供服务的路由在搜索匹配此请求的控制器时没有指定命名空间,则会发生此情况。如果是这样,请通过调用含有“NAMESPACES”参数的“MAPROUTE”方法的重载来注册此路由。

    public static void RegisterRoutes(RouteCollection routes) { routes.IgnoreRoute("{resource}.axd/ ...

  3. 这份接口管理平台 eoLinker 开源版的部署指南教程你一定不想错过

    本文主要内容是讲解如何在本地部署eoLinker开源版. 环境要求 1.PHP 5.5+ / PHP7+(推荐) 2.Mysql 5.5+ / Mariadb 5.5+ 3.Nginx(推荐) / A ...

  4. 我的第一个 Windows 窗口程序(1)

    一般来说,构建一个 Windows 程序可以分为如下几个步骤: 定义窗口类(WNDCLASS) 注册窗口类(RegisterClass) 创建窗口(CreateWindow) 更新显示窗口(Updat ...

  5. N1-1 - 树 - Minimum Depth of Binary Tree

    题目描述: Given a binary tree, find its minimum depth.The minimum depth is the number of nodes along the ...

  6. luogu 3768 简单的数学题 (莫比乌斯反演+杜教筛)

    题目大意:略 洛谷传送门 杜教筛入门题? 以下都是常规套路的变形,不再过多解释 $\sum\limits_{i=1}^{N}\sum\limits_{j=1}^{N}ijgcd(i,j)$ $\sum ...

  7. [poj 3318] Matrix Multiplication (随机化+矩阵)

    Description You are given three n × n matrices A, B and C. Does the equation A × B = C hold true? In ...

  8. 在 vue-test-utils 中 mock 全局对象

    vue-test-utils 提供了一种 mock 掉 Vue.prototype 的简单方式,不但对测试用例适用,也可以为所有测试设置默认的 mock. mocks 加载选项 mocks 加载选项 ...

  9. 【CodeForces 271D】Good Substrings

    [链接] 我是链接,点我呀:) [题意] [题解] 字典树 我们可以两重循环(i,j) 来枚举所有的子串 即i=1,j=1,2,3... i=2,j = 2,3,4,.. 于是我们在i变化的时候(就是 ...

  10. 【hiho一下 第四周】Trie图

    [题目链接]:http://hihocoder.com/problemset/problem/1036?sid=1092555 [题意] [题解] AC自动机的模板题; 在求有没有子串的时候; 注意要 ...