热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

《第三方JavaScript编程》——第1章第三方JavaScript介绍1.1第三方JavaScript的定义...

本节书摘来自异步社区《第三方JavaScript编程》一书中的第1章,第1.1节,作者:[美]BenVinegarAntonKovalyo

本节书摘来自异步社区《第三方Javascript编程》一书中的第1章,第1.1节,作者:[美] Ben Vinegar Anton Kovalyov著,更多章节内容可以访问云栖社区“异步社区”公众号查看

第1章 第三方Javascript介绍

本章包括

  • 第三方Javascript的定义
  • 几个第三方应用实例
  • 实现一个简单的嵌入式微件
  • 了解第三方开发的挑战

第三方Javascript是一种Javascript编程模式,可以用来创建高度分布式的Web应用程序。常规的Web应用需要通过一个特定的Web地址访问,而第三方Javascript创建的应用,只需要引入一些简单的Javascript脚本就可以加载到任意页面上。

你之前也许就曾遇到过第三方Javascript。例如广告脚本,它可以在发布者网站上生成、定向投放广告。用户也许并不喜欢广告脚本,但是它却能帮助网站发布者获得收入并维持网站的运转。成千上万的网站上都能看到广告的身影。事实上,几乎所有的广告都是从单独的广告服务器加载的第三方脚本。

开发者通过第三方Javascript可以解决许多问题,广告脚本仅是其中的一个使用场景。一些开发者用它们来创建独立的产品以满足网站发布者的需要。例如,位于旧金山的一个初创公司(Disqus)所开发的第三方评论应用,为Web发布者提供即时评论系统。本书的作者也是该公司的员工。还有一些开发者通过开发第三方Javascript来扩展传统Web应用,从而获得其他网站的用户。例如,Facebook和Twitter开发了数十个社交微件展示在发布者的网站上。这些微件能够帮助社交网站在它们应用的正常系统之外扩展用户的规模。

小公司也可以受益于第三方Javascript。比方说,你是一家B2B(business to business)Web应用的所有者,需要通过Web表单收集客户的信息。可能有一些潜在用户想使用你的应用,但是他们会犹豫,因为这样会把自己的用户重定向到一个外部的网站。通过第三方Javascript,就可以让你的客户直接在他们自己的Web页面上加载你的应用,从而解决他们所顾虑的重定向问题。

第三方Javascript并非表面看起来那么光鲜。写这些应用并非易事。在公开发布第三方Javascript代码之前你需要克服很多困难。值得庆幸的是,本书会完整介绍第三方应用的开发过程,足以让你明白如何解决这些问题。

但是,当我们深入了解第三方Javascript之前,需要先了解一些基础知识。为了便于理解,本章首先为第三方Javascript下一个定义,其次了解一些公司在现实世界中的实现方法,再看一个简单的第三方应用实现的示例,最后谈论关于第三方应用开发面临的诸多挑战。

让我们开始更好地了解第三方Javascript是什么,并且能够用它来做什么吧!

1.1 第三方Javascript的定义

在一个典型的软件交换过程中,有两类重要的参与者:第一类是操作软件的使用者,第二类是软件的提供者或者作者。

在网络上,你可能认为操作浏览器的用户是第一部分。当他们访问一个Web页面时,浏览器会向内容提供者发起相应的请求。内容提供者为第二部分,它从对应的服务器向用户的浏览器回传Web页面所需的HTML、图片、样式表和脚本文件。

针对这样特别简单的Web传输过程,可能只有两个参与者。但是,如今大部分网站都提供着包含其他来源的内容,或者说是第三方的内容。如图1.1所示,第三方可能提供任何内容,从文章内容到头像存储,再到内嵌视频。从严格意义上讲,任何除了网站提供者之外的组织向客户端提供的内容都被认为是第三方的。
screenshot
如果把“第三方服务”单纯归类为提供Javascript代码,那么这个定义会很混乱。对于第三方Javascript究竟如何构成,许多开发者执不同的意见。一些开发者将它归类为不仅仅为作者提供服务的Javascript代码。这将会包括众多流行的JS库,如jQuery和Backbone.js。甚至从Stack Overflow这样的网站粘贴的解决方案也被包括在内,任何不是网站作者自己编写的代码都会被归类在这种定义之下。

