formdata | 易学教程

Django之AJAX简介

阅读更多关于 Django之AJAX简介

目录 AJAX简介 AJAX基本语法结构前后端交互的数据编码格式 form表单 ajax提交后端怎么拿json数据？我们自己怎么拿？ AJAX发送文件自动序列化分页器运用 CV大法 AJAX简介 AJAX（Asynchronous Javascript And XML）翻译成中文就是“异步的Javascript和XML”。即使用Javascript语言与服务器进行异步交互，传输的数据为XML（当然，传输的数据不只是XML）。 AJAX 不是新的编程语言，而是一种使用现有标准的新方法。其实就是基于js写的一个功能模块而已由于原生js书写ajax较为繁琐所以我们直接学jQuery封装号的ajax模块操作 AJAX 最大的优点是：异步提交，局部刷新在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。（这一特点给用户的感受是在不知不觉中完成请求和响应过程） AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行。同步交互：任务提交之后原地等待任务的返回结果进程表现上来说阻塞异步交互：任务提交之后不需要原地等待返回结果直接执行下一行代码进程表现上来说非阻塞任务的结果通过异步回调机制 callback() 案例：用户名在时时和后端交互，但是页面没有刷新。用户体验更好前端与后端的交互方式有： 1

element-文件上传-自定义上传方式

阅读更多关于 element-文件上传-自定义上传方式

