网络结构

网络结构是网络构建方式,目前流行的有客户端服务器结构(C/S结构)和点对点(P2P)结构网络。

客户端服务器结构(C/S结构)

这种结构又被称为Clicent/Server结构,它是一种主从结构。服务器一直处于等待状态,如果客户端请求,服务器响应请求,建立连接,提供服务。服务器是被动的,客户端是主动的。类似于在豪华餐厅点餐,客人是主动的,服务员是被动的。

点对点结构(P2P结构)

这种结构也叫做对等结构网络,每个节点之间是对等的。网络分布范围比较少,通常在一间办公室或者一个家庭内,适用于移动设备之间的通讯,网络链路层由蓝牙和Wifi实现。类似于在吃豪华自助餐,所有的客人都是对等的。

考虑到跨平台的需要,Cocos-JS引擎主要采用C/S网络结构。这种结构主要采用HTTP和HTTPS等传输协议。

HTTP

HTTP是超文本传输协议,Interent的基本协议是TCP/IP,目前使用广泛使用的是HTTP、HTTPS、FTP、Archie Gopher等是简历在TCP/IP之上的应用层协议,不同的协议对应不同的应用。

HTTP是一个属于应用层的面向对象的协议,由于其简洁,快速的方式,适用于分布式超文本信息传输。

HTTP定义了8中请求方法,OPTIONS,HEAD,GET,POST,PUT,DELETE,TRACE和CONNECT作为Web服务器,至少需实现GET和HEAD方法,其他方法是可选的。

GET方法是向指定的资源发送请求,发送的信息在URL后面。像是使用明信片给别人写信,“信内容”写在外面,接触到的人都可以看到,不安全。

POST方法是向指定的资源提交数据,请求服务器进行处理。像是把“信内容”装入信封寄出去,接触到的人都看不到,因此是安全的。

HTTPS

HTTPS是安全的超文本传输协议,是超文本传输协议和SSL加密的结合。提供加密通信对网络服务器身份的鉴定。

HTTPS是HTTP的升级版。与HTTP的区别是,HTTPS使用https://代替http://,HTTPS使用端口443,而HTTP使用端口80和TCP/IP金星通信。SSL使用40位关键字作为RC4流加密算法。这对于商业信息的加密是合适的。

使用XMLHttpResquest对象

在web前端开发有一种异步刷新技术AJAX。它的核心技术就是JavaScript对象的XMLHttpResquest,他是一种异步请求技术。

1. open()与服务器连接,创建新的连接请求。

2. send()向服务器发送请求。

3. abort()退出当前请求。

4. readyState属性,提供当前请求的状态,其中4表示准备就绪。

5. status属性,提供当前的HTTP请求状态吗,其中200表示请求成功。

6. responseText属性,服务器返回的响应文本。

7. onreadystatechange属性,设置回调函数。

其中,open和send函数,以及onreadystatechange属性是http请求的关键。

open函数有5个参数可以使用。(method,url,async,user,password)

method是指发送请求的类型,一般为GET或POSt

url是指请求的链接

async是否异步请求,该参数可选,默认为true

user如果该请求需要身份认证,这里指定用户名,无默认值

password如果该请求需要身份验证,这里指定密码,无默认值

XMLHttpResquest有5中就绪状态

0:请求没有发出,在调用open()函数之前为改状态

1:请求已经建立但还没有发出,在调用send()函数之前为改状态

2:请求已经发出正在处理中

3:请求已经处理,响应中通常有部分数据可用,但是服务器没有完成响应

4:响应已经完成,可以访问服务器响应并使用它

常见的HTTP状态码

401:表示所访问数据禁止访问

403:表示所访问数据受到保护

404:表示错误的URL请求,服务器资源不存在

200:表示请求成功

如果就是状态是4,并且状态码是200,表示请求完成可以处理服务器数据

Get请求方式

 1 var XMLHttpResquestGet = function (url, callback) {
2 var request = cc.loader.getXMLHttpRequest();
3 request.open("GET", url, true);
4
5 request.onreadystatechange = function () {
6 //如果就绪状态是4,状态码是200则表示请求成功
7 if(request.readyState === 4 && request.status === 200) {
8 try{
9 console.log("XMLHttpResquestGet Status:" + request.statusText);
10 if(callback) callback(true, request.responseText);
11 }
12 catch (e) {
13 if(callback) callback(false, e);
14 }
15 }
16 else{
17 if(callback) callback(false, );
18 }
19 };
20 request.send();
21 };

POST请求方式

 1 var XMLHttpResquestPost = function (url, params, callback) {
2 var xhr = cc.loader.getXMLHttpRequest();
3 xhr.open("POST", url);
4
5 xhr.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
6 xhr.onreadystatechange = function () {
7 //如果就绪状态是4,状态码是200则表示请求成功
8 if(xhr.readyState === 4 && xhr.status === 200) {
9 try{
10 console.log("XMLHttpResquestPost Status:" + xhr.statusText);
11 if(callback) callback(true, xhr.responseText);
12 }
13 catch (e) {
14 if(callback) callback(false, e);
15 }
16 }
17 else{
18 if(callback) callback(false);
19 }
20 };
21 xhr.send(params);
22 };

