自从这个词 万维网 是在1990年创造的吗, web应用程序开发已经从提供静态HTML页面发展到完全动态, 复杂的业务应用.

今天我们有成千上万的电子版和印刷版 资源 它们提供了开发各种不同web应用程序的分步指导. 开发环境足够“聪明”，可以捕捉并修复早期开发人员经常遇到的许多错误. 甚至有许多不同的开发平台可以轻松地将简单的静态HTML页面转换为高度交互式的应用程序.

所有这些发展模式, 实践, 平台有共同的基础, 它们都容易出现类似的web开发问题，这些问题是由web应用程序的本质引起的.

这些web开发技巧的目的是阐明在web开发过程的不同阶段所犯的一些常见错误，并对您有所帮助 成为一个更好的开发者. 我已经触及了几个对几乎所有人都很常见的一般话题 web开发人员 例如验证、安全性、可伸缩性等 搜索引擎优化. 当然，您不应该被我在本指南中描述的特定示例所束缚, 因为列出它们只是为了让您了解可能遇到的潜在问题.

常见错误No. 1:不完整输入验证

在客户端和服务器端验证用户输入非常简单 必做的事! 我们都知道这个明智的建议 “不相信用户输入” 但是，尽管如此，由验证引起的错误还是经常发生.

这种错误最常见的后果之一是 SQL注入 在 OWASP top10 年复一年.

请记住，大多数前端开发框架都提供了开箱即用的验证规则，使用起来非常简单. 另外, 大多数主要的后端开发平台使用简单的注释来确保提交的数据符合预期的规则. 实现验证可能非常耗时, 但它应该是你标准编码实践的一部分，永远不要放在一边.

常见错误No. 2: 身份验证 Without Proper 授权

在我们继续之前，让我们确保我们在这两个术语上是一致的. 如《 10个最常见的网络安全漏洞:

身份验证: 验证一个人是(或至少看起来是)特定用户, 因为他/她已经正确地提供了他们的安全凭证(密码), 安全问题的答案, 指纹扫描, 等.).

授权: 确认特定用户有权访问特定资源或被授予执行特定操作的权限.

换一种说法, 身份验证就是知道实体是谁, 而授权是知道给定实体可以做什么.

让我用一个例子来说明这个问题:

假设你的浏览器将当前登录的用户信息保存在一个类似于下面的对象中:

{
    用户名:“猫王”,
    角色:“歌手”,
    令牌:“123456789”
}

当修改密码时，应用程序进行POST操作:

POST / changepassword /用户名/:newpassword

在你的 / changepassword 方法，则验证用户是否已登录，并且 令牌未过期. 然后找到用户配置文件 :用户名 参数，并更改用户密码.

So, 您验证了您的用户已正确登录, 然后你执行了他的请求修改了他的密码. 过程看起来不错，对吧? 不幸的是，答案是否定的!

此时，重要的是要验证执行操作的用户和更改密码的用户是相同的. 存储在浏览器上的任何信息都可以被篡改, 任何高级用户都可以轻松更新 用户名:“猫王” to 用户名:“管理员” 无需使用内置的浏览器工具.

在这种情况下，我们只是处理 身份验证 确保用户提供了安全凭证. 我们甚至可以添加验证 / changepassword 方法只能由 通过身份验证 用户. 但是，这仍然不足以保护您的用户免受恶意尝试.

您需要确保您验证了实际的请求者和请求的内容 / changepassword 正确的方法和实施 授权 确保用户只能更改她的数据.

身份验证 和 授权 是一枚硬币的两面吗. 永远不要把它们分开对待.

常见错误No. 3 .没有做好规模化的准备

在高速发展的今天, 创业加速器, 伟大的思想可以迅速传播到全球, 让你的MVP(最小可行产品)尽快投放市场是许多公司的共同目标.

