客户端技术笔记

1.常用客户端技术介绍

客户端是指普通用户使用的终端,用户通过客户端接触并使用产品。客户端通常是指PC与移动端。

2.1 Android系统

Android系统基于Lunx开发,谷歌推出的Android所有系统源代码开源。

在应用开发层,使用Java语言进行应用开发。

2.2 iOS系统

iOS系统是基于UNIX的操作系统,在应用层使用苹果自家的开发语言Objective-C、Swift来进行iOS应用开发。

iOS系统是闭源系统,不开放源代发。

2.3 Web网页

Web技术通常是指由HTML、CSS及一些动态交互技术(例如JavaScript等)组成的Web前端技术。

Web网页的好处是跨平台,只有通过浏览器才能获取产品服务。Web网页不需要对特定的设计进行适配,通过响应式布局的方式可以对不同屏幕的尺寸进行动态适配。

通过Web实现的好处是,易于改动、灵活变化,可以在不发布新版本的情况下实现内容更新。

3.Android基础技术及基本控件

Android使用Java为开发语言,使用Eclipse作为开发工具,谷歌也推出Android Studio,相对于Eclipse,使用Android Studio开发更方便,即可以一边编写界面代码,一边查看实际效果。

Android对应用获取系统服务有权限控制,如果要使用系统自身服务,需要在开发阶段声明具体功能的使用权限。

Android

3.1.1 View

View是视图的意思,表示在屏幕上展示的一个可视化控件,是Android所有控件的根。所有的Android控件都是基于View扩展的。

在Android系统中,每一个界面元素都是一个View,在界面上表示这个View,需要注明View的长度与宽度、对应的位置,进一步还可以设置此View的背景颜色及基本形状。可以用View表示一条直线,也可以用View表示一个矩形。

3.1.2 Button

按钮控件,对按钮的形状和外观可以进行自定义设置,还可以设置按钮的点击事件,所谓点击事件就是当我们点击某个按钮时,这个按钮会触发什么操作。

sp:与缩放无关的抽象像素(在正常大小设置下1sp=1dp、当字体大小是大或者超大时,1sp>1dp)

3.1.3 TextView

TextView代表文本展示框,同样需要制定长度与宽度,长宽实际上框定出文本范围,同时还需要制定文本内容的字体大小和颜色。

在TextView中,可以设置文本是单行显示还是多行显示,可以设置字体类型。如果设置TextView的背景颜色,看到的就是一个带矩形边框的区域。

3.1.4 EditText

EditText是文本输入框,也就是产品中输入内容的控件,EditText与TextView的属性基本类似,区别就在于EditText可以进行内容输入,而且对输入的内容可以进行类型控制。(明文与密文、内容类型)

EditText可以控制输入的长度,EditText有一个属性叫做“hint”,它可以用来在EditText中作为提示文本。

通过定义EditText的背景属性,可以设置圆角矩形框、下划线表格式。在设计产品时,一般需要标注一个控制为输入框。

3.1.5 ImageView

ImageView是图片展示控件,对于图片来说,可以用ImageView作为图片载体来体现,可以ImageView设置背景颜色及阴影。

3.1.6 ListView

ListView在Android系统中是列表控件。

例子:联系人会话列表、商品列表、联系人列表。都是通过ListView实现的。


ListView示意图

在实现ListView时,首先需要定义这个ListView的条目中控件的布局方式,在实现层面,只需要定义行条目的展示方式,然后往这个ListView中填充数据即可。

在微信会话列表这个ListView中,条目中包含了展示头像的ImageView控件,展示名称、聊天内容缩略和更新时间的TextView。

在Android系统中,ListView是一种容器型控件,可以在其中放弃他的控件,ListView的外观和其他控件一样,可以进行自定义控制,扩展性强。

3.1.7 GirdView

GridView控件与ListView类似,也是一种容器控件,区别在于ListView以列表的方式展示,GridView以表格的方式展示。如果需要实现多行多列的展示,就可以使用GridView。同样,也需要定义GridView中每一个单元格的布局方式。    


GridView示意图

3.2 Android界面布局原理

线性布局:按照顺序,从上到下或从左到右的布局方式。

margin:边距

相对布局:指定控件与其他控件的相对位置,所谓相对位置就是以某一控件为参考基准,与其他控件的空间位置。

3.3 Android系统的权限控制

在Android系统中,应用访问用户隐私或者获取一些系统权限时候,需要取得用户的授权才可以使用。这些权限的设置是在开发阶段由开发人员标记在代码中的,需要使用哪个系统服务或权限就需要添加其功能权限。

3.4 Android应用打包及发布

Android应用开发完成后,需要打包成一个扩展名为“apk”(Androidpackage)的文件,这个文件是一个完整的Android应用安装文件。

