前后端调用

目录

编辑前端页面

编辑后端页面

1.   AXIOS-GET

1.1 参数拼接写法

1.2   AXIOS--Post请求

 1.3  put请求测试

1.4 传递对象的写法

1.5  restFul结构实现数据传参

 1.6   简化Axios调用

 1.7   关于跨域

1.7.1   同源策略

1.7.2  什么是跨域

1.7.3  例题

---

编辑前端页面

编辑后端页面

1.   AXIOS-GET

1.1 参数拼接写法

1.2   AXIOS--Post请求

 

 1.3  put请求测试

 

1.4 传递对象的写法

1.5  restFul结构实现数据传参

 

 1.6   简化Axios调用

 1.7   关于跨域

1.7.1   同源策略

要素1: 浏览器的访问地址
要素2: Ajax的请求的网址
策略说明: 如果上述的要素同时满足 协议://域名:端口号都相同的情况,则称之为满足同源策略.可以进行正确的调用. 也称之为 “同域访问”.

1.7.2  什么是跨域

违反了同源策略就叫跨域访问

1.7.3  例题

案例1:

浏览器地址: http://www.jd.com/xx/xx
ajax地址: https://www.jd.com/yy/yy 跨域: 协议不同
案例2:

浏览器地址: http://www.jd.com/xx/xx
ajax地址: http://www.jd.com/yy/yy 同域请求
案例3:

浏览器地址: http://www.jd.com:80/xx/xx
ajax地址: http://www.jd.com/yy/yy 同域请求!!!
案例4:
前提: 域名与IP对应

浏览器地址: http://www.jd.com/xx/xx
ajax地址: http://8.8.8.8/yy/yy 跨域请求! 域名不一致
案例5:

浏览器地址: https://www.jd.com/xx/xx
ajax地址: https://www.jd.com:443/yy/yy 同域请求 https的默认端口号 443
案例6:

浏览器地址: http://www.jd.com/xx/yy/xx
ajax地址: http://miaoshi.jd.com/yy/yy 跨域请求 域名不同

这篇好文章是转载于：学新通技术网