Node学习之路 |
您所在的位置：网站首页 › socket和restful › Node学习之路 |
Node学习之路
|
今天介绍一下接口、SSR、SEO优化、Socket通讯和分页接口 1. 接口 1.1 RestfulAPI 规范RESTful 是目前最流行的 API 设计规范，用于 Web 数据接口的设计。 RESTful 的核心思想就是，客户端发出的数据操作指令都是"动词 + 宾语"的结构。 比如，GET /articles这个命令，GET是动词，/articles是宾语。 动词通常就是五种 HTTP 方法，对应 CRUD 操作。 GET：读取（Read） POST：新建（Create） PUT：更新（Update） PATCH：更新（Update），通常是部分更新 DELETE：删除（Delete）根据 HTTP 规范，动词一律大写。 有些客户端只能使用GET和POST这两种方法。 服务器必须接受POST模拟其他三个方法（PUT、PATCH、DELETE）。 这时，客户端发出的 HTTP 请求，要加上X-HTTP-Method-Override属性，告诉服务器应该使用哪一个动词，覆盖POST方法。 1.2 编写api接口文档正规的团队合作或者是项目对接，接口文档是非常重要的，一般接口文档都是通过开发人员写的。一个工整的文档显得是非重要 1.2.1 接口规范内容 接口名称 场景说明 接口说明 请求参数 响应参数 错误码 1.2.2 参数内容 字段名 变量名 是否必填 类型 示例值 描述 1.2.3 错误码内容 名称 描述 原因 解决方案 4.2.4 接口示例（来源：聚合数据新闻接口）接口地址：http://v.juhe.cn/toutiao/index 返回格式：json 请求方式：get/post 请求示例：http://v.juhe.cn/toutiao/index?type=top&key=APPKEY 接口备注：返回头条，社会，国内，娱乐，体育，军事，科技，财经，时尚等新闻信息 请求参数说明： 名称 必填 类型 说明 key 是 string 应用APPKEY type 否 string 类型,top(头条，默认),shehui(社会),guonei(国内),guoji(国际),yule(娱乐),tiyu(体育)junshi(军事),keji(科技),caijing(财经),shishang(时尚)返回参数说明： 名称 类型 说明 见JSON返回示例 - -JSON返回示例： { "reason": "成功的返回", "result": { "stat": "1", "data": [ { "uniquekey": "6c4caa0c3ba6e05e2a272892af43c00e", "title": "杨幂的发际线再也回不去了么？网友吐槽像半秃", "date": "2017-01-05 11:03", "category": "yule", "author_name": "腾讯娱乐", "url": "http://mini.eastday.com/mobile/170105110355287.html?qid=juheshuju", "thumbnail_pic_s": "http://03.imgmini.eastday.com/mobile/20170105/20170105110355_ 806f4ed3fe71d04fa452783d6736a02b_1_mwpm_03200403.jpeg", "thumbnail_pic_s02": "http://03.imgmini.eastday.com/mobile/20170105/20170105110355_ 806f4ed3fe71d04fa452783d6736a02b_2_mwpm_03200403.jpeg", "thumbnail_pic_s03": "http://03.imgmini.eastday.com/mobile/20170105/20170105110355_ 806f4ed3fe71d04fa452783d6736a02b_3_mwpm_03200403.jpeg" }, ] } } 1.3 postman接口调试工具的使用postman 用户在开发或者调试网络程序或者是网页B/S模式的程序的时候是需要一些方法来跟踪网页请求的，用户可以使用一些网络的监视工具比如著名的Firebug等网页调试工具。 1.3.1 先写一个获取用户信息的接口复制routes文件夹为api文件夹，只保留user.js api -> user.js 修改api/user.js文件 前后端分离 res.send() 前后端不分离 res.render() var express = require('express'); var router = express.Router(); const sql = require('./../sql'); const User = require('./../sql/model/users'); router.get('/', function(req, res, next) { sql.find(User, {}, {_id: 0, __v: 0}, (data) => { res.send(data) }) }); // 查找某个用户的信息 router.post('/detail', function(req, res, next) { sql.find(User, { tel: req.body.tel }, {_id: 0, __v: 0}, (data) => { res.send(data) }) }); module.exports = router;app.js处引入并且注册接口 var apiuserRouter = require('./api/user'); app.use('/api/user', apiuserRouter);以后就可以通过 /api/user访问api文件夹下的user.js所对应的接口 http://localhost:3000/api/user 1.3.2 postman测试接口 1.3.3 前端通过ajax调用接口 $.ajax({ url: 'http://localhost:3000/api/user', success: function (data) { console.log(data) } })此时发现跨域问题 a) jsonp 解决跨域问题 后端代码 router.get('/', function(req, res, next) { // 这一步JSONP必备 var _callback = req.query.callback; sql.find(User, {}, {_id: 0, __v: 0}, (data) => { // res.send(data) if (_callback){ // 这两步设置发送也是NODE.JS发送JSONP必备 res.type('text/javascript'); res.send(_callback + '(' + JSON.stringify(data) + ')'); } else{ res.json(data); } }) });前端代码 $.ajax({ url: 'http://localhost:3000/api/user', dataType: 'jsonp', // *************** success: function (data) { console.log(data) } })b) cors解决跨域问题 app.js中加入如下代码 var allowCrossDomain = function (req, res, next) { res.header('Access-Control-Allow-Origin', '*');//自定义中间件，设置跨域需要的响应头。 next(); }; app.use(allowCrossDomain) 运用跨域的中间件c) 利用 http-proxy-middleware 实现代理跨域 — 服务器与服务器之间 假设有一个服务器http://localhost:4000/users，现在需要在服务器为http://localhost:3000的接口中访问，可以使用http-proxy-middleware进行反向代理 var proxy = require('http-proxy-middleware'); const proxyOption = { target: 'http://localhost:4000', pathRewrite: { '^/api/' : '/' // 重写请求，api/解析为/ }, changeOrigoin:true }; // 反向代理 app.use('/api/*', proxy(proxyOption));这样就可以直接通过http://localhost:3000/api/users访问到http://localhost:4000/users接口了 2. SSRSSR是 Server-Side Rendering(服务器端渲染)的缩写，在普通的SPA中，一般是将框架及网站页面代码发送到浏览器，然后在浏览器中生成和操作DOM（这里也是第一次访问SPA网站在同等带宽及网络延迟下比传统的在后端生成HTML发送到浏览器要更慢的主要原因），但其实也可以将SPA应用打包到服务器上，在服务器上渲染出HTML，发送到浏览器，这样的HTML页面还不具备交互能力，所以还需要与SPA框架配合，在浏览器上“混合”成可交互的应用程序。所以，只要能合理地运用SSR技术，不仅能一定程度上解决首屏慢的问题，还能获得更好的SEO。 SSR的优点 更快的响应时间，不用等待所有的JS都下载完成，浏览器便能显示比较完整的页面了。 更好的SSR，我们可以将SEO的关键信息直接在后台就渲染成HTML，而保证搜索引擎的爬虫都能爬取到关键数据。SSR的缺点 相对于仅仅需要提供静态文件的服务器，SSR中使用的渲染程序自然会占用更多的CPU和内存资源 一些常用的浏览器API可能无法正常使用，比如window、docment和alert等，如果使用的话需要对运行的环境加以判断 开发调试会有一些麻烦，因为涉及了浏览器及服务器，对于SPA的一些组件的生命周期的管理会变得复杂 可能会由于某些因素导致服务器端渲染的结果与浏览器端的结果不一致。SSR常用框架 React 的Next Vue.js 的Nuxt 3. seo优化全称：Search English Optimization，搜索引擎优化。自从有了搜索引擎，SEO便诞生了。 存在的意义：为了提升网页在搜索引擎自然搜索结果中的收录数量以及排序位置而做的优化行为。简言之，就是希望百度等搜索引擎能多多我们收录精心制作后的网站，并且在别人访问时网站能排在前面。 分类：白帽SEO和黑帽SEO。白帽SEO，起到了改良和规范网站设计的作用，使网站对搜索引擎和用户更加友好，并且网站也能从搜索引擎中获取合理的流量，这是搜索引擎鼓励和支持的。黑帽SEO，利用和放大搜索引擎政策缺陷来获取更多用户的访问量，这类行为大多是欺骗搜索引擎，一般搜索引擎公司是不支持与鼓励的。本文针对白帽SEO，那么白帽SEO能做什么呢？ 对网站的标题、关键字、描述精心设置，反映网站的定位，让搜索引擎明白网站是做什么的； 网站内容优化：内容与关键字的对应，增加关键字的密度； 在网站上合理设置Robot.txt文件； 生成针对搜索引擎友好的网站地图； 增加外部链接，到各个网站上宣传； 3.1 前端SEO优化通过网站的结构布局设计和网页代码优化，使前端页面既能让浏览器用户能够看懂，也能让“蜘蛛”看懂。 (1) 网站结构布局优化：尽量简单、开门见山，提倡扁平化结构。 一般而言，建立的网站结构层次越少，越容易被“蜘蛛”抓取，也就容易被收录。一般中小型网站目录结构超过三级，“蜘蛛”便不愿意往下爬，“万一天黑迷路了怎么办”。并且根据相关调查：访客如果经过跳转3次还没找到需要的信息，很可能离开。因此，三层目录结构也是体验的需要。为此我们需要做到： 1. 控制首页链接数量 2. .扁平化的目录层次，尽量让“蜘蛛”只要跳转3次，就能到达网站内的任何一个内页。扁平化的目录结构，比如：“植物”–> “水果” –> “苹果”、“桔子”、“香蕉”，通过3级就能找到香蕉了。 3. .导航优化 导航应该尽量采用文字方式，也可以搭配图片导航，但是图片代码一定要进行优化中的标签：尽量让代码语义化，在适当的位置使用适当的标签，用正确的标签做正确的事。让阅读源码者和“蜘蛛”都一目了然。比如：h1-h6是用于标题类的，< nav>标签是用来设置页面主导航的等。 5.< a >页内链接，要加“title” 属性加以说明，让访客和 “蜘蛛” 知道。而外部链接，链接到其他网站的，则需要加上el="nofollow"属性, 告诉 “蜘蛛” 不要爬，因为一旦“蜘蛛”爬了外部链接之后，就不会再回来了。 6.正文标题要用< h1>标签：“蜘蛛” 认为它最重要，若不喜欢< h1>的默认样式可以通过CSS设置。尽量做到正文标题用< h1>标签，副标题用< h2>标签, 而其它地方不应该随便乱用 h 标题标签。 7.< br>标签：只用于文本内容的换行，比如: < p> 第一行文字内容 第二行文字内容 第三行文字内容 < /p> 8.表格应该使用表格标题标签 9.socket 网络传输 — 双向数据传输 没有 socket通讯之前，只能使用 轮询 方案 > 基于net原生模块 4.1 Socket 简介和通讯流程网络上的两个程序通过一个双向的通信连接实现数据的交换，这个连接的一端称为一个socket。 建立网络通信连接至少要一对端口号(socket)。socket本质是编程接口(API)，对TCP/IP的封装，TCP/IP也要提供可供程序员做网络开发所用的接口，这就是Socket编程接口；HTTP是轿车，提供了封装或者显示数据的具体形式；Socket是发动机，提供了网络通信的能力。 4.1.1 通讯流程根据连接启动的方式以及本地套接字要连接的目标，套接字之间的连接过程可以分为三个步骤：服务器监听，客户端请求，连接确认。 （1）服务器监听：是服务器端套接字并不定位具体的客户端套接字，而是处于等待连接的状态，实时监控网络状态。 （2）客户端请求：是指由客户端的套接字提出连接请求，要连接的目标是服务器端的套接字。为此，客户端的套接字必须首先描述它要连接的服务器的套接字，指出服务器端套接字的地址和端口号，然后就向服务器端套接字提出连接请求。 （3）连接确认：是指当服务器端套接字监听到或者说接收到客户端套接字的连接请求，它就响应客户端套接字的请求，建立一个新的线程，把服务器端套接字的描述发给客户端，一旦客户端确认了此描述，连接就建立好了。而服务器端套接字继续处于监听状态，继续接收其他客户端套接字的连接请求。 socket.io 5. 实现 分页接口db.users.find().skip().limit() skip 表示从第几个开始查询 limit 表示查询多少个 封装分页的模块 myapp - sql - index.js |
实现分页接口 api user.js 
今天就到这里了，请多多指教。【本文地址】
今日新闻 |
推荐新闻 |