3分钟完成网站搭建

本文涉及的产品
函数计算FC,每月15万CU 3个月
全局流量管理 GTM,标准版 1个月
云解析 DNS,旗舰版 1个月
简介: 作为一个开发者,应该都能理解一个网站从开发到上线,要经过很多繁琐的步骤。编写代码,部署应用,部署数据库,申请域名,申请SSL证书,域名备案,到最终上线起码要几天时间。作为一个不精通代码的业务玩家,当你想搞个网站玩玩时,经常会被淘宝贵得离谱的报价吓跑。这两年Serverless的概念被炒得火热,顾名思义,“无服务”。今天的这篇文章,我想站在一个开发者的角度,带大家简单的体验下使用腾讯云Serverless来开发网站的整体流程。看看在Serverless的概念下,开发网站是不是变得更加简单了。


本文的主要内容:

  • Serverless概念解释
  • 3分钟部署一个网站
  • 10分钟开发一个在线RSS阅读小站
  • 腾讯Serverless Web Function的优缺点分析


首先放一个我部署好的RSS在线阅读器页面:

网络异常,图片无法展示
|

只要在url传入需要解析的RSS订阅地址,比如xxxx/rss?rssurl=blog.csdn.net/qqxx6661/rs… ,就可以解析出该RSS,并渲染成你想要的博客样式。

整个实现代码除了html模板,只需要4行代码。


Serverless概念



Serverless是一个怎样的运行原理呢?简单的解释下:

腾讯云云函数是腾讯云提供的 Serverless 执行环境。您只需编写简单的、目的单一的云函数即可将它与您的腾讯云基础设施及其他云服务产生的事件关联。

当然了,Serverless不是表示没有服务器,而表示当您在使用 Serverless 时,您无需关心底层资源,也无需登录服务器和优化服务器,只需关注最核心的代码片段,即可跳过复杂的、繁琐的基本工作。核心的代码片段完全由事件或者请求触发,平台根据请求自动平行调整服务资源。Serverless 拥有近乎无限的扩容能力,空闲时,不运行任何资源。代码运行无状态,可以轻易实现快速迭代、极速部署。

它的大致执行流程如下图:

网络异常,图片无法展示
|

所以,Serverless其实本质上是云服务上帮你整合了云资源,你只需要编写最核心的代码,比如一个请求过来如何处理和返回对应的数据。其他的服务器部署相关的事情,都交给云服务商。这样带来的最核心的好处是节省了大量资源,只有你的网站有人访问时,才会计算资源消耗的价格,大幅度降低了成本。

可能你只是想搭建一个博客,以前可能需要买一年的服务器,起码一年开销几百元。在Serverless下,如果你的博客访问量并不是很高,可能一年只要花费十几块钱。


3分钟部署一个网站



我们打开Serverless创建函数服务页面:

console.cloud.tencent.com/scf/list-cr…

选择Python3 Web函数模板:

网络异常,图片无法展示
|

接着可以设置一些基本信息,这里我啥也没修改,直接点击完成。

网络异常,图片无法展示
|

大概等待30秒,一个Serverless服务就创建完成了。

网络异常,图片无法展示
|

接下来,我们就被跳转到了代码编辑页面。由于我们在上面的选项里选了Python3 Web开发,所以代码默认有了一个最基本的Flask框架模板。(Flask是什么?是Python的一个Web开发框架,就像Java下面的SpringBoot一样,也能很轻松地开发一个Web服务。官方文档:flask.palletsprojects.com/en/2.0.x/)

网络异常,图片无法展示
|

模板代码已经有了路径(“/”)最基本的返回值,我们把他改几个字,然后点击左下角部署按钮。花费了十几秒部署完成后,点击测试,我们就能看到返回的Body了,如下图。这时候你访问页面,也返回了同样的结果。

网络异常,图片无法展示
|

一个最最基础的Web服务器就OK了,不需要买域名和HTTPS证书,不需要SSH登录服务器,不需要手动编译代码,🐂🍺。


10分钟开发一个在线RSS阅读小站



上面是牛刀小试,接下来稍微整一个复杂一点点的例子。

