当前位置：首页 > news >正文

aws console 使用fargate部署aws服务快速跳转前端搜索栏

news 2025/9/16 18:18:18

测试过程中需要在大量资源之间跳转，频繁的点击不如直接搜索来的快，于是写了一个搜索框方便跳转。

前端的静态页面可以通过s3静态网站托管实现，但是由于中国区需要备案的原因，可以使用ecs fargate部署

步骤如下：

编写前端页面，打包镜像
使用任务定义创建ecs fargate服务

编写页面和打包镜像

编写页面

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ToImage</title><style>* {margin: 0;padding: 0;}.container {height: 300px;width: 100%;margin: 100px auto 0 auto;}.parent {position: relative;top: 50%;left: 30%;}.search1 {width: 650px;height: 50px;border-radius: 18px;outline: none;border: 1px solid #ccc;padding-left: 20px;padding-right: 100px;position: absolute;font-size: 20px;}.search2 {width: 650px;height: 50px;border-radius: 18px;outline: none;border: 1px solid #ccc;padding-left: 20px;padding-right: 100px;position: absolute;top: 60px;font-size: 20px;}.btn {height: 36px;width: 100px;position: absolute;background: #fff;top: 120px;left: 300px;border: none;outline: none;font-size: 20px;}</style>
</head><body><div class="container"><form id="awsform" class="parent" method="get" ><input id="servicename" type="text" class="search1" placeholder="Please Input ServiceName..." name="servicename" /><input id="serviceid" type="text" class="search2" placeholder="Please Input ServiceID..." name="serviceid" /><input type="button" class="btn" value="Search" onclick="jssubmit()"/></form></div><script type="text/javascript">function jssubmit() {var formdom = document.getElementById('awsform');var servicename = document.getElementById("servicename").valuevar serviceid = document.getElementById("serviceid").valueconsole.log(serviceid)switch(servicename){case "role":window.location.href = "https://cn-north-1.console.amazonaws.cn/iamv2/home?region=cn-north-1#/roles/details/" + serviceid; break;case "user":window.location.href = "https://cn-north-1.console.amazonaws.cn/iamv2/home?region=cn-north-1#/users/details/" + serviceid; break;case "ec2":window.location.href = "https://cn-north-1.console.amazonaws.cn/ec2/v2/home?region=cn-north-1#InstanceDetails:instanceId=" + serviceid; break;case "eni":window.location.href = "https://cn-north-1.console.amazonaws.cn/ec2/v2/home?region=cn-north-1#NetworkInterface:networkInterfaceId" + serviceid; break;case "sg":window.location.href = "https://cn-north-1.console.amazonaws.cn/ec2/v2/home?region=cn-north-1#SecurityGroup:groupId=" + serviceid; break;case "ebs":window.location.href = "https://cn-north-1.console.amazonaws.cn/ec2/v2/home?region=cn-north-1#VolumeDetails:volumeId=" + serviceid; break;case "vpc":window.location.href = "https://cn-north-1.console.amazonaws.cn/ec2/v2/home?region=cn-north-1#VolumeDetails:volumeId=" + serviceid; break;case "subnet":window.location.href = "https://cn-north-1.console.amazonaws.cn/vpc/home?region=cn-north-1#SubnetDetails:subnetId=" + serviceid; break;case "s3":window.location.href = "https://cn-north-1.console.amazonaws.cn/s3/buckets/" + serviceid ; break;case "eks":window.location.href = "https://cn-north-1.console.amazonaws.cn/eks/home?region=cn-north-1#/clusters/" + serviceid ; break;}return false}</script>
</body></html>

本地测试

docker run -it --rm -p 8000:80 -v /home/ec2-user/index.html:/usr/share/nginx/html/index.html  nginx:alpine-slim

修改端口为8090

// default.conf
server {listen       8090;server_name  localhost;#access_log  /var/log/nginx/host.access.log  main;location / {root   /usr/share/nginx/html;index  index.html index.htm;}#error_page  404              /404.html;# redirect server error pages to the static page /50x.html#error_page   500 502 503 504  /50x.html;location = /50x.html {root   /usr/share/nginx/html;}# proxy the PHP scripts to Apache listening on 127.0.0.1:80##location ~ \.php$ {#    proxy_pass   http://127.0.0.1;#}# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000##location ~ \.php$ {#    root           html;#    fastcgi_pass   127.0.0.1:9000;#    fastcgi_index  index.php;#    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;#    include        fastcgi_params;#}# deny access to .htaccess files, if Apache's document root# concurs with nginx's one##location ~ /\.ht {#    deny  all;#}
}

打包镜像

FROM nginx:alpine-slim
COPY ./index.html /usr/share/nginx/html/index.html
COPY ./default.conf /etc/nginx/conf.d/default.conf

创建服务

在这里插入图片描述

访问跳转

在这里插入图片描述

aws console 使用fargate部署aws服务快速跳转前端搜索栏

测试过程中需要在大量资源之间跳转，频繁的点击不如直接搜索来的快，于是写了一个搜索框方便跳转。前端的静态页面可以通过s3静态网站托管实现，但是由于中国区需要备案的原因，可以使用ecs fargate部署步骤如下： 编写…...

编程日记 2023/2/26 21:56:07

Redis实战之Redisson使用技巧详解

一、摘要什么是 Redisson？来自于官网上的描述内容如下！Redisson 是一个在 Redis 的基础上实现的 Java 驻内存数据网格客户端（In-Memory Data Grid）。它不仅提供了一系列的 redis 常用数据结构命令服务，还提供了许多分布…...

编程日记 2023/2/26 21:55:02

SQLAlchemy

文章目录SQLAlchemy介绍SQLAlchemy入门使用原生sql使用orm外键关系一对多关系多对多关系基于scoped_session实现线程安全简单表操作实现方案CRUDFlask 集成 sqlalchemySQLAlchemy 介绍 SQLAlchemy是一个基于Python实现的ORM框架。该框架建立在 DB API之上，使用关系…...

编程日记 2023/2/26 21:53:57

【Linux学习笔记】8.Linux yum 命令和apt 命令

前言本章介绍Linux的yum命令和apt命令。 Linux yum 命令 yum（ Yellow dog Updater, Modified）是一个在 Fedora 和 RedHat 以及 SUSE 中的 Shell 前端软件包管理器。基于 RPM 包管理，能够从指定的服务器自动下载 RPM 包并且安装&#xf…...

编程日记 2023/2/26 21:52:49

windows服务器实用（4）——使用IIS部署网站

windows服务器实用——IIS部署网站如果把windows服务器作为web服务器使用，那么在这个服务器上部署网站是必须要做的事。在windows服务器上，我们一般使用IIS部署。假设此时前端给你一个已经完成的网站让你部署在服务器上，别人可以在浏览器…...

编程日记 2023/2/26 21:51:43

Random（二）什么是伪共享？@sun.misc.Contended注解

目录1.背景简介2.伪共享问题3.问题解决4.JDK使用示例1.背景简介我们知道，CPU 是不能直接访问内存的，数据都是从高速缓存中加载到寄存器的，高速缓存又有 L1，L2，L3 等层级。在这里，我们先简化这些复杂的层级…...

编程日记 2023/2/26 21:50:38

Linux解压压缩

打包tar首先我们得提一下专门用于打包文件的命令——tartar用于备份文件，打包多个文件或者目录，也可以用于还原被打包的文件假设打包目录test下的文件 tar -cvf test.tar ./test 假设打包目录test下的文件,并用gzip命令将包压缩 tar -zcvf test.tar ./te…...

编程日记 2023/2/26 21:49:33

JavaSe第3次笔记

1.String str "hello";字符串类型。 2.两个字符串类型相加意思是拼接，类似于c语言里面的strcat函数。 3.整型变成字符串类型: int a 10; String str String. valueOf(a); 4.当字符串和其他类型进行相加的时候，结果就是字符串。(不完全…...

编程日记 2023/2/26 21:48:28

非人工智能专业怎样从零开始学人工智能？

人工智能（Artificial Intelligence，AI）是指让机器具有类似人类智能的能力，包括感知、理解、推理、学习、规划、决策、创造等多个方面。人工智能研究涉及到计算机科学、数学、物理学、心理学、哲学等多个领域，旨在模拟和…...

编程日记 2023/2/26 21:47:23

MyBatis之增、删、查、改

目录前言一、配置MyBatis开发环境 1.1 创建数据库和表 1.2 添加框架支持 1.3 创建目录结构 1.4 配置数据库连接 1.5 配置MyBatis中的XML文件路径二、添加业务代码 2.1 查询数据库操作 2.1.1 添加实体类 2.1.2 添加mapper接口 2.1.3 在xml中实现mapper接口 2.1.…...

编程日记 2023/2/26 21:46:18

死磕Spring，什么是SPI机制，对SpringBoot自动装配有什么帮助

文章目录如果没时间看的话，在这里直接看总结一、Java SPI的概念和术语二、看看Java SPI是如何诞生的三、Java SPI应该如何应用四、从0开始，手撸一个SPI的应用实例五、SpringBoot自动装配六、Spring SPI机制与Spring Factories机制做对比七、这里是给我自…...

编程日记 2023/2/26 21:45:12

因果推断10--一种大规模预算约束因果森林算法（LBCF）

论文：A large Budget-Constrained Causal Forest Algorithm 论文：http://export.arxiv.org/pdf/2201.12585v2.pdf 目录 0 摘要 1 介绍 2 问题的制定 3策略评价 4 方法 4.1现有方法的局限性。 4.2提出的LBCF算法 5验证 5.1合成数据 5.2离线生…...

编程日记 2023/2/26 21:44:06

Linux基础命令-df显示磁盘的使用情况

文章目录文章目录 df 命令介绍语法格式基本参数参考实例 1）以人类可读形式显示磁盘空间的使用情况 2）显示磁盘的inode信息 3）显示磁盘和文件系统类型 4）指定显示文件系统 5）显示所有磁盘空间中的内容 …...

编程日记 2023/2/26 21:42:59

如何使用goquery进行HTML解析以及它的源码分析和实现原理

目录 goquery 是什么 goquery 能用来干什么 goquery quick start 玩转goquery.Find() 查找多个标签 Id 选择器 Class 选择器属性选择器子节点选择器内容过滤器 goquery 源码分析图解源码总结 goquery 简介 goquery是一款基于Go语言的HTML解析库，…...

编程日记 2023/2/26 21:41:52

【Java 数组和集合区别及使用案例】

Java中数组和集合都是用来存储一组数据的容器，但是在实际使用中，它们有一些区别和不同的使用场景。数组 vs 集合：存储方式数组是一个固定长度的容器，它的长度一旦被初始化之后，就无法再改变了。而集合是一个动态长…...

编程日记 2023/2/26 21:40:46

使用pynimate制作动态排序图

大家好，数据可视化动画使用Python包就可以完成，效果如下：想要使用Pynimate，直接import一下就行：import pynimate as nim输入数据后，Pynimate将使用函数Barplot（）来创建条形数据动画。…...

编程日记 2023/2/26 21:39:41

Mysql 事务的隔离性（隔离级别）

Mysql 中的事务分为手动提交和自动提交，默认是自动提交，所以我们在Mysql每输入一条语句，其实就会被封装成一个事务提交给Mysql服务端。手动提交需要先输入begin，表示要开始处理事务，然后就是常见的sql语句操作了&…...

编程日记 2023/2/26 21:38:34

2023年网络安全竞赛——Python渗透测试PortScan.py

端口扫描Python渗透测试：需求环境可私信博主获取任务环境说明：服务器场景：PYsystem0041服务器场景操作系统：未知服务器场景FTP用户名:anonymous 密码：空1. 从靶机服务器的FTP上下载PortScan.py，编辑Python程序PortScan.py，实现...

编程日记 2023/2/26 21:37:27

【数据结构】栈的接口实现（附图解和源码）

栈的接口实现（附图解和源码） 文章目录栈的接口实现（附图解和源码）前言一、定义结构体二、接口实现（附图解源码）1.初始化栈2.销毁栈3.入栈4.判断栈是否为空5.出栈6.获取栈顶元素7.获取栈中元素个数三、源代码…...

编程日记 2023/2/26 21:36:22

LC-1255. 得分最高的单词集合（回溯）

1255. 得分最高的单词集合难度困难60 你将会得到一份单词表 words，一个字母表 letters （可能会有重复字母），以及每个字母对应的得分情况表 score。请你帮忙计算玩家在单词拼写游戏中所能获得的「最高得分」：能够由…...

编程日记 2023/2/26 21:35:14

Qwen3-Embedding-0.6B深度解析：多语言语义检索的轻量级利器

第一章引言：语义表示的新时代挑战与Qwen3的破局之路 1.1 文本嵌入的核心价值与技术演进在人工智能领域，文本嵌入技术如同连接自然语言与机器理解的“神经突触”——它将人类语言转化为计算机可计算的语义向量，支撑着搜索引擎、推荐系统、…...

编程新知 2025/8/15 19:59:33

Python爬虫（一）：爬虫伪装

一、网站防爬机制概述在当今互联网环境中，具有一定规模或盈利性质的网站几乎都实施了各种防爬措施。这些措施主要分为两大类： 身份验证机制：直接将未经授权的爬虫阻挡在外反爬技术体系：通过各种技术手段增加爬虫获取数据的难度…...

编程新知 2025/8/24 22:20:35

问题： 在uniapp中使用aixos，运行后报如下错误： AxiosError: There is no suitable adapter to dispatch the request since : - adapter xhr is not supported by the environment - adapter http is not available in the build 解决方案&…...

编程新知 2025/8/7 21:07:39