在开发完成后,需要通过开发工具将开发完成的代码及一些素材(例如图片、icon等)一起编译打包成一个APK文件。打包安装文件时,需要使用一个特殊的签名文件为这个安装包文件签名,签名的目的是保证这个应用安装包的唯一性与安全性。因为最终产品需要发布到各个应用商城,签名的意义就在于做唯一性区分并保证安装包的唯一性。

打包完成后进行发布时,可以标记安装包的渠道来源,通过标记渠道来源,可以统计安装渠道,从而了解和统计各个应用市场该产品的下载次数。通过统计还可以检索出有问题的版本来自于哪个应用市场,这样就能更精准的定位问题。

iOS

4.1 UIButton

在iOS系统中UIButton表示按钮控件。

4.2 UILabel

在iOS中使用UILable表示文本展示控件。与TextView属性类似。在屏幕上布局一个UILable需要指定控件所处的坐标轴位置。

4.3 UITextField

UITextField在iOS系统中是文本输入框控件。对应Android系统中的EditText文本输入框控件。

与“hint”属性一样的叫做“placeholder”,表示文本提示信息。

4.4 UIImageView

在iOS系统中使用UIImageView作为图片展示的基础控件。

4.5 UITableView

UITableView表示列表型控件。

与ListView的不同之处在于:UITableView的可扩展性较高,例如:执行微信中的左滑操作,出现删除和备注两个选项,这就是对UTableView的自定义扩展。和ListView类似,UITableView中的每一行叫作“cell”,可以对cell进行自定义布局。

4.6 UICollectionView

UICollectionView是iOS系统中进行表格展示的控件,和GridView类似,iPhone的系统相册就是使用UICollectionView实现的。瀑布流设计,也是使用的自定义UICollectionView。

4.7 iOS界面布局原理

iOS界面布局与Android不同,iOS使用的是绝对布局,也就是说,每一个控件在界面上是通过指定控件的绝对位置进行显示的。


iO界面坐标轴

iPhone屏幕物理分辨率是其逻辑像素的两倍。iOS界面坐标轴的长度与宽度是根据屏幕的逻辑像素表示。

苹果在技术上也推出了类似Android布局方式的相对布局,通过响应式布局来调节界面控件的显示方式。

4.8 iOS系统权限控制

iOS系统权限在开发阶段不需要声明,而是在使用阶段由用户授权。

4.9 iOS应用打包及发布

iOS应用打包是通过苹果推出的开发工具Xcode。

通过Xcode上传安装包至App Store后,需要等待苹果的审核人员对应用进行测试和审核,这个周期一般为一周左右,审核成功后则可以通过App Store下载应用。如果审核失败,修改后可重新提审,若遇到特殊情况需要加急审核,也可以填写申请加急审核的申请表,苹果审核人员会根据具体情况判断是否受理加急审核,若受理则审核周期可缩短至一到两天。

另一种发布方式是发布内部测试版,这种方式是在指定的测试设备商安装应用包。这种方式是有限授权的方式,苹果会给具备开发资格的开发者账户授权,每个账户能开通有限的测试设备。

要想提供给所有用户使用,必须发布至App Store,以应用安装包的方式安装是在则是设备上安装扩展名为“.ipa”的文件。

苹果的开发者证书分为三种:

(1)个人开发者:开发商署名为个人的开发者。

(2)公司开发者:开发商署名为公司的开发者。申请公司开发者需要提供公司的相关证明材料。

(3)企业开发者:企业开发者可以自行打包并发布应用,简单说,企业发布者可以自己开发并绕过AppStore提供App下载,但只能在有限的范围内。企业开发者类型往往是提供给企业内部作为内部App开发和下载使用。

个人与公司类型的账户是99美金/年,企业类型的账户是299美金/年。

Web

5.1 Web基础技术知识

每一个Web页都有一个唯一的地址,不同的地址组合在一起,通过链接相互跳转,最终形成一个网站系统。我们使用的各种网站,需要通过网站的域名进入,所谓域名就是每个网站的唯一性地址。

Web页面也有自己的编程语言,我们通过HTML语言制作Web页面,通过CSS样式表对Web页面进行美化。H5页面就是一种通过Web技术实现的适配移动设备的产品形态。

在移动端App中使用Web加载的方式打开Web页面,就可以将Web页面嵌入移动App中,实现二者的互相混合。这种方式对一些变化比较频繁的产品页面是一种较好的技术方案(修改Web页面的内容不需要重新发布一个新版本的App),但是如果要修改某个App的本地功能。就需要修改App的本地代码然后重新发布一个版本。使用Web的好处是能轻量化产品实现,而且能够动态灵活地调整产品内容。劣势就是Web页面的体验感和流畅度和原生的App实现还有一定的差距,所以频次高而且内容相对固定的,可以选择原生App。使用频次低而且内容变化比较快的通过Web实现。

5.2 网站的骨骼和外衣HTML/CSS

HTML全称超文本标记语言。超文本的意思是它能表现的内容不仅是文本,还可以是图片、链接、音乐等非文字元素,标记语言是对HTML特性的一种描述,HTML语言的语法结构是通过一个个的标签标记体现的。

