目录
48.clientWidth offsetWidth, scrollWidth区别
50.事件event.pageX ,event.pageY,clientX,clienX
65. webpack 中的插件plugin与加载器loader的区别
84. HTTP 请求的方式,HEAD 方式与OPTIONS
87. 什么是 Bom? Bom 是浏览器对象。有哪些常用的 Bom 属性呢?
90.Doctype 作用?严格模式与混杂模式如何区分?它们有何意义?
101. sessionStore有哪些方法(3个)localStorage也具有这些方法
102. 使用axios的get请求请求/list.php 请求参数是 {name:"mumu",age:18}
103. 使用axios的post请求请求/login.php 请求参数是 {name:"mumu",age:18}
1.js的数据类型
基础数据类型、值类型
数据类型 |
typeof 值 |
举例 |
String字符串 |
string |
“abc”,'abc',`def` |
Number数组 |
number |
123,-12.5 |
Boolean布尔 |
boolean |
true,false |
undefined未定义 |
undefined |
undefined |
Symbol符号 |
symbol |
symbol |
null 空 |
object |
null |
复杂数据类型,引用类型
数据类型 |
typeof |
举例 |
Array数组 |
object |
|
Object对象 |
object |
{} |
function函数class类 |
function |
function(){} |
Map图 |
object |
new Map([[]]) |
Set集合 |
object |
new Set([]) |
weakMap,weakSet |
object |
|
Date,Math, |
object |
- 值类型与引用类型的区别
值类型 key和value都存储在栈中。
引用类型栈中存内存地址,真正值存储在堆中。
// 值类型 var a = 15; var b = a; b = 20; // b与相互不影响 |
一个引用类型堆中的值可以被多个变量引用,修改其中一个会影响到其它。
2.什么是闭包,闭包的应用场景,闭包的缺点
闭包就是函数嵌套函数,函数作为参数被传入,作为返回值被返回。
闭包作用:
- 形成局部作用域,
- 在函数外部可以访问函数内部的局部变量
闭包的缺点
被闭包引用的变量不会被js垃圾回收机制销毁,会常驻内存,使用不当容易造成内存崩溃
3.什么是原型,什么是原型链
每个构造函数(class)都有一个显示的原型prototype
每个实例实例对象都有个隐私原型__proto__
实例的隐式原型__proto__等于其构造函数的显示原型protype
当查找一个对象的属性或方法时先在实例上查找,找不这沿着__proto__向上逐级查找
我们把__proto__的__proto__形成的链条关系成为原型链
作用:1 原型链实现了js继承,2.原型可以给构造函数创建的实例添加公用方法
4.JS如果实现继承
- class使用extends关键字实现继承
- 通过原型链实现继承, ·
5. Call,apply的区别
call与apply都是执行一个函数,用第一个参数冒充函数的this
apply参数用的是数组形式
6. new关键字做了什么?
- 创建空对象
- call执行构造函数并传入空对象作为this
- 指定空对象的构造函数
7. 浅拷贝
- Object.assign(A,B)
- for in遍历拷贝
- {...A}对象扩展
8. 深拷贝
1.转字符串
2.递归
9. js检测对象类型
typeof :引用类型除function都返回 object
instance :是某个函数的实例,在原型链有该构造函返回ture
最准确:Object.prototype.toString.call(obj).slice(8,-1)
constructor, Array.isArray()
10. 事件流
冒泡流:事件由最具体的元素响应然后组件冒泡到最不具体的元素(html)
捕获流:从最不具体的元素捕获事件
开启捕获 addEventListenter第三个参数 true
阻止事件冒泡:e.stopPropagation()
11. 事件代理
把事件注册到多个元素共有的父元素上,通过事件的冒泡机制 响应事件
作用:动态添加的元素也可以响应事件
12. 数组去重
1.set去重
var arr2 = [...new Set(arr1)] |
2.filter过滤
var arr2 = arr1.filter((item,index)=>arr1.indexOf(item)===inmmdex) |
13. 异步和同步
同步是按顺序执行,会阻塞代码
异步非阻塞式执行代码
异步方法:回调函数,Promise,订阅发布模式,事件响应,aync和awiat
14. 手写ajax
ajax核心是通过XMLHttpRequest(xhr) 与服务器异步交换数据,实现前端刷新更新视图
15.Promise
Promise 实现异步操作,解决回调函数层级过多形成的回调地狱问题
Promise resolve与reject状态发送改变不能更改
Promise.reject()
Promise.all() 多个promise多完成才返回结果
Promise.race() 多个promise执行返回最快的一个
你在哪些地方用到promise
- 定义api请求接口
- 自定义jsonp用到
- 弹框插件等待用户确定则resolve
- 封装actions 用sync装饰 await实现异步
(等待,网络,等待用户确定的)(异步操作都会用到promise)
16. get与post区别
get 获取数据
post 新增,修改,删除
put 修改
delete 删除
get 有缓存的,可以收藏书签,方向,数据量2k
post 没有缓存,理论上没有大小限制
17. 什么是RESTful
RESTful是接口的设计风格
每一个URI地址都是一个资源
使用get获取,post新增,put修改,delete方法删除
18. 如何实现跨越
- jsonp
- 后端响应头允许
- 代理
无论哪种跨越都需要后端支持
19. jsonp原理
利用了script标签src没有同源限制。
后端返回的是方法名+()+数据格式 fun(data)
前端提前与定义这个方法就能获取数据
20 .什么是MVVM(前后端分离)
M:model 模式存储数据
V:view 显示内容(html)
VM viewModel视图模块 连接视图与model模型 (
)
当model数据发生变化时候通过VM可以监听变化更新视图
当view视图发变化时候通过VM可以监听变化自动更新model数据
21. 什么是MVC(前后不分离代码)
M 模型
v 视图
c 控制器
后端软件的设计思维:把视图V和模型M通过C控制实现分类
mvc(有利于SEO)
前端写好视图 交给后端 后端经过编程 生成 html 发送给浏览器(客户端)
mvvm(有利于开发))
后端写好接口,前端请求接口数据+定义视图 ,在浏览器(客户端)渲染html
22. Vue2 响应式原理,(双向绑定的原理)
通过Object.defineProperty劫持对象的getter与setter
通过订阅与发布者模式结合
er观察者来连接视图与数据
当数据发生变化时候通知说要订阅该数据的订阅者更新
23. Vue3响应式原理
ES6新增的 proxy代理实现的
vue3 与Vue2的区别
- 响应式原理不同:Object.defineProperty和Proxy
- 启动方式不用:
//vue2 new Vue({ store, router, render:h=>h(App) }).$mount("#app") |
// vue3 createApp(App).use(store).use(router).mount("#app") |
- 全局挂载方法
- Vue3 增加了setup 组合式api
24. v-if与v-show的区别
都可以隐藏节点
v-show通过css方式隐藏
v-if 直接移除dom节点
频繁切换显示与隐藏用v-show反之用v-if
25. computed与watch区别
computed有缓存,watch没有
conputed从现有数据计算出新的数据,watch是监听数据变化执行handler回调函数
computed 多对一,watch一对多
26. 生命周期
option选项api :创建前后,挂载前后,更新前后,销毁前后
setup中:没有创建前后
created 有this,发起ajax请求,监听事件,定时器
setup 没有this ,发起ajax请求,监听事件,定时器
mounted 可以操做dom
beforeDestroyed ||onUnmount 移除定时器,移除事件监听
27. 导航守卫
组件内部,路由独享,全局守卫
实现权限管理:
在路由配置定义meta权限
通过全局beforeEach实现路由守卫
beforeEach3个参数 to要去的页面,from从哪个页面来,next下一操作
28. $router,和$route区别
$route是当前页面路由信息,params,query,path,fullpath
$router使整个路由实例 通常带方法push,replace back forward go
29. 路由传参,子路由
params传参 query查询传参 hash传参 meta传参
子路由:在路由配置添加children
动态添加路由 ,router有个AddRoutes方法
30. 你封装过哪些组件(哪些插件)?
日期格式,防抖节流,瀑布流,弹框,提示,翻译。
设计好组件的data(尽量不使用data)
定义好props(多使用)
设计好方法
设计插槽和查找作用域
注意组件的传参
哪些工具
解析时间,格式时间,获取查询参数
清空数组,url转换(qs)html转文本
对象 合并,常见dom操作,防抖,节流
深拷贝
31. vuex 哪些组件
存储数据的state
修改数据唯一方式 mutations
异步操作的Actions
模块:module
映射方法:getters
32. 什么是vuex
vuex是vue的全局状态管理器,当state更新,引用state组件的视图会响应式更新。
本质上就是一个没有template的vue文件
通过vuex可以更好集中管理数据,多个组件共享数据
33. vuex和全局变量区别
都可以实现多个组件全局共享数据
vuex的数据是响应式,会自动更新视图
vuex的修改必须是mutations,更加利于调试
vuex还支持异步操作,方便vuex插件便于调试
34. vuex mutations和action区别
mutations用来改变数据(唯一方式)
actions执行异常操作
35. 哪些数据你都存储在vuex
当多个组件都需要使用的数据通常都存储在vuex里面
app信息: ,菜单栏信息,设备,运行模式
用户相关:token ,用户信息,权限信息,第三方登录信息
用户访问历史,操作日志
设置信息:主题,自定义菜单,标签
权限相关:路由,固定路由,菜单路由,
同时通过actions执行请求,mutations更新
36.axios封装哪些常用功能
基础配置:baseURL,timeout,headers
拦截响应与请求:加载提示,token和其他请求头,错误响应操作,添加或移除权限
37. 组件传参
父传子 props,
子传父$emit 事件
非父子关系:
ref获取引用
依赖注入:provide inject
vuex
vue2(选项options):event Bus传参;$parent父对象,$c0hilren子对象 $root根节点
38. nextTick作用(全局方法)
数据更新,等待视图更新执行的回调函数(dom操作常用)
39. vue2 有没有遇到数据更新视图不更新?
vue2 通过数组下标更新数据,视图不会更新
Vue.set(数据名,下标,数值)强制视图更新a
this.$set(数组名,key,value)
vue2 数组的双向绑定监听是通过重写数组的原型方法 pop,push ..
40. 在vue-for循环中为什么时候key
key为了让vue虚拟dom节点查找与更新更加优化(优化dom的渲染)
vdom 优化diff算法:
- 如果过key一致就不向下查找
- 如果tag不一致,子节点不查找
- 只在同级做比较
n3次方优化到n1次方
41. 什么是虚拟dom,优点
虚拟dom就是用js对象的形式去模拟dom节点
操作dom 重绘,回流,消耗页面性能
虚拟dom,操作js比操作dom要快,通过diff算法查找之前的vdom与现状vdom最小区别,通过patch更新到dom视图中
虚拟dom可以映射html,虚拟dom可以转换为ios的组件,转换为android组件(react-native)
前端通过编写js实现原生ios/Android 的效果(实现跨平台开发)
42. 箭头函数与普通函数的区别?
- 箭头函数this指向函数的上一层作用域的this
- 箭头函数不能作为构造函数,没有constructor
43. this指向问题
函数的this在函数执行的确定的
- 构造函数 new 函数名() this执行的 new出来对象的实例
- 箭头函数的this上一层作用域的this
- 对象中的this指向对象
- 事件响应函数的this指向 调用者
- setTimout setInterval 里面this指向window
- call,apply,bind 响应的函数this指向第一个参数
44. 变量提升
在js var 声明的变量会被提升到当前作用域的最前面 赋值为undefined
所有的函数也会被默认提升到当前作用域的最前面:函数可以先调用后声明
45. let 与var的区别
let 不会变量提升,var声明的变量会变量提升
let 不能重复声明 var可重复声明
const 声明必须赋值,值类型的值不能修改
46.小程序
小程序单位:rpx 750rpx宽度等于一屏的宽度
更新数据 this.setData()
全局数据 globalData:{xxx:"yyy"}
var app = getApp()
app.globalData.xxx
限制:页面栈5层,tab栏2-5,源文件包2M总20M,setData 1M 本地存储1次1M最大100M
跳转:navigateBack 移除一层 页面栈 navigate 添加一个层页面栈 redirect 替换一层栈,switchTab请空页面栈
分包与与加载:app.json 配置一下
npm: npm init 初始化 ,a'z'z'z'z'z'z'z'z'z'z'z'z'z'z'z'z'z'zazzzzzzzzzzzzzzzzzz i安装 , 构造npm
生命周期:小程序生命周期,页面的生命周,组件的生命周期
小程序:启动onLaunch 前台onShow 后台 onHide 错误 onError
页面:加载onLoad(options)onReady加载完毕 onShow显示 onHide后台运行 分享,下拉,滚动,触底,底部栏切换
组件的:attach 挂载 detach 卸载 move移动 。。。。
登录流程:wx.login 获取code 发给后端 后端通过appid appscecret 找微信服务器换取 sessionid与openid
获取用户信息:必须是用户才能使用api getUserInfo getUserProfile
云开发:了解没有用过
自定义底部栏,顶部导航。 配置
47.获取浏览器宽高
window.innerWidth wondow.innerHeight
document.documentElement.clientWidth
48.clientWidth offsetWidth, scrollWidth区别
clientWidth内容+padding宽
offsetWith 内容+padding+边框宽
scrollwidth 内容+滚动区域的宽
49.scrolleft offsetLeft
scrollLeft 滚动条滚动的距离
offsetLeft 当前元素与父元素(position非static)距离
50.事件event.pageX ,event.pageY,clientX,clienX
事件点击的位置
51. 手机端事件
touchStart touchMove touchE.nd
事件参数 event.currrentTouches[0]
52. 获取元素的边界
elem.getBoundingClientRect()
dom操作,距离计算(监听滚动,图片懒加载,瀑布流)
53. JQuery相关
jq源码阅读过:读过,没有全董
无new操作怎么实现
var vm = new Vue() //通过new关键字实现实例化 $("div") |
jquery的工厂函数与原型链重新指向
js对象转jq
用$函数包裹 $(js对象)
jq转js
下标获取,get方法获取
$(selector)[0]
$(selector).get(0)
window.onload 与 jQuery.ready() || $() 区别
onload 后面覆盖前面;$(function(){}) 可以执行多重
onload等于页面加载才执行;入口函数dom加载就执行
页面渲染过程
下载html 生成dom树
下载css生成css树
css树与dom树合并为渲染树
开始渲染页面,遇到js会有阻塞,
JQuery.常用方法
show hide fadeIn fadeOut toggle slideIn slideDown显示与隐藏
css() html() attr() props()text()val 属性和值
addClass toggleClass hasClass removeClass()类
animation() stop() 动画停止动画
$ajax,$.get $,post() .load() ajax方式
find chilren parent parents next sibings 查找节点
54.html5标签有哪些
article aisde section header footer main hgroup figure video audio
55. 行内标签 ,块标签,行内块
行内 a span i u code b strong sub sup em del
块 div,p,h1-h6,ul li dl dt dd ol
行内块 img iframe
表格:table thead tbody th tr td
表单 input textarea button
56.行内与块区别
行:水平排列 ,不可设宽高 可以设margin
块:垂直排列 可设宽高 不可以设margin
行块:水平 可设宽高 可以设置margin
都可以设置paddding
行内元素浮动自动化为块
57. 如果写个三角形
宽高为0 三边透明,一边显示
.san{ width:0; hegiht:0; display:block; border:10px solid transparent;" border-left-color:red; } |
58. css哪些属性可以继承
文字属性可以继承。a不继承,h标签页不继承粗细
59. css如何垂直居中
行内 :文字一行,高等于行高
行内块:一行,高等于行高,veticle-aligin:middle
块:
flex 弹性布局 aligin-items:center;
display:table-cell
定位的方式
60. css权重
选择器 * 0.5 标签 1 类10 id 100 import 最高
行内>内嵌>外链(离元素节点越近权限越高)
61. BFC
块级格式上下文
解决:父元素高度坍塌,margin加倍问题,实现自适应宽布局(bfc之间不会重叠)
62. px pt rem em rpx
px 像素
pt ios单位 通常 2倍屏(iphone 5,6,7,8) 1pt = 2px 3倍屏1pt = 3px(iphonex,iphone6 plus)
em 一个字符宽
rem 根节点一个字符宽
rpx 是小程序uni-app的宽 750= 一阁屏幕
vh 100vh = 1个屏幕的高
vw 100vw = 1个屏幕的宽
63. 清除浮动
解决的是父组件高度坍塌的问他
- oveflow:hidden开启bfc
- 设置高度
- 最后一子元素 宽100%,清除both
64. 定位区别
relative 相对定位 正常文档流 相对于自身的位置
absolute 绝对订定位 脱离文档流 相对于开启了position非static最近的父辈元素 ,
fixed 固定定位 脱离文档流 相对于浏览器可是窗口(不随滚动条滚动)
65. webpack 中的插件plugin与加载器loader的区别
loader用来处理非js文件的,插件在webpack运行生命周期中进行压缩,清理等工作
66. webpack有哪些优化方式
区分生产模式和开发模式
压缩优化css,压缩优化js,压缩图片,base64小文件减少请求
使用hash命名控制二次缓存
异步加载,懒加载,按需加载,摇树treeshake
67. webpack 切换环境,区分环境,跨平台传递参数
cross-env 插件跨平台传递参数,通过参数区分环境,切换环境。process.env这个参数
(axios的baseURL也是通过pross.evn区分环境的)
68.不用vue脚手架自己能搭建项目吗
能,原理是用webpack 搭建,写配置文件
vue-loader 处理.vue
vue-template-compiler 编译模板
69.webpack核心概念
入口:entery 从那开始进入打包 index.js/main.js
出口:文件输入的位置 output
plugin:插件 ,在webpack运行生命周期过程中进行打包清理,压缩等额外操作
loader:加载器处理非.js 文件的
mode:模式production development
tip:vue.config.js 其实就是webpack.config.js的vue版本(大部分可通用)
70.get 与post 请求
get缓存,post不缓存
get由于浏览器url现在只能2k,post没有理论上没有限制
get收藏书签与分享
get常用于向服务器获取数据,post常用于修改,增加删除数据
71.闭包
函数嵌套函数,函数作为参数被传入,函数作为返回值被返回
在函数外部修改函数内部的局部变量
创建局部作用域,避免变量的全局污染
72.如何解决异步
回调函数(出现回调地狱)
Promise
sync/await
生成器generator (函数前加个* yeild next)
订阅发布模式
73.如何实现继承
- extend 关键字 类实现继承
- 原型链继承
function Parent(){}
function Son(){
// 继承构造函数
Parent.call(this,参数)
}
// 继承原型
Son.prototype = Object.create(Parent.protype)
// 修正构造函数
Son.prototype.constructor= Son
74.事件流
冒泡流,先最具体元素到最不具体
捕获流,反之
addEventListener(事件类型,回调函数,是否捕获)
75.如何事件先冒泡后捕获
同一事件同时监听冒泡和捕获,分别对应处理函数
76.事件委托,代理
事件监听不直接放在触发的元素上面,而监听其共有的父元素上
通过事件冒泡和事件对象(event.target)判断具体元素
好处:可以对动态添加的子元素添加事件
77.图片懒加载与预加载
图片懒加载当用户不需要的时候先不加载图片
图片预加载:当网络有空闲先提前把可能需要的图片缓存到内存中
78.mouseover与mouserenter区别
over移入元或者子对象都会触发
enter移入本身才会触发
79.js的new操作符做了哪些事情
- 创建空的对象
- 通过call apply执行函数 并把空对象作为this传入
- 把空对象原型原型构造函数的prototype
80. 说一下 http 和 https
https 加密,http明文; https端口443 http端口80
81. tcp 三次握手,一句话概括
C代表客户端
S代表服务端
第一次握手:S 只可以确认 自己可以接受 C 发送的报文段
第 二次握手:C 可以确认 S 收到了自己发送的报文段,并且可以确认 自己可以接受 S 发 送的报文段
第三次握手:S 可以确认 C 收到了自己发送的报文段
82. TCP 和 UDP 的区别
1.)TCP 是面向连接的,udp 是无连接的即发送数据前不需要先建立链接。
2)TCP 提供可靠的服务。也就是说,通过 TCP 连接传送的数据,无差错,不丢失, 不重复,且按序到达;UDP 尽最大努力交付,即不保证可靠交付。
3)TCP 只能是 1 对 1 的,UDP 支持 1 对 1,1 对多。
83. webscoket
http 协议不支持持久性连接。 webscoket 是持续的长链接
webScoket常用于聊天,消息主动推送
84. HTTP 请求的方式,HEAD 方式与OPTIONS
HEAD 只发送请求头,不发送请求体
options:允许客户端查看服务器的性能,比如说服务器支持的请求方式等等。
85. 一个图片 url 访问后直接下载怎样实现?
1. 域名解析ip
2. 发送请求头
3. 服务器应答响应头和响应体(图片内容)
4. 客户端渲染图片
86. web Quality(无障碍)
能够被残障人士使用的网站才能称得上一个易用的(易访问的)网站。
如:设置img的alt属性 图片提示(通过语音也知道图片是什么)
87. 什么是 Bom? Bom 是浏览器对象。有哪些常用的 Bom 属性呢?
location 地址信息
location.href 地址
location.reload() 刷新
location.replace() 跳转
history 历史记录
history.go() 跳转
history.back() 后退
history.foward()前进
window.navigator.userAgent 浏览器的标识
88. 说一下 http2.0
提升访问速度;允许多路复用;二进制分帧(更快乐,同时容量更大了,可分割更小了)
89. iframe 是什么?有什么缺点?
行内框架,在网页中可以嵌入另外一个网页
缺点:阻塞onload加载事件,不利seo(搜索引擎优化)(你的网站在百度可以被人更快搜索到)
解决方法:使用js动态添加iframe 设置src
90.Doctype 作用?严格模式与混杂模式如何区分?它们有何意义?
Doctype 告诉浏览器你什么模式渲染页面;严格按浏览器最新标准;混杂兼容渲染
91.Cookie 如何防范 XSS 攻击
xss攻击用户使用非法javascript与网站交互实现非法的目的
后端:httponly 防止js访问cookie ,secure让https才发生cookie
92.Cookie 和 session 的区别
cookie 浏览器与服务器交互的重要手段;cookie存储在浏览器端一小段数据
http请求与响应都会携带cookie;cookie可以被后端设置;也可以被前端设置
session是存储在服务器的当前用户的唯一标识符(安全)
通常以cookie形式存储sessionid 告诉前端当前用户的状态
93.一句话概括 RESTFUL
就是用 URL 定位资源,用 HTTP 描述操作
是前后端交互风格开发方式,URL 定位资源,http请求时候用put添加 delete删除 post修改 get获取 等方法与服务器交互
94.什么是ajax?
全称:异步的javascript和xml
核心:xhr:XMLHttpRequest
作用:无刷新更新页面的数据(视图)
原理: 客户端 通过xhr与服务器交换数据,客户端用javascript来操作dom渲染更新数据
95.什么是浏览器同源策略?
https://pan.baidu.com:8080/list?name=mumu&age=18#good
https 协议
pan子域名
baidu.com 域名
:8080 端口号
/list 路径 ?name=mumu&age=18 查询参数 #good 哈希值
同源策略(安全策略):客户端向服务器请求数据的时候,要求客户端请求的html与服务器请求的地址要
协议一致,域名一致,子域名一致,端口号一致。
96.什么是跨域,跨域的常见方式有哪些?
跨域是绕过浏览器的同源策略(跨域名)向服务器请求数据
- CORS 服务器响应头允许:Access-Control-Allow-Origin: *
- jsonp技术(天气案例)
- 代理请求
97.jsonp的原理是?
利用的script的src属性没有同源策略的限制
Vue中路由相关的组件是?
<router-view> 存放路由页面
<router-link> 切换路由
路由配置
{ path:"/about" ,
name:"about",
component:About
}
路由传参
{path:"/produce/:id",name:"produce",component:Produce}
{$route.params.id}
路由方法
$router.go
.back()
.forward前进
.push() 添加
replace()替换
98.$router 有哪些方法 (5个)
go(num)跳转
back()返回
forward()前进
push()添加历史记录(跳转)
replace()替换
99. 写一个produce带参数路由配置
{ name:"produce",path:"/produce/:id",component:Produce }
在页面中获取参数$route.params.id
100. 导航组件内部守卫
进入前,更新前,离开前
beforeRouteEnter(to,from,next)
beforeRouteUpdate()
beforeRouteLeave()
101. sessionStore有哪些方法(3个)localStorage也具有这些方法
setItem(key,value) 设置数据
getItem(key) 获取key数据
removeItem(key) 移除key数据
clear()清空
102. 使用axios的get请求请求/list.php 请求参数是 {name:"mumu",age:18}
并在控制台输出请求内容(2种get方法)
axios.get("list.php?name=mumu&age=18").then(res=>'').catch(err=>'')
axios.get("list.php",{params:{name:"mumu",age:18}}).then().catch()
axios({url:"/list.php",method:"get",params:{name:"mumu",age:18}}).then().catch()
axios({url:"/list.php?name=mumu&age=18",method:'get'}).then().catch()
103. 使用axios的post请求请求/login.php 请求参数是 {name:"mumu",age:18}
并在控制台输出请求内容(2种post方法)
axios.post("/login.php","name=mumu&age=18",{headers:{'Content-Type':'application/x-www-form-urlencoded'}}).then().catch()
根据接口要求
axios.post("/login.php",{name:"mumu",age:18},{headers:{'Content-Type':'application/json'}}).then().catch()
post默认就是json格式可以省略
axios.post("/login.php",{name:"mumu",age:18}).then().catch()
axios({
url:"login.php",
method:"post",
data:"name=mumu&age=18"},
headers:{"Content-Type":"application/x-www-form-urlencoded"})
.then().catch()
104. 什么是浏览器的同源策略?
客户端向服务器请求数据,
t'r要求客户端的网址与服务器是同源
协议,端口,子域名,域名一致
105. 跨域的方式有哪些?
jsonp
CORS 响应头允许(后端允许)
服务器代理
106. jsonp的原理有哪些?(script)
利用的script的src属性没有同源策略的限制
返回的数据调用函数+数据参数形式 fn({name:"mumu",age:"18"})
function fn( data){ console.log(data,'后端返回的数据data')}
107. 如何全局挂载axios
import axios from ‘axios’
axios.default.baseURl="/" 默认请求域名
axios.default.timeout=3000 请求超时配置
axios.dafault.headers.post["content-type"]="application/x-www-form-urlencoded"
const app = createApp(App)
app.config.globalProperties.$http = axios;