然而, 这种持续的时间压力导致即使是优秀的web开发团队也经常忽略某些问题. 扩展通常是团队认为理所当然的事情之一. MVP的概念很好，但如果太过了，你就会遇到严重的问题. 不幸的是, 选择可扩展的数据库和web服务器，并将所有应用程序层分离到独立的可扩展服务器上是不够的. 如果你希望以后避免重写应用程序的重要部分，那么你需要考虑很多细节——这将成为一个主要的web开发问题.

例如, 假设您选择将用户上传的个人资料图片直接存储在web服务器上. 这是一个完全有效的解决方案——应用程序可以快速访问文件, 文件处理方法在每个开发平台中都可用, 您甚至可以将这些图像作为静态内容提供, 这意味着应用程序的最小负载.

但是当应用程序增长时会发生什么呢, 你需要在负载均衡器后面使用两个或更多的web服务器? 即使您很好地扩展了数据库存储, 会话状态服务器, 网络服务器, 您的应用程序的可伸缩性会因为像配置文件映像这样简单的事情而失败. 因此, 你需要实现某种文件同步服务(这将有延迟，并将导致暂时的404错误)或其他解决方案，以确保文件在你的web服务器上传播.

要避免这个问题，首先需要做的就是使用共享文件存储位置, 数据库, 或任何其他远程存储解决方案. 这可能会花费几个小时的额外工作来实现它, 但这样做是值得的.

常见错误No. 4:错误或遗漏搜索引擎优化

网站上不正确或缺失搜索引擎优化最佳实践的根本原因是 被误导的搜索引擎优化专家.” 许多web开发人员认为他们对搜索引擎优化了解得足够多，并不是特别复杂, 但事实并非如此. 掌握搜索引擎优化需要花费大量的时间来研究最佳实践和不断变化的规则, 必应, 雅虎索引网络. 除非你不断地进行实验，并有准确的跟踪和分析, 你不是搜索引擎优化专家, 你也不应该自称是.

此外，搜索引擎优化往往被推迟作为一些活动，在最后完成. 这需要付出高昂的web开发代价. 搜索引擎优化不仅仅是设置好的内容, 标签, 关键字, 元数据, 图像Alt标签, 站点地图, 等. 它还包括消除重复内容, 具有可抓取的站点架构, 有效的加载时间, 智能反向链接, 等.

比如可扩展性, 你应该从开始构建web应用程序的那一刻起就考虑搜索引擎优化, 或者你会发现完成你的搜索引擎优化实现项目意味着重写你的整个系统.

常见错误No. 5:请求处理程序中的时间或处理器消耗动作

这种错误的一个最好的例子是根据用户的操作发送电子邮件. 开发者常常认为制作一款 SMTP 直接从用户请求处理程序调用和发送消息是解决方案.

假设您创建了一个在线书店，您希望从每天几百个订单开始. 作为订单接收过程的一部分，每次用户发布订单时，您都会发送确认电子邮件. 这将在一开始没有问题, 但是当你扩展系统时会发生什么呢, 然后你突然收到了成千上万封发来确认邮件的请求? 您要么获得SMTP连接超时, 配额超出了, 或者您的应用程序响应时间显著降低，因为它现在正在处理电子邮件而不是用户.

当您尽快释放HTTP请求时，任何消耗时间或处理器的操作都应由外部进程处理. 在这种情况下, 你应该有一个外部邮件服务来接收订单和发送通知.

常见错误No. 6:没有优化带宽使用

大多数开发和测试都在本地网络环境中进行. 所以当你下载5张背景图片，每张都是3MB或更多, 在您的开发环境中，您可能无法识别1Gbit连接速度的问题. 但是当你的用户开始在他们的智能手机上通过3G连接加载一个15MB的主页时, 你应该准备好面对一系列的抱怨和问题.

优化带宽使用可以极大地提高性能, 为了获得这种提升，你可能只需要一些技巧. 许多优秀的web开发人员默认会做以下几件事:

1. 所有JavaScript的最小化
2. 所有CSS的缩小
3. 服务器端HTTP压缩
4. 优化图像大小和分辨率

常见错误No. 7 .未针对不同屏幕尺寸进行开发