Cocos-JS HTTP网络请求的更多相关文章

  1. fetch + async await 使用原生JS发送网络请求

    由于现在主流浏览器支持Fetch API,无需引用其他库就能实现AJAX,一行代码就搞定,可以说是非常方便了. export default { name: 'HelloWorld', data() ...

  2. React-Native 之 GD (八)GET 网络请求封装

    1.到这里,相信各位对 React-Native 有所熟悉了吧,从现在开始我们要慢慢往实际的方向走,这边就先从网络请求这部分开始,在正式开发中,网络请求一般都单独作为一部分,我们在需要使用的地方只需要 ...

  3. 在 JS 中使用 fetch 更加高效地进行网络请求

    在前端快速发展地过程中,为了契合更好的设计模式,产生了 fetch 框架,此文将简要介绍下 fetch 的基本使用. 我的源博客地址:http://blog.parryqiu.com/2016/03/ ...

  4. 移动端打印输出内容以及网络请求-vconsole.js

    今天,无意间从别人那里得知一个很好的js插件--vconsole.min.js,可以实现在移动端打印输出内容以及查看网络请求.下面记录使用方式. 1.下载vconsole.min.js插件 以下复制了 ...

  5. 介绍一下主流的浏览器的开发者工具(js调试和查看网络请求)

    1.打开开发者工具:右键-->检查 (快捷键 f12) 2.开发者工具介绍: (1): 选择页面的dom进行查看 (2):设备适配 (3)元素: ① 可以查找到界面对应的dom: ② 通过计算样 ...

  6. Android之三种网络请求解析数据(最佳案例)

    AsyncTask解析数据 AsyncTask主要用来更新UI线程,比较耗时的操作可以在AsyncTask中使用. AsyncTask是个抽象类,使用时需要继承这个类,然后调用execute()方法. ...

  7. android 网络请求Ⅰ

    本章讲述在android开发中,常用的网络请求操作.网络请求利用android基本的HttpURLConnection连接URL和开源网络请求包AsyncHttpClient.本次网络请求以调取天气接 ...

  8. JS&CSS文件请求合并及压缩处理研究(五)

    接上篇.在我们最终调用 @Html.RenderResFile(ResourceType.Script) 或者 @Html.RenderResFile(ResourceType.StyleSheet) ...

  9. iOS开发--Swift 基于AFNetworking 3.0的网络请求封装

    Swift和OC基于AFNetworking的网络请求流程相同, 就是语法不同, 对于Swift语法不是很清楚的同学, 建议多看看API文档, 自己多多尝试. 写过OC的应该都明白每句话做什么的, 就 ...

  10. 第三篇、微信小程序-网络请求API

    wx.request(OBJECT)发起的是https请求.一个微信小程序,同时只能有5个网络请求连接. OBJECT参数说明: 效果图: net.js Page({ data:{ result:{} ...

随机推荐

  1. 代码随想录算法训练营第二十五天| 216.组合总和III 17.电话号码的字母组合

      216.组合总和III 卡哥建议:如果把 组合问题理解了,本题就容易一些了. 题目链接/文章讲解:https://programmercarl.com/0216.%E7%BB%84%E5%90%8 ...

  2. Solution -「NOI 2020」时代的眼泪

    Description Link. 给出一个二维平面以及一些点,保证点不在同行 / 同列.每次询问求出一个子矩阵里面的顺序对. Solution 卡常,卡你吗. 膜拜 dX. 基本是把 dX 的题解贺 ...

  3. python实现简单的爬虫功能

    前言Python是一种广泛应用于爬虫的高级编程语言,它提供了许多强大的库和框架,可以轻松地创建自己的爬虫程序.在本文中,我们将介绍如何使用Python实现简单的爬虫功能,并提供相关的代码实例. 如何实 ...

  4. Java 21 新特性:Unnamed Classes and Instance Main Methods

    Java 21引入了两个语言核心功能: 未命名的Java类你说 新的启动协议:该协议允许更简单地运行Java类,并且无需太多样板 下面一起来看个例子.通常,我们初学Java的时候,都会写类似下面这样的 ...

  5. 为什么 Rust 备受开发者青睐?

    引子 作为一名敏锐的前端开发者,您可能早已对 Rust 有所耳闻,毕竟近几年,使用 Rust 开发的前端构建工具每经发布,其卓越的性能数据总是能带来社区的一阵惊叹. 图片来源:https://swc. ...

  6. IEEE 国际计算科学与工程会议 (CSE-2023)

    随着计算机系统变得越来越庞大和复杂,基于数据的计算技术在支持下一代科学和工程应用方面发挥着关键作用.如今,科学和工程中基于云的复杂大数据应用由异构软件/硬件/网络组件组成,这些组件的容量.可用性和环境 ...

  7. P8679 [蓝桥杯 2019 省 B] 填空问题 题解

    P8679 [蓝桥杯 2019 省 B] 填空问题 题解 题目传送门 欢迎大家指出错误并联系这个蒟蒻 更新日志 2023-05-25 21:02 文章完成 2023-05-27 11:34 文章通过审 ...

  8. [MAUI]深入了解.NET MAUI Blazor与Vue的混合开发

    @ 目录 Vue在混合开发中的特点 创建MAUI项目 创建Vue应用 使用element-ui组件库 JavaScript和原生代码的交互 传递根组件参数 从设备调用Javascript代码 从Vue ...

  9. Interesting Array 题解

    Interesting Array 题目大意 构造一个序列 \(a\),使其满足若干限制条件,每个限制条件是形如 l r q 的式子,其意义是:\(\&_{i=l}^ra_i=q\). 题意分 ...

  10. 「CSP-2023」我曾璀璨星空,星月相伴,致远方,致过往。

    Day -1   像往常一样去上学.虽然身在学校但感觉心还在比赛上.在一个上午课间准备去上厕所时遇见了信息老师.她在教我们班信息之前我的一些奖状的指导教师就是写的她,之前就认识了,每次碰到她都会朝我笑 ...