Web技术演化 ======================================== 简å•网站 ---------------------------------------- 陿€é¡µé¢ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Web技术在最åˆé˜¶æ®µï¼Œç½‘站的主è¦å†…å®¹æ˜¯é™æ€çš„,大多站点托管在ISP上,由文å—和图片组æˆï¼Œåˆ¶ä½œå’Œè¡¨çް形å¼ä¹Ÿæ˜¯ä»¥è¡¨æ ¼ä¸ºä¸»ã€‚当时的用户行为也éžå¸¸ç®€å•ï¼ŒåŸºæœ¬åªæ˜¯æµè§ˆç½‘页。 多媒体阶段 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ éšç€æŠ€æœ¯çš„䏿–å‘展,音频ã€è§†é¢‘ã€Flashç‰å¤šåª’ä½“æŠ€æœ¯è¯žç”Ÿäº†ã€‚å¤šåª’ä½“çš„åŠ å…¥ä½¿å¾—ç½‘é¡µå˜å¾—æ›´åŠ ç”ŸåŠ¨å½¢è±¡ï¼Œç½‘é¡µä¸Šçš„äº¤äº’ä¹Ÿç»™ç”¨æˆ·å¸¦æ¥äº†æ›´å¥½çš„体验。 CGI阶段 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ æ¸æ¸çš„,多媒体已ç»ä¸èƒ½æ»¡è¶³äººä»¬çš„请求,于是CGI (Common Gateway Interface) 应è¿è€Œç”Ÿã€‚CGI定义了WebæœåŠ¡å™¨ä¸Žå¤–éƒ¨åº”ç”¨ç¨‹åºä¹‹é—´çš„é€šä¿¡æŽ¥å£æ ‡å‡†ï¼Œå› æ¤WebæœåС噍å¯ä»¥é€šè¿‡CGI执行外部程åºï¼Œè®©å¤–éƒ¨ç¨‹åºæ ¹æ®Web请求内容生æˆåЍæ€çš„内容。 在这个时候,å„ç§ç¼–程è¯è¨€å¦‚PHP/ASP/JSPä¹Ÿé€æ¸åŠ å…¥å¸‚åœºï¼ŒåŸºäºŽè¿™äº›è¯è¨€å¯ä»¥å®žçŽ°æ›´åŠ æ¨¡å—化的ã€åŠŸèƒ½æ›´å¼ºå¤§çš„åº”ç”¨ç¨‹åºã€‚ MVC ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ éšç€Web应用开å‘è¶Šæ¥è¶Šæ ‡å‡†åŒ–,出现了MVCç‰æ€æƒ³ã€‚MVC是Model/View/Control的缩写,Model用于å°è£…æ•°æ®å’Œæ•°æ®å¤„ç†æ–¹æ³•,视图View是数æ®çš„HTML展现,控制器Controllerè´Ÿè´£å“应请求,åè°ƒModelå’ŒView。 Model,Viewå’ŒController的分开,是一ç§å…¸åž‹çš„å…³æ³¨ç‚¹åˆ†ç¦»çš„æ€æƒ³ï¼Œä½¿å¾—代ç å¤ç”¨æ€§å’Œç»„织性更好,Web应用的é…ç½®æ€§å’Œçµæ´»æ€§ä¹Ÿè¶Šæ¥è¶Šå¥½ã€‚而数æ®è®¿é—®ä¹Ÿé€æ¸é€šè¿‡é¢å‘å¯¹è±¡çš„æ–¹å¼æ¥æ›¿ä»£ç›´æŽ¥çš„SQL访问,出现了ORM (Object Relation Mapping) 的概念。 除了MVCï¼Œç±»ä¼¼çš„è®¾è®¡æ€æƒ³è¿˜æœ‰MVPã€MVVMç‰ã€‚ æ•°æ®äº¤äº’ ---------------------------------------- ç®€å•æ•°æ®äº¤äº’ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 在Web技术å‘展最åˆï¼Œå‰åŽç«¯äº¤äº’大部分都使用Web表å•ã€XMLã€SOAPç‰è¾ƒä¸ºç®€å•的方å¼ã€‚ Ajax ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 在开始的时候,用户æäº¤æ•´ä¸ªè¡¨å•åŽæ‰èƒ½èŽ·å–结果,用户体验æžå·®ã€‚于是Ajax (Asynchronous Javascript And XML) æŠ€æœ¯é€æ¸æµè¡Œèµ·æ¥ï¼Œå®ƒä½¿å¾—åº”ç”¨åœ¨ä¸æ›´æ–°æ•´ä¸ªé¡µé¢çš„å‰æä¸‹ä¹Ÿå¯ä»¥èŽ·å¾—æˆ–æ›´æ–°æ•°æ®ã€‚这使得Webåº”ç”¨ç¨‹åºæ›´ä¸ºè¿…æ·åœ°å›žåº”用户动作,并é¿å…了在网络上å‘é€é‚£äº›æ²¡æœ‰æ”¹å˜çš„ä¿¡æ¯ã€‚ RESTful ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 在CGI时期,å‰åŽç«¯é€šå¸¸æ˜¯æ²¡æœ‰åšä¸¥æ ¼åŒºåˆ†çš„,éšç€è§£è€¦å’Œçš„éœ€æ±‚ä¸æ–å¢žåŠ ï¼Œå‰åŽç«¯çš„æ¦‚念开始å˜å¾—清晰。å‰ç«¯ä¸»è¦æŒ‡ç½‘ç«™å‰å°éƒ¨åˆ†ï¼Œè¿è¡Œåœ¨PC端ã€ç§»åŠ¨ç«¯ç‰æµè§ˆå™¨ä¸Šå±•现给用户æµè§ˆçš„网页,由HTML5ã€CSS3ã€JavaScript组æˆã€‚åŽç«¯ä¸»è¦æŒ‡ç½‘ç«™çš„é€»è¾‘éƒ¨åˆ†ï¼Œæ¶‰åŠæ•°æ®çš„å¢žåˆ æ”¹æŸ¥ç‰ã€‚ æ¤æ—¶ï¼ŒREST (Representation State Transformation) 逿¸æˆä¸ºä¸€ç§æµè¡Œçš„Webæž¶æž„é£Žæ ¼ã€‚ REST鼓励基于URLæ¥ç»„织系统功能,充分利用HTTP本身的è¯ä¹‰ï¼Œè€Œä¸æ˜¯ä»…ä»…å°†HTTP作为一ç§è¿œç¨‹æ•°æ®ä¼ 输å议。一般RESTful有以下的特å¾ï¼š - 域å和主域å分开 - api.example.com - example.com/api/ - 带有版本控制 - api.example.com/v1 - api.example.com/v2 - 使用URL定ä½èµ„æº - GET /users èŽ·å–æ‰€æœ‰ç”¨æˆ· - GET /team/:team/users èŽ·å–æŸå›¢é˜Ÿæ‰€æœ‰ç”¨æˆ· - POST /users 创建用户 - PATCH/PUT /users 修改æŸä¸ªç”¨æˆ·æ•°æ® - DELETE /users åˆ é™¤æŸä¸ªç”¨æˆ·æ•°æ® - 用 HTTP åŠ¨è¯æè¿°æ“作 - GET 获å–资æºï¼Œå•个或多个 - POST åˆ›å»ºèµ„æº - PUT/PATCH 更新资æºï¼Œå®¢æˆ·ç«¯æä¾›å®Œæ•´çš„èµ„æºæ•°æ® - DELETE åˆ é™¤èµ„æº - æ£ç¡®ä½¿ç”¨çжæ€ç - 使用状æ€ç æé«˜è¿”回数æ®çš„å¯è¯»æ€§ - 默认使用 JSON 作为数æ®å“åº”æ ¼å¼ - 有清晰的文档 GraphQL ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 部分网络æœåŠ¡åœºæ™¯çš„æ•°æ®æœ‰å¤æ‚çš„ä¾èµ–关系,为了应对这些场景,Facebook 推出了 GraphQL ,以图状数æ®ç»“构对数æ®è¿›è¡ŒæŸ¥è¯¢å˜å‚¨ã€‚部分网站也应用了 GraphQL 作为 API 交互的方å¼ã€‚ 二进制 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ éšç€ä¸šåŠ¡å¯¹æ€§èƒ½çš„è¦æ±‚æé«˜ï¼Œå‰åŽç«¯å¼€å§‹ä½¿ç”¨HTTP/2ã€è‡ªå®šä¹‰Protocol Bufferç‰æ–¹å¼æ¥åŠ å¿«æ•°æ®äº¤äº’。 架构演进 ---------------------------------------- éšç€ä¸šåŠ¡çš„ä¸æ–å‘展,业务架构也越æ¥è¶Šå¤æ‚ã€‚ä¼ ç»Ÿçš„åŠŸèƒ½è¢«æ‹†åˆ†æˆä¸åŒçš„æ¨¡å—,出现了ä¸é—´ä»¶ã€ä¸å°ç‰æ¦‚å¿µã€‚ä»£ç†æœåŠ¡ã€è´Ÿè½½å‡è¡¡ã€æ•°æ®åº“分表ã€å¼‚地容ç¾ã€ç¼“å˜ã€CDNã€æ¶ˆæ¯é˜Ÿåˆ—ã€å®‰å…¨é˜²æŠ¤ç‰æŠ€æœ¯åº”用越æ¥è¶Šå¹¿æ³›ï¼Œå¢žåŠ äº†Webå¼€å‘å’Œè¿ç»´çš„夿‚度。 客户端的形æ€è¶Šæ¥è¶Šå¤šï¼Œé™¤äº†Web之外iOSã€Androidç‰å…¶ä»–场景也出现在WebæœåŠ¡çš„å®¢æˆ·ç«¯åœºæ™¯ã€‚ 较早的关系型数æ®åº“MySQLã€PostgreSQLç‰å·²ç»ä¸èƒ½æ»¡è¶³éœ€æ±‚,出现了Redis/Memcachedç¼“å˜æ•°æ®åº“ç‰ä¸€ç±»æ»¡è¶³ç‰¹å®šéœ€æ±‚的数æ®åº“。 为了满足特定的业务需求,出现了Lucene/Solr/Elasticsearchæœç´¢åº”用æœåŠ¡å™¨ï¼ŒKafka/RabbitMQ/ZeroMQ消æ¯ç³»ç»Ÿï¼ŒSpark计算引擎,Hiveæ•°æ®ä»“库平å°ç‰ä¸åŒçš„基础架构。 ä¸é—´ä»¶ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ä¸é—´ä»¶æ˜¯ç‹¬ç«‹çš„软件程åºï¼Œç”¨äºŽç®¡ç†è®¡ç®—资æºå’Œç½‘络通信。常用的功能有过滤IPã€åˆå¹¶æŽ¥å£ã€åˆå¹¶ç«¯å£ã€è·¯ç”±ã€æƒé™æ ¡éªŒã€è´Ÿè½½å‡è¡¡ã€åå‘代ç†ç‰ã€‚ åˆ†å¸ƒå¼ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ éšç€æ•°æ®é‡çš„䏿–æé«˜ï¼Œå•å°è®¾å¤‡éš¾ä»¥æ‰¿è½½è¿™æ ·çš„访问é‡ï¼ŒåŒæ—¶ä¸åŒåŠŸèƒ½ä¹Ÿè¢«æ‹†åˆ†åˆ°ä¸åŒçš„应用ä¸ï¼ŒäºŽæ˜¯å‡ºçŽ°äº†æé«˜ä¸šåŠ¡å¤ç”¨åŠæ•´åˆçš„åˆ†å¸ƒå¼æœåŠ¡æ¡†æž¶(RPC)。 云æœåŠ¡ ---------------------------------------- 云计算诞生之å‰ï¼Œå¤§éƒ¨åˆ†è®¡ç®—èµ„æºæ˜¯å¤„于“裸金属â€çжæ€çš„ç‰©ç†æœºï¼Œè¿ç»´äººå‘˜é€‰æ‹©å¯¹åº”è§„æ ¼çš„ç¡¬ä»¶ï¼Œå»ºè®¾æœºæˆ¿çš„ IDC ç½‘ç»œï¼Œå®ŒæˆæœåŠ¡çš„æä¾›ï¼ŒæŠ•å…¥ç¡¬ä»¶åŸºç¡€å»ºè®¾å’Œç»´æŠ¤çš„æˆæœ¬å¾ˆé«˜ã€‚云æœåŠ¡å‡ºçŽ°ä¹‹åŽï¼Œä½¿ç”¨è€…å¯ä»¥ç›´æŽ¥è´ä¹°äº‘主机,基础设施由供应商管ç†ï¼Œè¿™ç§æ–¹å¼ä¹Ÿè¢«ç§°ä½œ IaaS (Infrastructure-as-a-Service) 。 éšç€æž¶æž„的继ç»å‘展,应用的è¿è¡Œæ›´åŠ ç»†ç²’åº¦ï¼Œéƒ¨ç½²çŽ¯å¢ƒå®¹å™¨åŒ–ï¼Œå„个功能拆æˆå¾®æœåŠ¡æˆ–æ˜¯Serverless的架构。 Serverless ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Serverless 架构由两部分组æˆï¼Œå³ Faas (Function-as-a-Service) å’Œ BaaS (Backend-as-a-Service) 。 FaaS是è¿è¡Œå¹³å°ï¼Œç”¨æˆ·ä¸Šä¼ éœ€è¦æ‰§è¡Œçš„é€»è¾‘å‡½æ•°å¦‚ä¸€äº›å®šæ—¶ä»»åŠ¡ã€æ•°æ®å¤„ç†ä»»åŠ¡ç‰åˆ°äº‘函数平å°ï¼Œé…置执行æ¡ä»¶è§¦å‘器ã€è·¯ç”±ç‰ç‰ï¼Œå°±å¯ä»¥é€šè¿‡äº‘å¹³å°å®Œæˆå‡½æ•°çš„æ‰§è¡Œã€‚ BaaS包å«äº†åŽç«¯æœåŠ¡ç»„ä»¶ï¼Œå®ƒåŸºäºŽ API 完æˆç¬¬ä¸‰æ–¹æœåŠ¡ï¼Œä¸»è¦æ˜¯æ•°æ®åº“ã€å¯¹è±¡å˜å‚¨ã€æ¶ˆæ¯é˜Ÿåˆ—ã€æ—¥å¿—æœåŠ¡ç‰ç‰ã€‚ å¾®æœåŠ¡ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ å¾®æœåŠ¡èµ·æºäºŽ2005å¹´Peter Rodgersåšå£«åœ¨äº‘端è¿ç®—åšè§ˆä¼šæå‡ºçš„å¾®WebæœåŠ¡ (Micro-Web-Service)ï¼Œæ ¹æœ¬æ€æƒ³ç±»ä¼¼äºŽUnix的管é“设计ç†å¿µã€‚2014年,由Martin Fowler与 James Lewiså…±åŒæå‡ºäº†å¾®æœåŠ¡çš„æ¦‚å¿µï¼Œå®šä¹‰äº†å¾®æœåŠ¡æž¶æž„é£Žæ ¼æ˜¯ä¸€ç§é€šè¿‡ä¸€å¥—å°åž‹æœåŠ¡æ¥å¼€å‘å•个应用的方法,æ¯ä¸ªæœåŠ¡è¿è¡Œåœ¨è‡ªå·±çš„进程ä¸ï¼Œå¹¶é€šè¿‡è½»é‡çº§çš„æœºåˆ¶è¿›è¡Œé€šè®¯ (HTTP API) 。 å¾®æœåŠ¡æ˜¯ä¸€ç§åº”ç”¨äºŽç»„ä»¶è®¾è®¡å’Œéƒ¨ç½²æž¶æž„çš„è½¯ä»¶æž¶æž„é£Žæ ¼ã€‚å®ƒåˆ©ç”¨æ¨¡å—化的方å¼ç»„åˆå‡ºå¤æ‚的大型应用程åºï¼š - å„个æœåŠ¡åŠŸèƒ½å†…èšï¼Œå®žçŽ°ä¸ŽæŽ¥å£åˆ†ç¦»ã€‚ - å„个æœåŠ¡é«˜åº¦è‡ªæ²»ã€ç›¸äº’解耦,å¯ä»¥ç‹¬ç«‹è¿›è¡Œéƒ¨ç½²ã€ç‰ˆæœ¬æŽ§åˆ¶å’Œå®¹é‡ä¼¸ç¼©ã€‚ - å„个æœåŠ¡ä¹‹é—´é€šè¿‡ API 的方å¼è¿›è¡Œé€šä¿¡ã€‚ - å„个æœåŠ¡æ‹¥æœ‰ç‹¬ç«‹çš„çŠ¶æ€ï¼Œå¹¶ä¸”åªèƒ½é€šè¿‡æœåŠ¡æœ¬èº«æ¥å¯¹å…¶è¿›è¡Œè®¿é—®ã€‚ API网关 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ API网关是一个æœåŠ¡å™¨ï¼Œå®¢æˆ·ç«¯åªéœ€è¦ä½¿ç”¨ç®€å•的访问方å¼ï¼Œç»Ÿä¸€è®¿é—®API网关,由API网关æ¥ä»£ç†å¯¹åŽç«¯æœåŠ¡çš„è®¿é—®ï¼ŒåŒæ—¶ç”±äºŽæœåŠ¡æ²»ç†ç‰¹æ€§ç»Ÿä¸€æ”¾åˆ°API网关上é¢ï¼ŒæœåŠ¡æ²»ç†ç‰¹æ€§çš„å˜æ›´å¯ä»¥åšåˆ°å¯¹å®¢æˆ·ç«¯é€æ˜Žï¼Œä¸€å®šç¨‹åº¦ä¸Šå®žçŽ°äº†æœåŠ¡æ²»ç†ç‰åŸºç¡€ç‰¹æ€§å’Œä¸šåŠ¡æœåŠ¡çš„è§£è€¦ï¼ŒæœåŠ¡æ²»ç†ç‰¹æ€§çš„å‡çº§ä¹Ÿæ¯”较容易实现。 è½¯ä»¶å¼€å‘ ---------------------------------------- CI/CD ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ æŒç»é›†æˆ (Continuous Integration, CI) 是让开å‘人员将工作集æˆåˆ°å…±äº«åˆ†æ”¯ä¸çš„过程。频ç¹çš„é›†æˆæœ‰åŠ©äºŽè§£å†³éš”ç¦»ï¼Œå‡å°‘æ¯æ¬¡æäº¤çš„大å°ï¼Œä»¥é™ä½Žåˆå¹¶å†²çªçš„å¯èƒ½æ€§ã€‚ æŒç»äº¤ä»˜ (Continuous Deployment, CD) 是æŒç»é›†æˆçš„æ‰©å±•ï¼Œå®ƒå°†æž„å»ºä»Žé›†æˆæµ‹è¯•套件部署到预生产环境。这使得它å¯ä»¥ç›´æŽ¥åœ¨ç±»ç”Ÿäº§çŽ¯å¢ƒä¸è¯„ä¼°æ¯ä¸ªæž„å»ºï¼Œå› æ¤å¼€å‘人员å¯ä»¥åœ¨æ— éœ€å¢žåŠ ä»»ä½•å·¥ä½œé‡çš„æƒ…况下,验è¯bugä¿®å¤æˆ–者测试新特性。 å‚考链接 ---------------------------------------- - `Scaling webapps for newbs <https://arcentry.com/blog/scaling-webapps-for-newbs-and-non-techies/>`_ - `GitHub çš„ Restful HTTP API 设计分解 <https://learnku.com/articles/24050>`_