响应设计 在过去的几年里一直是一个大话题. 不同屏幕分辨率的智能手机的扩展带来了许多访问在线内容的新方式, 这也带来了许多web开发问题. 来自智能手机和平板电脑的网站访问量每天都在增长, 而且这一趋势正在加速.

以确保无缝导航和访问网站内容, 您必须允许用户从所有类型的设备访问它.

构建响应式web应用程序有许多模式和实践. 每个开发平台都有自己的技巧和窍门, 但是有一些框架是独立于平台的. 最流行的可能是 Twitter引导. 它是一个开源和免费的HTML, CSS, JavaScript框架已经被各大开发平台所采用. 在构建应用程序时，只需坚持Bootstrap模式和实践, 你会得到一个响应式的web应用程序，一点也不麻烦.

常见错误No. 8:跨浏览器不兼容

在大多数情况下，开发过程都面临着巨大的时间压力. 每个应用程序都需要尽快发布，即使是优秀的web开发人员也往往更关注交付功能而不是设计. 尽管大多数开发人员都有Chrome浏览器, 火狐, 即安装, 他们在90%的时间里只使用其中一种. 在开发过程中使用一种浏览器是常见的做法，当应用程序接近完成时，您将开始在其他浏览器中测试它. 这是完全合理的——假设您有大量的时间来测试和修复在这个阶段出现的问题.

然而, 当你的应用程序进入跨浏览器测试阶段时，有一些web开发技巧可以为你节省大量时间:

1. You don’t need to test in all browsers during development; it is time consuming 和 ineffective. 然而，这并不意味着你不能频繁地切换浏览器. 每隔几天就换一个浏览器, 你至少会在开发阶段的早期发现主要问题.
2. 要小心使用统计数据来证明不支持浏览器的合理性. 有许多组织在采用新软件或升级方面进展缓慢. 在那里工作的成千上万的用户可能仍然需要访问您的应用程序, 由于内部安全和业务策略，他们无法安装最新的免费浏览器.
3. 避免特定于浏览器的代码. 在大多数情况下，存在跨浏览器兼容的优雅解决方案.

常见错误No. 9 .没有考虑可移植性

假设是一切问题之母! 当谈到可移植性时，这句话比以往任何时候都更加真实. 你在web开发中遇到过多少次像硬编码文件路径这样的问题, 数据库连接字符串, 或者假设某个库将在服务器上可用? 假设生产环境与您的本地开发计算机相匹配是完全错误的.

理想的应用程序设置应该是免维护的:

1. 确保您的应用程序可以扩展并在负载均衡的多服务器环境中运行.
2. 允许简单和清晰的配置-可能在单个配置文件中.
3. 当web服务器配置不符合预期时，处理异常.

常见错误No. 10 . RESTful反模式

RESTful api已经在web开发中占据了一席之地，并将继续存在下去. 几乎每个web应用程序都实现了某种类型的REST服务, 无论是内部使用还是与外部系统集成. 但是我们仍然看到一些不符合预期实践的RESTful模式和服务.

最常犯的两个错误是 编写RESTful API 是:

1. 使用错误的HTTP动词. 例如，使用GET来写数据. HTTP GET被设计成幂等且安全的, 这意味着无论在同一资源上调用GET多少次, 响应应该始终是相同的，应用程序状态不应该发生变化.

2. 没有发送正确的HTTP状态码. 此错误的最佳示例是发送响应代码为200的错误消息.

    HTTP 200 ok
    {
        消息:“有一个错误”
    }
   

当请求没有产生错误时，您应该只发送HTTP 200ok. 在出现错误的情况下, 你应该发送400, 401, 500或与发生的错误相对应的任何其他状态码.

可以找到标准HTTP状态码的详细概述 在这里.

总结

网络开发是一个非常广泛的术语，可以合理地包含网站的开发, web服务, 或者复杂的web应用程序.

本web开发指南的主要内容是提醒您应该始终小心身份验证和授权, 计划可伸缩性, 永远不要草率地假设任何事情——或者准备好处理一长串的web开发问题!