资讯专栏INFORMATION COLUMN

PHP、Android、iOS 的恩恩怨怨

big_cat / 621人阅读

摘要:注意对这个有点不兼容,所以,谨慎,,,安卓均可以实现获取版本信息这里需要判断系统类型及版本所以,由此可见其实这里的判断会很多,很多,很多。

其实应该更多的是互相的磨合与学习,希望身边的人可以有自己的经验分享,与理解,互相进步才是大家需要的,作为一个 "年老" (我也是90后) 的开发者,我觉得一代胜一代,未来才有胜算。额,好了,我不充当老师的角色了,去正题。

1. 安卓中 a 标签的坑

在和客户端交互的过程中,往往都有跳转的,而在咱们 Web 开发中,默认的 href 属性通常是 #,然后通过获取标签绑定动作触发事件,这里有个坑,在与安卓交互过程中会发现。

</>复制代码

  1. click me
  2. // include zepto or jquery or other.
  3. $(function () {
  4. $("a").on("tap, click", function () {
  5. alert("test");
  6. return false;
  7. });
  8. });

上述代码中,会引起安卓交互中的一个坑,就是没点击一次,安卓都会在计数器上+1, 也就是,点击第一次,弹一次窗,点击第二次,会弹两次窗,如此类推。

解决方法:

</>复制代码

  1. click me

Fxied!!

2. 安卓中交互的坑

我丢,安卓这个坑爹,在 js 交互中,无法传递对象,匿名函数等等的类型。也就是说,如果你的参数是接受一个对象的,你必须将她转成 String,而且安卓中的返回值也是只能返回 String,在咱们接受之后需要将字符串转换成对象。

简单 判断客户端类型的:

</>复制代码

  1. isiOS: function () {
  2. if (this.ua.match(/android/i) == "android") {
  3. return false;
  4. }
  5. return true;
  6. },
  7. isAndroid: function () {
  8. if (this.ua.match(/android/i) == "android") {
  9. return true;
  10. }
  11. return false;
  12. }

解决方法:

</>复制代码

  1. encode: function (data) {
  2. if ("" == data) {
  3. return {};
  4. }
  5. return JSON.stringify(data).replace(/"/g, """);
  6. },
  7. decode: function (data) {
  8. if ("" == data) {
  9. return "{}";
  10. }
  11. return JSON.parse(data.replace(/"/ig,"""));
  12. }

在调用 iOS 或者 android 的时候,先将参数传递到 encode 处进行过滤。

3. 判断页面是否在应用内打开

其实这个很简单,经常做 web 开发的都应该知道,咱们每天都与 Http 协议打交道,而在 Http 中,有一个很重的的标识,就是 User-Agent,简称 UA,其实这个东西就像咱们的门票一样,有着各种的信息在上面,其实就包括了很多的浏览器内核信息,版本信息,厂商等等......咱们就是从这个地方入手,在客户端中定义自己的版本信息,与微信一样。从此告别什么 url 上加什么破参数啊什么的。

以我的经验来设计的话,一般按照这个格式:

Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_2_1 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8C148 Safari/6533.18.5 {company} {appname} [{type}]/{version}

如: 腾讯,微信 [海外版本] 6.0.0

Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_2_1 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8C148 Safari/6533.18.5 Tencent MicroMessager oversase/6.0.0

因为此处我还没太多接触客户端开发,暂时没有客户端代码演示.

</>复制代码

  1. us: window.navigator.userAgent.toLowerCase(),
  2. is: function (name) {
  3. return tools.ua.match(eval("/" + name + "/i")) == name ? true : false;
  4. }

Examples:

</>复制代码

  1. if (/* Is app inside */) {
  2. /* Operation */
  3. } else {
  4. /* Is app outside */
  5. /* Operation */
  6. }

Combine: In wechat

</>复制代码

  1. if (/* In wechat app */) {
  2. /* open share guide */
  3. } else {
  4. if (/* In app */) {
  5. if (/* Is iOS */) {
  6. /* share iOS sdk */
  7. } else {
  8. /* share android sdk */
  9. }
  10. } else {
  11. /* share operation */
  12. }
  13. }
4. 请善用你的 Http Status Code

曾几何时,我也是一个懵懂无知的骚年,连接口是干嘛用的都不知道,大概也在 2014/8 月份左右,我对接口都是一种很敬畏的眼光去看待,直到现在,2016年,我更加视接口是一切数据库的来源,其价值是最至高无上的。但是由我接触接口(Application Programing Interface)开发之后,我发现目前的接口有好多问题,一个很明显的就是,为啥每个接口都是 200,不应该啊,那非 200 响应的应该怎么办?有做处理吗?
直到后来,我推翻了这一现象,也说服了各方的人。我举一个 Ajax 的例子:

