三阶段第一天node

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接: https://blog.csdn.net/weixin_44195250/article/details/96022490
    **1、传统的DOM渲染方式?
      2、什么是模块化?模块化的好处
      3、application/x-www-form-urlencode
      4、关于报文  相关文档读 3篇
      5、当输入www.baidu.com的时候按下回车会发生什么事情?**

1、传统的DOM渲染方式?
1、传统的DOM渲染分为以下三步:

	**  (1)纯后端渲染         
		(2)纯前端渲染         
		(3)服务端的js渲染结合前端渲染**


	(1).1	纯后端渲染 又称为服务器端渲染(SSR):
		服务端在返回 html 之前,在特定的区域,符号里用数据填充,
	  再给客户端,客户端只负责解析 HTML 。



        (2).1 纯前端渲染 又称为客户端渲染(SPA):html 仅仅作为静态文件,
         客户端端在请求时,服务端不做任何处理,
         直接以原文件的形式返回给客户端客户端,
         然后根据 html 上的 JavaScript,生成 DOM 插入 html。



    (3).1 服务端的js渲染结合前端渲染: 顾名思义就是将后端渲染和前端渲染中一些交给纯后端	
     DOM渲染逻辑分离的不好,
     但是交给纯前端DOM渲染又会造成较高延迟的部分单独分离 出来形成了一独立DOM渲染阶段,
     保留的代码中天然的展示层和数据层的分离,
     又把API请求的累计延迟减少了很多,
     从SEO角度来说渲染结果对搜索引擎也很友好。当然,
     这样的做法需要给整体的架构增加一个独立的单元,给开发和部署都带来了更高复杂性。

2、什么是模块化?模块化的好处是什么?

    2、(1)模块化就是一个将复杂的程序按照一定的规范封装成几个文件,
    并进行组合
   
    2、(2)避免命名冲突(减少命名空间污染)
    更好的分离,按需加载
    更高的复用性  
    更高可维护性

3、application/x-www-form-urlencode
3、(作者:dududu777 来源:CSDN 原文:https://blog.csdn.net/dududu777/article/details/89305151 )

application/x-www-form-urlencode方式是Jquery的Ajax默认的请求方式,使用此方式的优点在于浏览器都支持,在请求发送的过程中,会对请求带有的数据进行序列化处理,如:key0=value0&key=value1的键值对形式发送到后端服务器。

但是axios中默认的请求方式是application/json

方法一:如果项目需要改动的api较少,可以采用 URLSearchParams,使用new URLSearchParams() 来新建一个对象,然后使用append方法来不断向这个对象中添加属性,数据经这样处理后,请求时候,会被转化为键值对的形式。

var param = new URLSearchParams()
param.append(‘key1’,‘value1’)
param.append(‘key2’,‘value2)’
axios.post(’/user’, param)
注意: URLSearchParams 兼容性不是很好,不是对所有浏览器都支持

方法二:如果此种方式没有达到预期效果,可以采用引入qs库

安装qs : npm i qs

var qs = require(‘qs’)
var paramObj = {
currpage: 1,
size: 10
}
let param = qs.stringify(paramObj, { allowDots: true })
axios.post(’/user’,param)
方法三:如果项目需要改动的api较多,推荐直接修改axios的源码,打开并修改 项目名称\node_modules\axios\lib\default.js文件,如下

if (utils.isObject(data)) {
// setContentTypeIfUnset(headers, ‘application/json;charset=utf-8’);
// return JSON.stringify(data);

  // 重新设置通信方式
  setContentTypeIfUnset(headers,'application/x-www-form-urlencoded;charset=utf-8');
  var keys = Object.keys(data);
  //将json数据转化为url的形式,并进行编码处理后返回
  return encodeURI(keys.map(name => `${name}=${data[name]}`).join('&'));
}

keys.map(name => ${name}=${data[name]}).join(’&’) 将json数据 {key1:value1,key2:value2} 转化成键值对的形式key1=value1&key2=value2

4、关于报文 相关文档读 3篇 2019.7.15

5、当输入www.baidu.com的时候按下回车会发生什么事情?
首先不能回答跳转到百度页面了,当然我也知道

    1、(1)第一步 www.baidu.com   

   		    第二步   DNS解析
   		    
   		    第三步  找到相对应的服务器
   		    
   		    http://202.108.22.5/这是百度的IP
   		    
   		    第四步 TCP的三次握手
   		    
   		    第五步 找到相对应的资源库

猜你喜欢

转载自blog.csdn.net/weixin_44195250/article/details/96022490