**我一直觉得RSS阅读是一个虽然过时,但是其精神一直在传承的阅读方式。**比如微信的订阅号,可以说其本质也是一种RSS阅读,通过关注订阅,并获得更新文章的推送,来定制化你的阅读内容。

所以我想做一个RSS解析器,通过传入RSS的网址(很多网站还保留有这个网址,比如CSDN,比如阮一峰的博客等),能够渲染出该RSS链接里所有的文章,并展示在网页上。后面,还可以深度的修改页面的展示,做出一个微信订阅号网页版,也不是不可能,哈哈哈。

OK,花里胡哨的就不扯了,先开始实现一个最简单的事情,把RSS链接渲染出来。

我们使用官方的Flask模板,这个模板的Flask环境相对更加完整,方便开发。

我们首先需要一个RSS解析的框架,在Python中,有一个feedparser的框架,能够解析RSS url。

使用pip3 install feedparser安装feedparser:

网络异常,图片无法展示
|

接着我们在app.py加入代码:

import feedparser
@app.route('/rss')
def rss():
    feed = feedparser.parse(request.args.get('rssurl'))
    return render_template('rss.html', entries=feed.entries)
复制代码

网络异常,图片无法展示
|

在这里,我进行了一波本地调试,看一下feed这个参数,拿到了什么:

网络异常,图片无法展示
|

可以看到,解析后的rss链接,被feedparser框架解析为了一个数组,每个entry是一个文章的标题,作者,链接等。

根据上面的参数名,我们再加入一个rss/html,放在templates文件夹中,里面写好了我稍微美化过的html页面,并且将每篇文章循环插入html中,这里用到了flask自带的渲染模板jinja2:

<html>
<head>
    <title>RSS阅读博客</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.slim.min.js"></script>
<div class="container-fluid">
  <div class="row-fluid">
    <div class="span12">
            <nav class="navbar navbar-expand-lg navbar-light bg-light">
              <div class="container-fluid">
                <a class="navbar-brand" href="#">RSS解析器</a>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                  <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                  <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                    <li class="nav-item">
                      <a class="nav-link active" aria-current="page" href="#">首页</a>
                    </li>
                  </ul>
                  <form class="d-flex">
                    <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
                    <button class="btn btn-outline-success" type="submit">Search</button>
                  </form>
                </div>
              </div>
            </nav>
            <div class="accordion" id="accordionExample">
                {% for entry in entries %}
                <div class="accordion-item">
                    <h2 class="accordion-header" id="heading{{ loop.index }}">
                      <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapse{{ loop.index }}" aria-expanded="false" aria-controls="collapse{{ loop.index }}">
                        {{ entry.title }} | {{ entry.published }}
                      </button>
                    </h2>
                    <div id="collapse{{ loop.index }}" class="accordion-collapse collapse" aria-labelledby="heading{{ loop.index }}" data-bs-parent="#accordionExample">
                      <div class="accordion-body">
                        {{ entry.summary | safe }}
                      </div>
                    </div>
                </div>
                {% endfor %}
            </div>
        </div>
  </div>
</div>
</body>
</html>
复制代码

两个文件修改完,直接点击部署然后访问腾讯云给我们分配的域名:

service-ehshqmzv-1252138314.cd.apigw.tencentcs.com/release/rss…

网络异常,图片无法展示
|

可以看到,完美解析出了我CSDN博客的RSS流,并且可以一个个打开。动图见文章最上方。


Web Function的优缺点分析



可以看出来,Serverless开发一个网站和传统网站开发区别非常大,它撇去了传统开发中那些冗杂但是又不经常会去修改的配置和流程,让开发者专注于业务逻辑的开发。但是这种开发方式真的完美吗?我思考了一下它的优势和不足。

**最明显的优势便是它简化了开发的步骤,省去了很多部署的无聊工作量。**但是,它的简化是有代价的,简化是会牺牲很大一部分灵活性和可定制性的。简化能够好用的前提是,云服务商把这些事情做到了,并且做好了。如果你的网站需要大量复杂的逻辑,并且需要优化网关的配置,那么很多事情在Serverless下,至少在目前提供的Serverless下,还是做不到的。

上面说到的弊端,其实会带来一个很大的问题,就是沉没成本,当你花了很多时间在Serverless上,却发现有一些小的要求或者定制化,没法实现,这时你是去翻文档,提工单,还是选择老老实实买个虚机,自己手动重新部署呢。

