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

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

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

前端的静态页面可以通过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服务快速跳转前端搜索栏

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

Redis实战之Redisson使用技巧详解

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

SQLAlchemy

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

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

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

windows服务器实用(4)——使用IIS部署网站

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

Random(二)什么是伪共享?@sun.misc.Contended注解

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

Linux解压压缩

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

JavaSe第3次笔记

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

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

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

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.…...

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

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

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

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

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

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

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

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

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

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

使用pynimate制作动态排序图

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

Mysql 事务的隔离性(隔离级别)

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

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

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

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

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

LC-1255. 得分最高的单词集合(回溯)

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

从中国文化看面试挑人标准

文章目录标准一、面相1. 1 四白眼1.2 浓眉二、讲话2.1 言多与气虚总结本文结合中国面相&#xff0c;是个概率性问题&#xff0c;对于个体无效。 标准 正直&#xff0c;三观正&#xff0c;沟通好&#xff0c;技术。从概率上讲&#xff1a; 正直且三观正的人----有恒心&#x…...

谦卑对象设计模式

谦卑设计模式介绍 “谦卑”在这里是拟人化的,指难以测试的对象清晰地认识到自己的局限性,只发挥自己的桥梁和通信作用,并不从中干预信息的传输。 谦卑对象模式‘最初的设计目的是帮助单元测试的编写者区分容易测试的行为与难以测试的行为&#xff0c;并将它们隔离。其设计思路…...

QML Animation动画详解

1.Animation简介 Animation类型提供了四个属性&#xff1a; alwaysRunToEnd&#xff1a;该属性接收布尔类型的参数。该属性保存动画是否运行到完成才停止。当loops属性被设置时&#xff0c;这个属性是最有用的&#xff0c;因为动画将正常播放结束&#xff0c;但不会重新启动。…...

C#开发的OpenRA的加载界面边框的细节

C#开发的OpenRA的加载界面边框的细节 在前面已经看到加载整个界面, 如果仔细地看,会发现加载界面的边框有一个红色的框。 这个红色的边框到底是怎么样来的呢? 其实它不是实时画上去的,而从纹理贴图里贴上去的。 也许有一些人会问,纹理贴图里的图片这么小,怎么样会有这么大…...

计算机网络笔记、面试八股(四)—— TCP连接

本章目录4. TCP连接4.1 TCP报文段的首部格式4.2 TCP连接如何保证可靠4.3 ARQ协议4.3.1 停止等待ARQ协议4.3.1.1 无差错情况4.3.1.2 出现差错情况4.3.1.3 确认丢失和确认迟到4.3.2 连续ARQ协议4.3.2.1 流水线传输4.3.2.2 累积确认4.3.2.3 滑动窗口协议4.3.3 停止等待ARQ和连续AR…...

Centos7 安装jenkins java1.8版本

1. 首先安装好jdk1.8 2. 安装jenkins 命令&#xff1a;(可以在根目录&#xff0c;创建文件夹 mkdir home 然后在此文件夹下操作 cd /home) a 清华源&#xff0c;获取jenkins安装包 wget https://mirrors.tuna.tsinghua.edu.cn/jenkins/redhat/jenkins-2.346-1.1.noarch.rp…...

【每日阅读】JS知识(三)

var声明提升 js是一个解释性语言类型&#xff0c;预解析就是在执行代码之前对代码进行通读 var关键字是&#xff0c;在内存中声明一个变量名 js在代码执行之前 会经历两个环节 解释代码 和执行代码 声明式函数 内存中 先声明一个变量名是函数 这个名代表的是函数 乘法表 // for…...

Vue(6)

文章目录1. 自定义指令1.1 函数式1.2 对象式1.3 自定义指令常见坑1.4 创建全局指令2. 生命周期2.1 引出生命周期2.2 分析生命周期2.3 总结3. 组件3.1 认识组件3.2 使用组件 (非单文件组件)3.3 全局组件3.4 组件的几个注意点3.5 组件的嵌套3.6 VueComponent 构造函数3.7 一个重要…...

Neo4j列表函数

使用列表 标量列表函数 size() 函数返回列表中的元素的数量 MATCH (p:Person)-[:ACTED_IN]->(m:Movie) WITH p, collect (m.title) AS MovieTitles WITH p, MovieTitles, size(MovieTitles) AS NumMovies WHERE NumMovies > 20 RETURN p.name AS Actor, NumMovies, Movie…...

55. 跳跃游戏

给定一个非负整数数组 nums &#xff0c;你最初位于数组的 第一个下标 。数组中的每个元素代表你在该位置可以跳跃的最大长度。判断你是否能够到达最后一个下标。示例 1&#xff1a;输入&#xff1a;nums [2,3,1,1,4]输出&#xff1a;true解释&#xff1a;可以先跳 1 步&#…...