『亚马逊云科技产品测评』活动征文|基于Lightsail开发随机格言应用

授权声明:本篇文章授权活动官方亚马逊云科技文章转发、改写权,包括不限于在 Developer Centre, 知乎,自媒体平台,第三方开发者媒体等亚马逊云科技官方渠道

前言

之前闲着无聊的时候,在本地基于thinkphp框架开发了一个随机展示人生格言的网站。

刚好在aws购买了一台lightsail服务器还比较空闲,今天顺便把这个网站部署上去。

连接服务器

进入Aws网站,点击登录控制台,使用根用户登录
在这里插入图片描述

在控制台主页点击 Lightsail 进入控制台,因为我之前访问过所以这里有记录。

在这里插入图片描述
进入控制台后可以看到已经存在一个实例了,这是我之前创建的。

在这里插入图片描述

如果没有实例的话,要创建一个实例也是非常简单的。主要就是选择实例的镜像与实例的计划点击创建就可以了。

我们点击进入实例详情页,点击Connect选项查看实例的IP地址及用户名。使用SSH工具连接到服务器

在这里插入图片描述

环境准备

我之前的服务器上是部署了Nginx服务,但是还缺少PHP和MySQL服务。

扫描二维码关注公众号,回复: 17151926 查看本文章

首先,我们要在服务器上安装PHP和MySQL服务

安装php

我们使用以下命令安装PHP及其相关的模块:

sudo yum install php php-fpm php-mysqlnd -y

这个命令会安装PHP的默认版本。如果你需要特定版本的PHP,可以在yum命令中指定版本号。

使用 php -v 查看安装的PHP版本
在这里插入图片描述

我们启动PHP服务

sudo systemctl start php-fpm

安装 MariaDB

因为我的系统是Amazon Linux 2023,yum中默认的是MariaDB,所以我们安装 MariaDB

我们使用以下命令安装MariaDB服务

sudo yum install mariadb105-server

启动MariaDB服务

 sudo  systemctl start mariadb

我们运行 mysql_secure_installation,按下面的操作步骤操作:

sudo mysql_secure_installation
  • 键入当前根密码。默认情况下,根账户没有设置密码。按 Enter。

  • 键入 Y 设置密码,然后输入两次安全密码。

  • 键入 Y 删除匿名用户账户。

  • 键入 Y 禁用远程根登录。

  • 键入 Y 删除测试数据库。

  • 键入 Y 重新加载权限表并保存您的更改
    在这里插入图片描述
    现在所有的服务都已经安装完成,环境已经准备完毕,下面我们来部署网站

部署网站

创建数据库

首先,我们需要连接到mysql,创建一个数据库,用来存储所有的记录

使用刚才创建的root账号密码连接到mysql 数据库

# 连接到mysql
mysql -uroot -p

# 创建数据库
 CREATE DATABASE `quotes` CHARACTER SET 'utf8' COLLATE 'utf8_bin';

# 选择数据库

use quotes;

# 创建数据表
CREATE TABLE `quotes` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `content` varchar(500) DEFAULT NULL,
  `author` varchar(60) DEFAULT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=utf8;

在这里插入图片描述
这里我们准备插入一些数据进去,在后面的程序中会使用到

INSERT INTO `quotes` VALUES (3, '今天就是生命,是唯一你能确知的生命', '列夫·托尔斯泰');
INSERT INTO `quotes` VALUES (4, '人的一生应当这样度过:当回忆往事的时候,他不至于因为虚度年华而痛悔,也不至于因为过去的碌碌无为而羞愧;在临死的时候,他能够说:“我的整个生命和全部精力,都已经献给世界上最壮丽的事业--为人类的解放而斗争。', '奥斯特洛夫斯基');
INSERT INTO `quotes` VALUES (5, '人生最终的价值在于觉醒和思考的能力,而不只在于生存', '亚里士多德');
INSERT INTO `quotes` VALUES (6, '在命运的颠沛中,最可以看出人们的气节', '莎士比亚');
INSERT INTO `quotes` VALUES (7, '人生是各种不同的变故、循环不已的痛苦和欢乐组成的。那种永远不变的蓝天只存在于心灵中间,向现实的人生去要求未免是奢望。', '巴尔扎克');
INSERT INTO `quotes` VALUES (8, '勤劳远比黄金可贵。', '萨迪');
INSERT INTO `quotes` VALUES (9, '自己活着,就是为了使别人活得更美好。', '雷锋');
INSERT INTO `quotes` VALUES (10, '谁要是游戏人生,他就一事无成;谁不能主宰自己,永远是一个奴隶。', '歌德');
INSERT INTO `quotes` VALUES (11, '希望是附丽于存在的,有存在,便有希望,有希望 ,便是光明。', '鲁迅');
INSERT INTO `quotes` VALUES (12, '人间没有永恒的夜晚,世界没有永恒的冬天。', '艾青');