当然,上述观点是一个开发者的视角来看的。

作为普通消费者,可能很多时候只需要部署一个静态网站,用来放一个博客,或者说推广下自己的公司和产品。那么Serverlss大概率是符合要求的。

除了上面的主要矛盾外,还有一点是我想提出的,就是目前在线代码编辑页面的调试功能有点太弱了

在最开始的Python3 Web模板中,在线的依赖库貌似缺失了新版本的feedparser和flask,导致我在本地调试能够运行的代码放到Serverless上各种不成功,但是错误信息却很难找。导致我不得不在VS Code的终端里,一个手动开flask服务,一个去curl请求,才能看到报错信息。

网络异常,图片无法展示
|

网络异常,图片无法展示
|

当然,这个可能是我自己走得歪路,但是在页面上,很难一眼看出来Debug窗口在哪里。

在用户体验上,还有很多事情可以做。


相关实践学习
【文生图】一键部署Stable Diffusion基于函数计算
本实验教你如何在函数计算FC上从零开始部署Stable Diffusion来进行AI绘画创作,开启AIGC盲盒。函数计算提供一定的免费额度供用户使用。本实验答疑钉钉群:29290019867
建立 Serverless 思维
本课程包括: Serverless 应用引擎的概念, 为开发者带来的实际价值, 以及让您了解常见的 Serverless 架构模式
相关文章
|
域名解析 弹性计算 Apache
WordPress自助建站教程
本场景将基于一台基础环境为CentOS 7.8的ECS(云服务器)实例,在LAMP环境中安装WordPress,帮助您快速搭建自己的云上博客。
|
3月前
|
弹性计算 监控 安全
利用WordPress 模板建站,如果利用阿里云国际版获取网站高流量
利用WordPress 模板建站,如果利用阿里云国际版获取网站高流量
|
4月前
|
域名解析 安全 搜索推荐
一个新手网站搭建流程。
新手用户应该如何搭建网站?创建网站?制作网站?制作网站?
102 0
|
8月前
|
安全 定位技术
外贸网站如何选择服务器
以上就是选择外贸网站服务器时需要考虑的一些关键因素。
139 8
|
8月前
|
域名解析 存储 网络安全
WordPress外贸建站教程
这篇WordPress外贸建站教程是以实操形式写给没有任何建站基础的新手,不管你是不是技术小白,都可以轻松学会如何使用WordPress来自己建立一个实用的外贸网站,而不需要深入了解复杂的代码编程。梳理了WordPress外贸建站主要步骤,从最初的成本分析开始,然后逐步介绍域名选择和注册、虚拟主机选择、建站程序安装等关键步骤。
338 1
|
NoSQL Redis
个人博客 网站部署
个人博客 网站部署
80 0
|
域名解析 安全 Linux
网站搭建基本流程与建站指南(六个步骤)
网站搭建基本流程与建站指南(六个步骤)
|
开发者 SEO
新手搭建WordPress网站需要做什么?
对于刚接触WordPress的新手来说,在建立网站之前先了解一些WordPress的基本概念非常重要,这样可以更加熟悉并高效地进行建站。
|
缓存 前端开发 JavaScript
六翼建站教程:如何提高WordPress网站的访问速度
根据 WordPress 统计数据,现有所有网站中约有 33% 使用 WordPress,而 CMS 构建的网站中有 60% 由 WordPress 提供支持,使网站管理员或开发人员更有责任创建具有出色用户体验的网站。当无法更快地加载内容,而 WordPress 计划似乎是在浪费精力。
六翼建站教程:如何提高WordPress网站的访问速度
|
缓存 安全 SEO
建WordPress网站之后还需要做什么?wordpress建站靠谱吗?
在分享创建 WordPress 网站之前,有很多人有疑问,wordpress建站靠谱吗?建WordPress网站之后还需要做什么?北京六翼信息技术有限公司作为十几年的老牌建站公司,可以明确告诉大家,WordPress 是一个很棒的内容管理工具,这一点无可否认。对于创建内容的人来说,它是持续不断的支持。
建WordPress网站之后还需要做什么?wordpress建站靠谱吗?