cv::mat边界扩展_安全和可扩展：JAMstack简介

cv::mat边界扩展

If you're a web developer, chances are you have heard the term "JAMstack." Curiously, JAMstack isn't a solution to prevent clogged printers, something to eat on toast, or a way to make music. However, by the time you finish reading this tutorial, you'll understand JAMstack and its benefits, and learn one approach to implementing JAMstack for yourself. Let's get ready to JAM.

如果您是Web开发人员，那么您很可能听说过“ JAMstack”一词。 奇怪的是，JAMstack并不是防止打印机堵塞，在烤面包上吃东西或制作音乐的方法。 但是，当您阅读完本教程时，您将了解JAMstack及其好处，并学习一种自行实现JAMstack的方法。 让我们为JAM做好准备。

The "JAM" in JAMstack stands for JavaScript, APIs, and Markup. JAMstack’s pattern of architecture makes web applications less expensive to build and more secure, with better performance and scalability.

JAMstack中的“ JAM”代表JavaScript，API和标记。 JAMstack的体系结构模式使Web应用程序的构建成本更低，更安全，并具有更好的性能和可伸缩性。

JAMstack does not dictate you switch to any particular technology. You can use any JavaScript library or technology that compiles to JavaScript (e.g. TypeScript, Elm, Clojure, or WebAssembly). JavaScript can fetch data or send updates to third-party APIs, your own API, Serverless functions, or any combination of APIs. For managing content, you can choose from a variety of static site generators, such as Hugo, GatsbyJS, Jekyll, Next.js, Nuxt.js, or VuePress, and write content using Markdown or any other markup system that renders as HTML.

JAMstack并不要求您切换到任何特定技术。 您可以使用可编译为JavaScript的任何JavaScript库或技术（例如TypeScript，Elm，Clojure或WebAssembly）。 JavaScript可以获取数据或将更新发送到第三方API，您自己的API，无服务器功能或API的任意组合。 为了管理内容，您可以从多种静态站点生成器中进行选择，例如Hugo，GatsbyJS，Jekyll，Next.js，Nuxt.js或VuePress，然后使用Markdown或任何其他呈现为HTML的标记系统编写内容。

JAMstack速度快，可扩展且价格便宜 ( JAMstack is Fast, Scalable, and Less Expensive )

Traditional web applications and Content Management Systems (CMS) rely on server-side code to render and return HTML on every request. Often times, these systems include a database or other type of dynamic storage, adding another layer of latency. Scaling a traditional system with more servers and ensuring high availability is no trivial task. Add to this the complexity of caching, such as invalidating the cache when content or code changes, and it's a recipe for heartburn.

传统的Web应用程序和内容管理系统（CMS）依靠服务器端代码来呈现和返回每个请求HTML。 通常，这些系统包括数据库或其他类型的动态存储，从而增加了另一层延迟。 扩展具有更多服务器的传统系统并确保高可用性并非易事。 除此之外，还增加了缓存的复杂性，例如在内容或代码更改时使缓存无效，这是导致胃灼热的秘诀。

With the JAMstack approach, every page is compiled (or built) ahead of time when the application is deployed. All the HTML, JavaScript, CSS, and images required for the application are fully "baked" ahead of time.The goal is to avoid as much server executed code as possible because serving static files is faster and far simpler than executing server-side code.

使用JAMstack方法，可以在部署应用程序之前提前编译（或构建）每个页面。 应用程序所需的所有HTML，JavaScript，CSS和图像都可以提前完全“烘焙”。目标是尽可能避免服务器执行代码，因为提供静态文件比执行服务器端代码更快，更简单。 。

These static files can additionally be globally cached across a Content Delivery Network (CDN). Most of the traffic falls on the CDN at dramatic cost savings over maintaining your own server infrastructure. In addition, visitors receive content from servers that are located closest to them, which can have a big impact on responsiveness, satisfaction, and conversions!

这些静态文件还可以跨内容分发网络（CDN）全局缓存。 与维护您自己的服务器基础结构相比，大部分流量都以CDN成本节省下来。 此外，访问者会从距离他们最近的服务器接收内容，这可能会对响应性，满意度和转换产生重大影响！

JAMstack更安全 ( JAMstack is More Secure )

Traditional server-side and CMS applications expose lots of APIs and services to allow administrators to manage data and content. All of these are at risk of attack and require continuous effort to patch and maintain.

传统的服务器端和CMS应用程序公开许多API和服务，以允许管理员管理数据和内容。 所有这些都有遭受攻击的风险，需要不断努力修补和维护。

On the other hand, static files are read-only and not susceptible to the same types of attacks. There is no code to run, so no vulnerabilities to exploit!

另一方面，静态文件是只读的，不会受到相同类型的攻击。 没有代码可运行，因此没有漏洞可利用！

Even "A" in JAMstack (APIs) exposes a minimal attack surface area because there's less code to secure and maintain and yourapplication can use APIs provided by a third-party. Presumably, any third-party service will diligently monitor and maintain the security and availability of their services.

甚至JAMstack（API）中的“ A”也暴露了最小的攻击面，因为需要保护和维护的代码更少，并且您的应用程序可以使用第三方提供的API。 据推测，任何第三方服务都将努力监控并维护其服务的安全性和可用性。

