前后端通信
关注
分享
扫一扫
文章平均质量分 65
ajax、fetch、axios
我在人间贩卖青春
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
轮询与长轮询
轮询与长轮询原创 2022-11-20 22:43:42 · 210 阅读 · 0 评论 -
服务器推送数据之websocket、socket.io及实现简易聊天系统
服务器推送数据之websocket、socket.io及实现简易聊天系统原创 2022-11-20 23:50:16 · 1040 阅读 · 0 评论 -
服务器推送数据之SSE (server send event)
服务器推送数据之SSE (server send event)原创 2022-11-20 23:05:42 · 1627 阅读 · 0 评论 -
axios前后端交互
今天有点儿累了，由于工作失误，导致今晚不开心，今天不想写了… …npm官网的axiosGitHub的axiosaxios的基本用法get请求用法// 请求一个给定的用户IDaxios.get('/user?ID=12345') .then(function (response) { // 请求处理结果 console.log(response); }) .catch(function (error) { // 请求处理错误 console.log(原创 2020-12-23 23:31:45 · 688 阅读 · 0 评论 -
fetch方法前后端交互
fetchfetch也是一种HTTP数据请求的方式，是XMLHttpRequest的一种替代方案。fetch是原生js封装而成，并不是不是原生ajax的进一步封装，没有使用XMLHttpRequest对象。fetch当下并不能完全取代XMLHttpRequest对象，也就是不能完全取代ajax。存在问题(与 XMLHttpRequest 的差异)1、兼容性不是很广泛2、没有upload对象的progress进度监控3、默认不会携带cookie基本用法fetch("/test").原创 2020-12-23 23:00:04 · 484 阅读 · 0 评论 -
跨域之代理服务
代理服务跨域解决方法一（jsonp）跨域解决方法二（CORS）跨域是浏览器规范，通过同服务器请求数据，不通过浏览器请求，也能解决浏览器限制；代理服务转发请求利用http模块实现简单的服务器转发利用 koa-server-http-proxy中间件实现代理http模块实现代理node.js既可以做客户端也可以做服务端利用这个特性，可以再提供一个代理服务，去访问其他的服务器如果不满足静态代理，那么就执行代理服务const Koa = require('koa');const ht原创 2020-12-22 23:39:59 · 469 阅读 · 1 评论 -
跨域之CORS
跨域解决方法二跨域解决方法一（jsonp）CORS(Cross-origin resource sharing)，跨域资源共享，是一份浏览器技术的规范，用来避开浏览器的同源策略。它是W3C的标准，是AJAX请求的根本解决方法。CORS跨域设置解决跨域设置node.js服务环境，需要在服务端设置ctx.set('Access-Control-Allow-Origin', '*'); //允许任意域名都可以访问，默认不能携带cookie。ctx.set('Access-Control-原创 2020-12-22 23:16:12 · 230 阅读 · 0 评论 -
跨域之jsonp（原生js封装jsonp）
浏览器同源策略同源策略是浏览器的一个安全功能，不同源的客户端脚本在没有明确授权的情况下，不能读写对方资源。源 ：协议、域名和端口号同源： 相同的协议，相同的域名，相同的端口跨域当请求url与的协议、域名、端口三者之间任意一个与当前页面url不同，即为跨域。跨域造成的问题：无法向非同源地址发送ajax请求；无法接触非同源网页的DOM；无法读取非同源网页的cookie、localStorage、IndexDB跨域解决 方法一jsonp原理<script src="原创 2020-12-22 22:23:09 · 288 阅读 · 0 评论 -
原生js封装ajax
调用ajaxajax({ method: 'post', url: '/upload', data, success(data) { // console.log('data', data); data = JSON.parse(data); }, onprogress(ev) { // console.log('ev',ev); progressElement.style.width = (e原创 2020-12-22 16:53:37 · 206 阅读 · 0 评论 -
ajax之上传文件显示实时上传进度、速度
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <input ty.原创 2020-12-22 16:40:36 · 709 阅读 · 1 评论 -
ajax的基本使用
ajax是异步javaScript和xml的简称。即AJAX = Asynchronous JavaScript and XML。无需刷新页面的情况下前后端交互传输数据。ajax的基本使用get请求<button>点击发送ajax</button>document.querySelector("button").onclick = function(){ //新建XMLHttpRequest对象； let xhr = new XMLHttpRequest();.原创 2020-12-22 16:10:57 · 101 阅读 · 0 评论