首先我先问一个问题,为何 jquery 和 zepto 的 ajax 中,都有一个 error 回调?

</>复制代码

  1. $.ajax({
  2. // some code
  3. success: function () {},
  4. error: function () {}
  5. });

请不要怀疑设计者的智商与知识,我猜他应该会比你聪明以及牛叉。这么做,肯定有原因的。其实这里的 error 就是为了让非 2xx 状态的时候进入的操作的。

如示例:

</>复制代码

  1. {
  2. status: 1
  3. content: {}
  4. }

以上例子本身没有错误,仅以自己看法对上述进行评述

其实咱们应该要善用本身已经有的东西,不需要再重新造多一个,吃力不讨好,那你们就开始好好补一补 Http Status code 相关的知识吧。

示例:

</>复制代码

  1. Request Method:GET
  2. Status Code:200 OK

200 一般都是成功响应,
3xx
4xx
5xx

根据不同的状态码进行不同的处理机制,无需重复再做这一步骤了,其实设计者也很清晰设计出状态码的意义,应该善用。

5. 判断应用是否安装,如果安装,则打开,否则则跳去下载

其实这个有点无理取闹,但是又不得不去做,首先这个其实原理也是挺绕的

利用iframe尝试打开自定义scheme

跳转到下载地址

只是那个判断......

其实我是建议这些操作统一由一个地方去做,比如定义一个域名叫: down.xxx.com/应用id,后台读取应用id 相信信息,统一由一处转发。

</>复制代码

  1. function open () {
  2. var ifr = document.createElement("iframe");
  3. ifr.src = url;
  4. ifr.style.display = "none";
  5. document.body.appendChild(ifr);
  6. window.setTimeout(function(){
  7. document.body.removeChild(ifr);
  8. }, 3000);
  9. }

注意 iOS9 对这个有点不兼容,所以,谨慎,iOS7,iOS8,安卓均可以实现

获取版本信息:

</>复制代码

  1. var getVersion = function () {
  2. if (tools.client.isAndroid()) {
  3. return parseFloat(tools.ua.match(/Androids(.*?);/i)[1]);
  4. }
  5. return parseFloat(tools.ua.match(/OSs(.*?)slike/i)[1].split("_").join("."));
  6. };

这里需要判断系统类型及版本:

</>复制代码

  1. if (/* iOS */) {
  2. if (/* iOS version less than 9.0 */) {
  3. /* try open scheme */
  4. /* redirect download link */
  5. } else {
  6. /* other operate */
  7. }
  8. } else {
  9. /* try open url */
  10. /* redirect download link */
  11. }

所以,由此可见其实这里的判断会很多,很多,很多。所以我墙裂建议都统一到一个地方做分发。

这里其实还需要判断是否微信,是否应用内打开,是否是分享出去的。

结合第 3 点的例子想想,这里的 if ...... 其实还是很恐怖的,我已经无路可退了......

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/21397.html

相关文章

  • PHPAndroidiOS 恩恩怨怨

    摘要:注意对这个有点不兼容,所以,谨慎,,,安卓均可以实现获取版本信息这里需要判断系统类型及版本所以,由此可见其实这里的判断会很多,很多,很多。 其实应该更多的是互相的磨合与学习,希望身边的人可以有自己的经验分享,与理解,互相进步才是大家需要的,作为一个 年老 (我也是90后) 的开发者,我觉得一代胜一代,未来才有胜算。额,好了,我不充当老师的角色了,去正题。 1. 安卓中 a 标签的坑 在...

    陆斌 评论0 收藏0
  • Lo-Dash 与 underscore,Prototype 与 jQuery,两段恩怨情仇

    摘要:一场恩怨,一段纷争,一段历史。后来崛起,并内置了库,从此一炮而红。可见,前端大战以的完胜而告终。无疑,在目前浏览器不完全兼容的情况下,提供的是操作的最佳选择。然而社区的意见偏向于,是唯一选择。的贡献者认为,现状不会改变。 这几天更新我的之前写的 Chrome 插件 ChromeSnifferPlus 可以探测正在使用的开源软件或者 js 类库,两天的时间增加了 20 多个 js 库的检...

    evin2016 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<