其他开发者倾向于把从第三方服务器加载的代码认为是第三方Javascript,即并不在内容提供者控制范围内的代码。原因在于,内容提供者管理的代码是在他们控制范围内的:内容提供者可以选择加载代码的时机,有权限对代码进行修改,最终他们对代码的行为负责。这与单独加载来自于第三方服务器的代码不同,第三方代码不能被内容提供者修改,而且可能随时发生改变,并不通知给使用者。下面,通过一个内容提供者HTML页面的示例,展示如何从本地和外部服务器加载Javascript文件。
程序清单1.1 Web页面从本地和外部加载脚本的示例
screenshot
两种定义没有对与错之分,你可以对其中任意一种定义的解释提出质疑。但是,基于本书的目的,我们对后者的定义更感兴趣。当我们提及第三方Javascript时,我们即认为代码是如下状态。

  • 并非由内容提供者所编写。
  • 从外部服务器获取且在内容提供者控制外围之外。
  • 编写代码的意图是作为内容提供者网站的一部分被执行。

那么TYPE="TEXT/Javascript"去哪里了呢?你可能已经注意到了在这个例子中

到目前为止,我们已经了解了如何从内容提供者网站上加载第三方脚本。让我们改变一下角色,作为第三方Javascript的开发者,我们期望在内容提供者网站上执行我们编写的脚本。为了把代码引入到提供者的网站,我们需要提供HTML代码片段插入到他们的页面中,从而使内容提供者的网站可以从我们的服务器加载Javascript文件,如图1.2所示。我们并不隶属于网站提供者,我们仅仅是在他们的页面上加载脚本来为他们提供辅助性的库或者有用的自包含应用。
screenshot
如果你还在不知所措,不必过于担心。理解第三方脚本最简单的方式就是在实践中去锻炼。在接下来的部分,我们会介绍一些第三方脚本的真实案例,如果到了那时你还是像现在一样困惑,那么我们就真的算得上是三流技术作者了。



