API和浏览器兼容性开发实践

Posted 2021-04-30 21CTO

21CTO导读：现在的应用开发都需要进行API开发，一起来看看API的兼容性和不同类型的API。

在开始浏览器中测试API的兼容性之前，我们首先了解API，知道它是如何真正工作的。如果不了解API的角色与功能，会进入一些困惑和巨大的技术旋涡，比如API版本和与浏览器兼容问题等时间的消耗。

我们查看维基百科定义时，你可能会发现一个很长的描述。

wikipedia上对API的定义

但简单来讲，它们就像是一个服务于你请求的餐厅的服务员。接受客户的请求并将此信息传递给数据中心（厨房）确认请求后并提供数据（食品）。

因此，如果各种代码想彼此之间进行交互，网站或APP如何知道用户想要从中请求某些内容？那么我们都需要一个API。

做为开发者，你更会在日常开发中遇到多种类型的API。每个API都有不同的职责，它们为不同的环境提供各种底层工作协议或独特的执行方法。

接下来，我们就来了解各种类型的API及其在各种浏览器中的支持情况。

API的类型

(1) Web服务API

这些API包括REST API，SOAP API，XML-RPC和JSON-RPC。这些API中最常见的是REST和SOAP，其中REST代表表述性状态转移（Representational State Transfer），SOAP代表简单对象访问协议（Simple Object Access Protocol）。

REST API在这两者中是首选，因为它比SOAP API增加了优势，它提供有一套标准的协议。如下：

源代码API：

这些API包括接口，基于库的API和基于类的API。

硬件API：

通过硬件进行通信，例如读取温度，流量，压力，湿度，类型信息等信息，这些都是在硬件API的帮助下完成的。但是，这些API独立于浏览器兼容性。

对象远程API：

这些API使用远程协议，如CORBA。

基于类的API：

数据和功能是围绕类来组织的，就像这些API中的面向对象语言一样。

2）WebSocket API：

在WebSocket API中，服务器不响应每个请求。一旦建立连接，它将发送事件驱动的响应，而无需等待服务器回复。

当你在服务器上使用这些API进行通信或数据交换时，可能会遇到某些问题，如API无法正常工作，重定向到某个错误页面，链接被断开等。

这些问题需要我们了解API浏览器兼容性的内容。API的浏览器兼容性是指针对不同的API支持不同的浏览器。因为随着浏览器的每次升级，会同时发生各种功能的弃用。这些弃用附加了各种标签，代码和技术支持，API开发者需要与它们保持同步。

比如你已经使用MediaStream扩展实现对WebRTC的支持。当我们进行跨浏览器测试时，你会发现无法在Chrome的高版本上查看事件。我们会一次又一次检查代码，但仍会继续面临相同的情况，如果我们知道Chrome 53更新版已弃用该扩展，需要使用MediaStreamTracks，你是什么样的感觉？笨啊！这其实不是太复杂的问题，但可能要花费很多时间。因此，有必要确保使用的API是浏览器兼容的。

源代码API兼容性问题

已弃用的SDK浏览器方法

SDK或开发者套件是程序员下载的套件使用某个API。此SDK包含程序员调用API所需的所有基本要素，并提供请求。现在，随着浏览器的每次升级，都会有各种技术被添加，有的技术都会被弃用。这些弃用的技术不包括对各种功能，工具，元素等的支持。

因此，正如我之前解释过的，就像MediaStreams一样，许多元素都会改变或者被弃用。因此，您需要掌握最新浏览器的功能，确保您没有在您的API中使用任何不支持的功能或元素，导致API浏览器不兼容。

REST API兼容性问题

在使用REST API时，你可能正在使用诸如GET，POST，PUT，DELETE，OPTIONS，PATCH等标准方法，但并非所有浏览器都支持这些方法。

比如，如果你使用的是getUserMedia / Stream API，那么可能会遇到与IE 11，ios Safari 10.3，Opera Mini等某些浏览器不兼容，以及Chrome 49，Samsung Internet 4等浏览器的部分兼容，因此如果使用此API可能会破坏API功能，用户请求将因通信断开而无法使用。

REST API和Websocket兼容性问题

跨域问题。当你尝试请求未授予访问权限的私有API或合作伙伴API时，可能会遇到交叉域源错误。

如果使用类似微信、淘宝、Twitter或Google的开放API，可能不会遇到此错误。

但是，如果你面临Access-Control-Allow-Origin错误，那么可能需要通过找到解决方案来解决这个问题。

阅读关于解决这个错误的更多信息，请到我们的网站上查阅。

源代码API问题

防火墙阻止特定文件的调用

当您使用某些API（如Google Web字体API）时，API会通过从网络或本地机器调用它们来呈现不同的文件。有时，防火墙会阻止这些请求，极可能会遇到不兼容问题。

在这种情况下，您需要确保每个API调用都有一个回退。

例如，你使用的是字体系列，并将第二字体设置为sans-serif。如果MyWebFont没有渲染，那么sans-serif将代替在它的位置渲染，以避免一些随机字体渲染。

1 2 3 body {font-family：'MyWebFont'，Fallback，sans-serif; }

其他API调用也是如此，需要我们对每个使用的元素进行回退。

你还可能在使用WebSocket时遇到浏览器兼容性问题，它在Opera Mini中不被支持，如下图中所示。

所以，这是一个与API相关联的世界，开发者需要确保这些API保持连接而没有任何漏洞，需要对API做兼容性测试以确保一致性。

祝你的API运行得更好！~