element-文件上传-自定义上传方式这次主要写的是el-upload这个组件中的http-request钩子，首先来看一下官方的：非常的简洁，简洁到完全看不懂了，简直了。先展示一下我的成果，记得先把jquery，vue，element引入这里实现了上传成功的回调和进度条的显示。失败的回调可以参考成功回调的方式写，差不多我就没写了。 var el_my_uploader = Vue . extend ( { props : [ "maxSize" , "maxCount" , "fileList" , "UploadUrl" , "accept" , "drag" , "multiple" ] , template : '<div >' + '<el-upload :action="UploadUrl" :limit="maxCount" :on-exceed="handleExceed" ' + ' :before-upload="beforeUpload" :file-list="uploadFiles" :accept="accept" ' + ' :on-preview="handlePreview" ' + ' :before-remove="beforeRemove" :drag="drag" :multiple="multiple"' + ' :on

vue、koa 导入导出excel文件

阅读更多关于 vue、koa 导入导出excel文件

一、使用node-xlsx、koa-multer插件　　 npm install node-xlsx koa-multer mockjs --save 二、excel 文件导出　　 1、前端请求数据，通过blob（Blob对象可以看做是存放二进制数据的容器）解析数据，下载对应的文件 1 exportExcel(e){ 2 axios({ 3 method : "get", 4 url : "/api/exportexcel", 5 responseType: 'blob' 6 }).then(async (res) => { 7 let uploadExcel = (fileName) => { 8 const blob = new Blob([res], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'}); 9 const url = URL.createObjectURL(blob); 10 const aLink = document.createElement('a'); 11 aLink.setAttribute('download',fileName); 12 aLink.setAttribute('href',url); 13

上传文件的方法

阅读更多关于上传文件的方法

一、原生js HTML部分 <input type="file" id="upload-file" name="myfile" /> JS部分 var xhr; var fileObj = document.getElementById("upload-file").files[0]; var url = "地址"; var form = new FormData(); form.append("file",fileObj); form.append("groupId",$(groupId).val()); //添加其他参数 form.append("seriesId",$(seriesId).val()); xhr = new XMLHttpRequest(); xhr.open('post',url,true); xhr.onload = "请求完成的方法"; xhr.onerror = "请求失败的方法"; xhr.send(form); 二、jquery方法 HTML部分 <form action="" id="upload" enctype="multipart/form-data" method="post"> <input type="file" name="file" id="upload-file"/> </form> JS部分 var form =

【Ajax基础】（2）

阅读更多关于【Ajax基础】（2）

1. Ajax异步编程 1.1 同步异步概述 1.1.1 同步一个人同一时间只能做一件事，只有一件事情做完，才能做另外一件事。 1.1.2 异步一个人一件事情做了一半，转而去做别的事情，当其他事情做完以后，再回过头来继续做之前未完成的事情落实到代码上，就是异步代码虽然需要花费时间去执行，但程序不会等待异步代码执行完成后再继续执行后续代码，而是直接执行后续代码，当后续代码执行完成后再回头看异步代码是否返回结果，如果已有返回结果，再调用事先准备好的回调函数处理异步代码执行的结果 1.2 Ajax封装问题：发送一次请求代码过多，发送多次请求代码冗余且重复结果方案：将请求代码封装到函数中，发请求时调用函数即可 2.FormData 2.1 FormData对象的作用 1.模拟成HTML表单，相当于将HTML表单映射成表单对象，自动将表单对象中的数据拼接成请求参数的格式 2.异步上传二进制文件 2.2 FormData对象的使用 1.准备HTML表单 2. 将HTML表单转化为formdata对象 3.提交表单对象 2.3 FormData对象的实例方法 1. 获取表单中对象中属性的值 2.设置表单对象中属性的值注意：如果设置的表单属性存在，将会覆盖属性原有的值。如果设置的表单属性不存在，将会创建这个表单属性 3.删除表单对象中属性的值 4.向表单对象中追加属性值 2.4

实例：模拟登陆豆瓣

阅读更多关于实例：模拟登陆豆瓣

# -*- coding: utf-8 -*- import scrapy import urllib.request # https://accounts.douban.com/login class DoubanSpider(scrapy.Spider): 　　name = 'douban' 　　allowed_domains = ['www.douban.com', 'accounts.douban.com'] 　　start_urls = ['https://accounts.douban.com/login'] 　　def parse(self, response): 　　　# 查找验证码图片，看有没有验证码　　　image = response.xpath('//img[@id="captcha_image"]/@src') 　　　# 判断image这个列表是否为空，如果为空，就是没有验证码　　　if len(image) == 0: 　　　　print('不带验证码的' * 10) 　　　　# 不带验证码的　　　　formdata = { 　　　　'source': 'index_nav', 　　　　'form_email': '1090509990@qq.com', 　　　　'form_password': 'lizhibin666', 　　　　} 　　

Ajax实现附件上传

阅读更多关于 Ajax实现附件上传

前两篇文章有介绍使用form.submit 实现附件的上传，但是这种方式使用起来很不方便，如过需要再上传成功以后执行一些其他的操作的时候比较麻烦。下面我为大家介绍下使用ajax实现附件上传的功能： 1.使用FormData对象上传附件： <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script> <title></title> </head> <body> 文件:<input id="file" type="file" name="file"/> <button id="upload">上传文件</button> </body> <script type="text/javascript"> $(function () { $("#upload").click(function () { var formData = new FormData(); data.append("file", $("#file")[0].files[0]); $.ajax({ type: 'post', url: "XXX", data: formData, cache: false,

关于 FormData 和 URLSearchParams

阅读更多关于关于 FormData 和 URLSearchParams

一、FormData 　　FormData 接口提供了一种表示表单数据的键值对的构造方式，经过它的数据可以使用 XMLHttpRequest.send() 方法送出，本接口和此方法都相当简单直接。如果送出时的编码类型被设为 "multipart/form-data" ，它会使用和表单一样的格式。如果你想构建一个简单的 GET 请求，并且通过 <form> 的形式带有查询参数，可以将它直接传递给 URLSearchParams 。实现了 FormData 接口的对象可以直接在 for...of 结构中使用二， URLSearchParams 　　URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串。一个实现了 URLSearchParams 的对象可以直接用在 for...of 结构中　　 1 var url = '?q=URLUtils.searchParams&topic=api'; 2 var searchParams = new URLSearchParams(paramsString); 3 for (let p of searchParams) { 4 console.log(p); 5 } 6 7 searchParams.has("topic") === true; // true 8 searchParams.get(

拉勾网爬取全国python职位并数据分析薪资，工作经验，学历等信息

阅读更多关于拉勾网爬取全国python职位并数据分析薪资，工作经验，学历等信息

首先前往拉勾网“爬虫”职位相关页面确定网页的加载方式是JavaScript加载通过谷歌浏览器开发者工具分析和寻找网页的真实请求，确定真实数据在position.Ajax开头的链接里，请求方式是POST 使用requests的post方法获取数据，发现并没有返回想要的数据，说明需要加上headers和每隔多长时间爬取我们可以看到拉勾网列表页的信息一般js加载的都在xhr和js中，通过发送ajax加载POST请求，获取页面信息。这个是ajax的头信息，通过Form Data中的的信息获取页面下面是scrapy爬虫的代码部分 1 import scrapy 2 import json 3 from lagou.items import LagouItem 4 class LagoupositionSpider(scrapy.Spider): 5 name = 'lagouposition' 6 allowed_domains = ['lagou.com'] 7 kd = input('请输入你要搜索的职位信息:') 8 ct =input('请输入要搜索的城市信息') 9 page=1 10 start_urls = ["https://www.lagou.com/jobs/list_"+str(kd)+"&city="+str(ct)] 11 headers={"User

nodejs之get/post请求的几种方式

阅读更多关于 nodejs之get/post请求的几种方式

最近一段时间在学习前端向服务器发送数据和请求数据,下面总结了一下向服务器发送请求用get和post的几种不同请求方式： 1.用form表单的方法: (1)get方法前端代码: <form action = "/login" method = "GET"> <label for = "username">账号：</label> <input type = "text" name ="username" placeholder = "请输入账号" required> <br> <label for = "password">密码：</label> <input type = "password" name = "password" placeholder = "请输入密码" required> <br> <input type = "submit" value = "登陆"> </form> 服务器代码: 用get方法首先要配置json文件，在command中输入命令npm-init ，然后要安装所需要的express模块，还需要在文件夹里面创建一个放置静态资源的文件夹(wwwroot)，然后代码如下： var express = require('express'); // 引入模块 var web = express(); // 使用模块创建一个web应用 web.use

订阅 formdata