代码

我们使用以下命令创建tp项目

composer create-project topthink/think tp6

运行命令之后,我们会得到一个如下所示的文件
在这里插入图片描述
下载tp6框架之后,还要额外安装think-view 模板引擎驱动。在根目录执行以下命令:

composer require topthink/think-view

现在我们来编写代码:

编写 app\controller\index.php文件:

主要实现从数据库中取出数据,并且写入到html页面中

<?php

namespace app\controller;

use app\BaseController;
use think\facade\Db;
use think\facade\View;


class Index extends BaseController
{
    public function index()
    {
        $data = Db::name("quotes")
            ->field("content,author")
            ->limit(10)
            ->orderRand()
            ->select()
            ->toJson();
        return View::fetch('', ['data' => $data ]);
    }
}

编写 view\index\index.html文件,内容如下:

html中的内容主要是每隔3秒钟切换显示名言

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <title>名言警句</title>
    <style>
        body {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            height: 100vh;
            margin: 0;
            background-color: #f4f4f4;
            font-family: 'Arial', sans-serif;
        }

        #quote-container {
            position: relative;
            text-align: center;
            padding: 20px;
            border-radius: 8px;
            background-color: #ffffff;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            margin-bottom: 20px;
        }

        #quote {
            margin-bottom: 10px;
        }

        #author {
            position: absolute;
            bottom: 10px;
            right: 10px;
            font-size: 14px;
            color: #555;
        }

        #current-time {
            font-size: 18px;
            color: #333;
            margin-bottom: 20px;
        }
    </style>
</head>
<body>
<div id="current-time"></div>
<div id="quote-container">
    <blockquote id="quote">Loading...</blockquote>
    <div id="author"><span id="author-name">Unknown</span></div>
</div>

<script>

    const quotes = JSON.parse(`{:htmlspecialchars_decode($data, ENT_QUOTES)}`)

    function displayCurrentTime() {
        const currentTimeContainer = document.getElementById("current-time");
        const now = new Date();
        const formattedTime = now.toLocaleTimeString();
        currentTimeContainer.textContent = `当前时间: ${formattedTime}`;
    }

    function getRandomQuote() {
        return quotes[Math.floor(Math.random() * quotes.length)];
    }

    function displayRandomQuote() {
        const quoteContainer = document.getElementById("quote");
        const authorNameContainer = document.getElementById("author-name");

        const {content, author} = getRandomQuote();

        quoteContainer.textContent = content;
        authorNameContainer.textContent = '--- ' + author;
    }

    displayCurrentTime();

    setInterval(displayCurrentTime, 1000);

    displayRandomQuote();

    setInterval(displayRandomQuote, 5000);
</script>
</body>
</html>

切换到/www目录,上传本地的代码并解压
在这里插入图片描述

修改配置文件

切换到/www/tp6目录,我们要修改配置文件.env,如果没有.evn文件,则创建一个,把文件中关于数据库相关的信息替换成服务器上的数据库信息

.env文件

APP_DEBUG = false
[APP]
DEFAULT_TIMEZONE = Asia/Shanghai
[DATABASE]
#TYPE = mysql
DATABASE = quotes
HOSTNAME = 127.0.0.1
USERNAME = root
PASSWORD = root # 替换成你自己的数据库密码
HOSTPORT = 3306
CHARSET = utf8
DEBUG = true
[LANG]
default_lang = zh-cn
在nginx中添加站点

切换到nginx配置文件目录,我服务器上是 /etc/nginx/conf.d, 添加配置文件
quotes.conf

server {
        listen        80;
        server_name  you.com;
        root   /www/tp6/public;
        location / {
            index index.html index.php  error/index.html;
            if (!-e $request_filename) {
      		 rewrite  ^(.*)$  /index.php?s=/$1  last;
   			 }
        }
	 location ~ \.php$ {
            include fastcgi_params;
            fastcgi_pass php-fpm;
            fastcgi_index index.php;
            fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        }
       
}

最后检查nginx配置文件并且重启nginx服务

sudo nginx -t && sudo systemctl reload nginx

在这里插入图片描述

访问我们刚在在nginx中配置的域名,显示如下:

在这里插入图片描述

这样我们就在Lightsail服务器上部署好了一个基于tp框架的网站。

总结

如果你需要在Lightsail服务器上部署一个PHP网站,那么你可以参考本文。如果有存在什么错误,还请指出。

猜你喜欢

转载自blog.csdn.net/hacks8/article/details/134546267