使用Hugo构建您的第一个JAMstack ( Build Your First JAMstack with Hugo )

Most JAMstack applications start with a decision on how to manage content and generate static resources. There are lots of options available in almost every programming language. StaticGen is a curated list of static site generators and a great starting place for research.

大多数JAMstack应用程序首先要决定如何管理内容和生成静态资源。 几乎每种编程语言都有很多选项可用。 StaticGen是静态站点生成器的精选列表，也是进行研究的理想起点。

In this tutorial, we are going to use Hugo. It's extremely fast and flexible. It's written in Go, but it's not likely you'll need to learn the Go language to customize it for your needs.

在本教程中，我们将使用Hugo 。 它非常快速和灵活。 它是用Go语言编写的，但您不一定需要学习Go语言以根据需要对其进行自定义。

先决条件 (Prerequisites)

To complete this tutorial, there are a few things you will need.

要完成本教程，您需要做一些事情。

• Depending on your operating system:
  • Windows: Chocolatey
  • macOS: Homebrew
  • Linux: Linuxbrew
  取决于您的操作系统：
  • Windows ： 巧克力色
  • macOS ： 自制软件
  • Linux ： Linuxbrew
• Git
  吉特
• If you don't already have a favorite code editor, install Visual Studio Code
  如果您还没有喜欢的代码编辑器，请安装Visual Studio Code。
• A free Okta Developer Account
  免费的Okta开发人员帐户

安装雨果 (Install Hugo)

The first step is to install Hugo. Hugo is a command-line interface (CLI) application that you will run in a command prompt, terminal, or PowerShell.

第一步是安装Hugo。 Hugo是一个命令行界面（CLI）应用程序，您将在命令提示符，终端或PowerShell中运行。

巧克力色（Windows） (Chocolatey (Windows))

chocoinstall hugo -confirm

自制（macOS）或Linuxbrew（Linux） (Homebrew (macOS) or Linuxbrew (Linux))

brewinstall hugo

创建一个新的Hugo应用程序 (Create a New Hugo Application)

In your terminal, change to a folder where you want to store your new application. Then, use the Hugo CLI to create the application.

在终端中，切换到要存储新应用程序的文件夹。 然后，使用Hugo CLI创建应用程序。

hugo new site jamstack-demo

The previous command will create a new folder named jamstack-demo.

上一个命令将创建一个名为jamstack-demo的新文件夹。

使用Git向Hugo添加主题 (Add a Theme to Hugo using Git)

There are a lot of great themes available for Hugo (see themes.gohugo.io for more examples). In this tutorial, you will use the Tranquilpeak theme.

雨果有很多很棒的主题（有关更多示例，请参见themes.gohugo.io ）。 在本教程中，您将使用Tranquilpeak主题。

cd jamstack-demo
git init
git submodule add https://github.com/kakawait/hugo-tranquilpeak-theme.git themes/hugo-tranquilpeak-theme

更新雨果配置 (Update Hugo Configuration)

Open the jamstack-demo project in your favorite code editor. Under the folder /themes/hugo-tranquilpeak-theme/exampleSite, you should see a file named config.toml. Open this file, select/highlight all the content, and copy the content.

在您喜欢的代码编辑器中打开jamstack-demo项目。 在/themes/hugo-tranquilpeak-theme/exampleSite文件夹下，您应该看到一个名为config.toml的文件。 打开此文件，选择/突出显示所有内容，然后复制内容。

Next, open the site's /config.toml file, delete the current configuration, and paste in the configuration from the theme's example site. Feel free to update the title or the author information.

接下来，打开站点的/config.toml文件，删除当前配置，然后从主题的示例站点粘贴配置。 随时更新标题或作者信息。

建立新讯息 (Create a New Post)

In your terminal, use the Hugo CLI app to create a new post.

在您的终端中，使用Hugo CLI应用程序创建一个新帖子。

hugo new post/hello-world.md

In your editor, you will find the new post under /content/post/hello-world.md. Hugo uses Markdown for managing content. At the top of the Markdown file is the "front matter" or metadata about the post - add some content to the file below the front matter and save the file.

在编辑器中，您将在/content/post/hello-world.md下找到新的帖子。 Hugo使用Markdown来管理内容。 Markdown文件顶部是有关帖子的“前件”或元数据-在前件下面的文件中添加一些内容并保存文件。

---
title: "Hello World"
date: 2019-08-20T12:55:13-04:00
draft: true
---

Hey! This is my first post in Hugo!

启动雨果服务器 (Launch the Hugo Server)

Go back to your terminal and launch the Hugo web server with the following command. Hugo will build the site and start a local web server you can use for testing.

返回终端并使用以下命令启动Hugo Web服务器。 Hugo将构建站点并启动可用于测试的本地Web服务器。

hugo server -D

Open your browser and navigate to the URL output at the terminal. By default, this should be http://localhost:1313. Switch back to your editor, make a change to the post, and save the file. Hugo should detect the change and automatically refresh the web site!

打开浏览器并导航到终端上的URL输出。 默认情况下，它应该是http://localhost:1313 。 切换回您的编辑器，更改帖子，然后保存文件。 Hugo应该检测到更改并自动刷新网站！