推荐阅读
  • Web开发框架概览:Java与JavaScript技术及框架综述
    Web开发涉及服务器端和客户端的协同工作。在服务器端,Java是一种优秀的编程语言,适用于构建各种功能模块,如通过Servlet实现特定服务。客户端则主要依赖HTML进行内容展示,同时借助JavaScript增强交互性和动态效果。此外,现代Web开发还广泛使用各种框架和库,如Spring Boot、React和Vue.js,以提高开发效率和应用性能。 ... [详细]
  • 作为140字符的开创者,Twitter看似简单却异常复杂。其简洁之处在于仅用140个字符就能实现信息的高效传播,甚至在多次全球性事件中超越传统媒体的速度。然而,为了支持2亿用户的高效使用,其背后的技术架构和系统设计则极为复杂,涉及高并发处理、数据存储和实时传输等多个技术挑战。 ... [详细]
  • Python 实战:异步爬虫(协程技术)与分布式爬虫(多进程应用)深入解析
    本文将深入探讨 Python 异步爬虫和分布式爬虫的技术细节,重点介绍协程技术和多进程应用在爬虫开发中的实际应用。通过对比多进程和协程的工作原理,帮助读者理解两者在性能和资源利用上的差异,从而在实际项目中做出更合适的选择。文章还将结合具体案例,展示如何高效地实现异步和分布式爬虫,以提升数据抓取的效率和稳定性。 ... [详细]
  • C++ 异步编程中获取线程执行结果的方法与技巧及其在前端开发中的应用探讨
    本文探讨了C++异步编程中获取线程执行结果的方法与技巧,并深入分析了这些技术在前端开发中的应用。通过对比不同的异步编程模型,本文详细介绍了如何高效地处理多线程任务,确保程序的稳定性和性能。同时,文章还结合实际案例,展示了这些方法在前端异步编程中的具体实现和优化策略。 ... [详细]
  • 本文探讨了使用JavaScript在不同页面间传递参数的技术方法。具体而言,从a.html页面跳转至b.html时,如何携带参数并使b.html替代当前页面显示,而非新开窗口。文中详细介绍了实现这一功能的代码及注释,帮助开发者更好地理解和应用该技术。 ... [详细]
  • 本文全面解析了JavaScript中的DOM操作,并提供了详细的实践指南。DOM节点(Node)通常代表一个标签、文本或HTML属性,每个节点都具有一个nodeType属性,用于标识其类型。文章深入探讨了DOM节点的创建、查询、修改和删除等操作,结合实际案例,帮助读者更好地理解和掌握DOM编程技术。 ... [详细]
  • 在使用 jQuery 的 `html()` 方法时,我发现了一个奇怪的现象:该方法无法完整地插入指定的字符串内容。具体来说,当尝试插入较长或包含特殊字符的字符串时,部分内容可能会被截断或丢失。这一问题可能与 jQuery 对字符串的处理方式有关,建议在实际应用中进行充分测试以确保数据完整性。 ... [详细]
  • 本文详细介绍了 jQuery 的入门知识与实战应用,首先讲解了如何引入 jQuery 库及入口函数的使用方法,为初学者提供了清晰的操作指南。此外,还深入探讨了 jQuery 在实际项目中的多种应用场景,包括 DOM 操作、事件处理和 AJAX 请求等,帮助读者全面掌握 jQuery 的核心功能与技巧。 ... [详细]
  • 提升开发技能的八大策略与方法
    许多前端开发人员和客户都在寻求具备创新和技术能力的专业人才,但往往由于缺乏足够的曝光度和声誉,这些人才难以被潜在客户发现。本文将介绍八种有效策略和方法,帮助开发者提升技能并增强市场竞争力。 ... [详细]
  • TypeScript 实战分享:Google 工程师深度解析 TypeScript 开发经验与心得
    TypeScript 实战分享:Google 工程师深度解析 TypeScript 开发经验与心得 ... [详细]
  • 本文深入剖析了jQuery的架构设计与实现原理。jQuery的总体结构采用了一个自执行匿名函数的形式,该函数接收`window`和`undefined`作为参数,并在内部定义了一个局部的jQuery副本,以确保其内部变量和方法不会污染全局命名空间。这种设计不仅提高了代码的封装性和安全性,还使得jQuery能够更好地与其他JavaScript库兼容。通过详细分析这一架构,读者可以更好地理解jQuery的核心机制及其高效运行的原理。 ... [详细]
  • 《精通 jQuery》第六章:深入解析与实战应用
    《精通 jQuery》第六章:深入解析与实战应用本章详细探讨了 Ajax 技术的核心机制及其实际应用。Ajax 通过 XMLHttpRequest 对象实现客户端与服务器之间的异步数据交换,从而在不重新加载整个页面的情况下更新部分内容。这种技术不仅提升了用户体验,还提高了应用的响应速度和效率。此外,本章还介绍了如何利用 jQuery 简化 Ajax 操作,并提供了多个实战案例,帮助读者更好地理解和掌握这一重要技术。 ... [详细]
  • 本文详细解析了JSONP(JSON with Padding)的跨域机制及其工作原理。JSONP是一种通过动态创建``标签来实现跨域请求的技术,其核心在于利用了浏览器对``标签的宽松同源策略。文章不仅介绍了JSONP的产生背景,还深入探讨了其具体实现过程,包括如何构造请求、服务器端如何响应以及客户端如何处理返回的数据。此外,还分析了JSONP的优势和局限性,帮助读者全面理解这一技术在现代Web开发中的应用。 ... [详细]
  • jQuery Flot 数据可视化插件:高效绘制图表的专业工具
    jQuery Flot 是一款高效的数据可视化插件,专为绘制各种图表而设计。该工具支持丰富的图表类型和自定义选项,适用于多种应用场景。用户可以通过其官方网站获取示例代码和下载资源,以便快速上手和使用。 ... [详细]
  • 当前,众多初创企业对全栈工程师的需求日益增长,但市场中却存在大量所谓的“伪全栈工程师”,尤其是那些仅掌握了Node.js技能的前端开发人员。本文旨在深入探讨全栈工程师在现代技术生态中的真实角色与价值,澄清对这一角色的误解,并强调真正的全栈工程师应具备全面的技术栈和综合解决问题的能力。 ... [详细]
author-avatar
果粒仙子妹妹
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有