一个网站的结构往往包括“头”和“主体”,头部的内容使用标签<head></head>标记,第一个head标签是指标签的开头,第二个带斜线的标签标示标签结尾,头部的内容就放在头尾标签之间。

头部主要存放一些网页信息,例如网页标题和网页描述等。主体部分用<body></body>表示,网页的内容全部放在body标签内。整个的网页内容都会放到一个顶层标签<html></html>中。

<html>

<head ></head>

<body>

</body>

</html>

示范

CSS全程层叠样式表,是一种将网页内容与网页样式分离的技术,简单的说,CSS是给只有内容的HTML页面穿衣服,让HTML页面好看起来。

5.3 URL/HTTP

URL全称统一资源定位符,互联网上所有的资源都有一个唯一的URL地址,资源的类型可以是一个网页、一张图片、一首歌或一段视频。通过URL标记每一个资源,就可以通过浏览器很方便的访问到这些资源。

打开浏览器时,地址栏中的地址其实就是一个完整的URL,随着访问页面的不同,地址栏里的URL也会随之变化,一个网站往往由很多资源构成,这些资源通过网站组合在一起。通过网站的主域名进入,就可以访问该网站下的所有资源。

HTTP协议是互联网应用最广泛的一种网络协议,所有的WWW服务都必须遵守HTTP协议。HTTP是一个标准协议,设计之初是为了定义一个标准用来传递和接收HTML页面。在如今,HTTP是客户端与服务端通信的基本协议,使用客户端和服务端进行功能交互和信息传递都是基于HTTP协议。(HTTP协议是一种基于状态的协议,即协议本身可以对操作的状态进行标识)。例如:用户在做登录的操作时,基于HTTP协议向服务器发送登录请求,服务器接收到请求后处于待相应状态,处理完成后再基于HTTP请求将处理结果返回给客户端。

HTTP协议工作于客户端-服务端架构为上。浏览器作为HTTP客户端通过URL向HTTP服务端即WEB服务器发送所有请求。Web服务器根据接收到的请求后,向客户端发送响应信息。

HTTPS,在浏览器中使用网银或者跟支付相关的服务时,浏览器的地址协议通常是“https://”开头的,HTTPS是基于加密协议的传输协议,其加密方式就是OpenSSL组织研发的SSL加密方式。URL和HTTP为互联网里所有的资源定义了唯一定制并制定了传输协议,使得互联网服务能以统一的标准运转。

浏览器作为HTTP客户端通过URL向HTTP服务端即WEB服务器发送所有请求。Web服务器根据接收到的请求后,向客户端发送响应信息。

应用程序一般有两种模式:B/S、C/S

C/S是客户端/服务器端程序,也就是说这类程序一般独立运行。而B/S就是浏览器端/服务器端应用程序,这类应用程序一般借助谷歌,火狐等浏览器来运行。WEB应用程序一般是B/S模式。Web应用程序首先是“应用程序”,和用标准的程序语言,如java,python等编写出来的程序没有什么本质上的不同。

5.4 Web APP和Native App

移动App的实现有两种形态,一种是通过Web的方式实现,也就是在App内部通过加载Web网页的方式实现产品功能;另一种是Native或者叫原生的方式实现,这种方式是使用移动平台原生的空间开发而成。现在所有的产品都是使用Web和Native混合实现的方式,混合实现是指在一个原生App产品中嵌套一部分Web实现,这种App叫作 Hybrid App。

5.5 Cookie和Session

Cookie与Session,实际上都是一种会话存储技术,区别在于Cookie是将信息存储在本地,而Session是将信息存储在服务端。

通过Cookie,可以实现广告推送的精准化等操作。Session存储信息不会随客户端的更换而丢失,将数据信息存储在服务端,存储的方式可以是文件也可以是数据库。

5.6 如何判断产品问题是否出自客户端

首先,根据客户端出现问题时,提示的异常信息判断。例如:提示网络异常和提示数据加载失败是两个完全不同的信号,网络异常有可能是用户当前设备所处的网络环境不佳。如果是数据加载失败,有可能是客户端在向服务端发送请求时,数据返回有误或者数据显示有误,问题可能出自服务端,也坑时服务端修改了数据字段导致客户端解析失败。列表中显示的数据有重复想,而且每次都能复现,这极有可能是服务端返回数据时返回了两个一样的。同时也有可能是客户端在解析数据加载显示时的问题,把一个数据展示了两次。即可以先向服务端工程师确定返回的数据是否正确,如果确定无误,那问题肯定就出现在客户端解析和展示数据的环节,直接与客户端工程师沟通解决问题。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,463评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,868评论 3 391
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 161,213评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,666评论 1 290
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,759评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,725评论 1 294
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,716评论 3 415
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,484评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,928评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,233评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,393评论 1 345
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,073评论 5 340
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,718评论 3 324
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,308评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,538评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,338评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,260评论 2 352

推荐阅读更多精彩内容