52 lines
1.0 KiB
Plaintext
52 lines
1.0 KiB
Plaintext
服务端渲染 （模板引擎） mvc
|
||
|
||
缺点：前后端代码混在一起，导致代码冗余，后期升级改造难
|
||
|
||
前端 20% （写页面）
|
||
后端 80% （写功能，做数据，安全，服务器）
|
||
|
||
|
||
前后端分离
|
||
|
||
前端 50% 写页面，功能，特效，路由
|
||
|
|
||
ajax ( XML, json )
|
||
|
|
||
后端 50% 做数据，安全，服务器
|
||
|
||
ajax：一种无刷新的前后端数据交互的方式
|
||
|
||
XMLHttpRequest
|
||
|
||
fetch
|
||
|
||
Access-Control-Allow-Origin （cors）
|
||
|
||
浏览器有一个安全策略（同源策略 cors）
|
||
|
||
如何判断？
|
||
|
||
协议 http 80 https 443
|
||
域名
|
||
端口
|
||
|
||
跨域请求
|
||
|
||
前端：http://127.0.0.1:8080/test
|
||
|
||
前端：https://www.runoob.com/ajax/ajax.html
|
||
|
||
后端：http://127.0.0.1:3000/api/json/index
|
||
|
||
如何解决ajax跨域？
|
||
|
||
1: 后端设置请求头 Access-Control-Allow-Origin（cors）
|
||
2: jsonp + callback
|
||
|
||
3: 服务端代理
|
||
|
||
A(自己的前端) --> C(别人的后端)
|
||
|
||
|
||
A(自己的前端) --> B(自己的后端)
|
||
B(自己的后端) --> C(别人的后端) |