如何将bash变量放入html <img/>标签中?

时间:2019-05-02 13:36:14

标签: html bash gnuplot

我正在创建一个CGI,它使我可以使用gnuplot生成的图形直接查看几个集群的RAM和CPU消耗。

因此,我有一个带有菜单列表框的第一个网页,其中有我的集群的名称和一个生成按钮:

#!/bin/bash


echo "Content-type: text/html"
echo ""

echo '
<html>
        <head>
                <meta http-equiv="Content-Type" content="test/html"; charset=UTF-8">
                <title> CLUSTER GRAPH </title>
                <h1> Cluster Graph <font size=3> <a href="Index.sh">[ Index ]</a> </font> </h1>
                <hr size="4" color="blue">
        </head>
<body>

<p> Choose a Cluster and press the button to generate the graph ! </p>'

Cluster_Name=$(cat ClusterFullList.csv | awk '{print $3}' | sort | uniq)

echo "<form action="script_extract.sh" method="post">"
echo "<select name="CLUSTER">"
echo "$Cluster_Name" | while read CLUSTER; do
        echo " <option value="$CLUSTER">$CLUSTER</option>"
        done
echo "</select>"
        echo"<br><br>"
        echo "<input type="submit" value="Generate">"
echo "</form>"

echo'
</body>
</html> 
'

当您点击“生成”时,该图应显示在其旁边,并带有消耗量的简短摘要:

#!/bin/bash

echo "Content-type: text/html"
echo ""

echo "
<html>
    <head>
        <title> CLUSTER GRAPH </title>
        <h1> Cluster Graph <font size=3> <a href="Index.sh">[ Index ]</a></font></h1>
        <hr size="4" color="blue">


        <style>
             hr{
              margin-top: 1%;
             }

             #p1{
               font-size: 18px;
               text-decoration: underline;
               margin-top: -41.8%;
               margin-left: 58.5%;
               margin-bottom: 2%;
             }

             #p2{
               font-size: 14px;
                           margin-top: -2.9%;
               margin-left: 58.5%;
               margin-bottom: 4%;
             }

             #p3{
                           font-size: 14px;
                           margin-top: 5%;
                           margin-left: 58.5%;
                           margin-bottom: 4%;
                         }
        </style>
    </head>
<body>
<img src="/var/www/html/$test.png">
<PRE>"
read a 

test=`echo $a | cut -d'=' -f2`

Cluster_data=`cat ClusterFullList.csv | grep -w $test | awk '{print $1" "$2","$12","$13}' > test1.txt`

cat test.txt | sed "s/TITLE/$test/" | sed "s/CLUSTER_NAME.png/$test.png/" | sed "s/CLUSTER_1.txt/test1.txt/" > test2.txt 

cat test2.txt | gnuplot
echo "$(sed -n "s/CLUSTER_1.txt/test1.txt/" Script_Conso.sh)"

echo "
</PRE>
<PRE>
 <p id="p1">`echo "Consumption difference :"`</p> 
 <p id="p2">`./Script_Conso.sh` </p>

</PRE>
</body>
</html>
"

我从查询字符串的行中获得集群名称:

test=`echo $a | cut -d'=' -f2`

我生成的文件将用于制作带有以下行的图形:

Cluster_data=`cat ClusterFullList.csv | grep -w $test | awk | {print $1" "$2","$12","$13}' > test1.txt`

我用sed命令更改了gnuplot图的标题和用于制作该图的文件:

cat test.txt | sed "s/TITLE/$test/" | sed "s/CLUSTER_NAME.png/$test.png/" | sed "s/CLUSTER_1.txt/test1.txt/" > test2.txt  

我生成图:

cat test2.txt | gnuplot

我运行脚本来总结消耗量:

echo "$(sed -n "s/CLUSTER_1.txt/test1.txt/" Script_Conso.sh)"

除了图形显示在我的网页上之外,所有其他东西都可以正常运行。该图像在/ var / www / html文件夹中很好地生成(我在RedHat 7.6下工作),但是当我查看页面的源代码时,图像的名称为“ .png”。

我通过用{}包围$ test变量来进行测试,但是它没有任何改变...

你能帮我吗?

谢谢!

1 个答案:

答案 0 :(得分:0)

在您的第二个较长清单中,第一次在这里引用$ test:

<img src="/var/www/html/$test.png">

但是它设置为直到4行以后:

test=`echo $a | cut -d'=' -f2`

如果在“大回显”之前执行读取和分配以进行测试,则应该看到已填充的图像值。

在上面的语句中,“大回声”是长回声,其中包含<html>标签。

具体来说,我在谈论以下代码:

<img src="/var/www/html/$test.png">
<PRE>"
read a 
test=`echo $a | cut -d'=' -f2`

在上面的块中,a用于派生test。如您所见,在读取test之前先引用a

作为其他建议,请考虑使用bash heredoc提供模板。我已经重新编写了您的第一个bash脚本以演示:

#!/bin/bash
cat <<EOF
Content-type: text/html

<html>
        <head>
                <meta http-equiv="Content-Type" content="test/html"; charset=UTF-8">
                <title> CLUSTER GRAPH </title>
                <h1> Cluster Graph <font size=3> <a href="Index.sh">[ Index ]</a> </font> </h1>
                <hr size="4" color="blue">
        </head>
<body>

<p> Choose a Cluster and press the button to generate the graph ! </p>
<form action="script_extract.sh" method="post">
<select name="CLUSTER">
$(
awk '{print $3}' ClusterFullList.csv | sort | uniq | 
while
   read CLUSTER 
do
  echo " <option value="$CLUSTER">$CLUSTER</option>"
done
)
</select>
<br><br>
<input type="submit" value="Generate">
</form>

</body>
</html> 
EOF