Как поместить переменную bash в тег html <img>? - PullRequest
Новая
       9

Как поместить переменную bash в тег html <img>?

0 голосов
/ 02 мая 2019

Я создаю CGI, который позволяет мне напрямую видеть потребление ОЗУ и ЦП нескольких кластеров, используя график, сгенерированный gnuplot.

Итак, у меня есть первая веб-страница со списком меню, в котором находятся названия моих кластеров и кнопка генерации: 

#!/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> 
'

Когда вы нажимаете на Generate, должен появиться график с краткой сводкой потребления рядом с ним: 

#!/bin/bash

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

echo "

    
 CLUSTER GRAPH 
         Cluster Graph  [ Index ]
        


        
             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%;
                         }
image 
"
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 "

 `echo "Consumption difference :"` 
 `./Script_Conso.sh`
"

Я получаю имя кластера из строки запроса со строкой: 

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

Я создаю файл, который будет использоваться для построения моего графика со строкой: 

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

Я изменяю заголовок моего графика gnuplot и файл, который должен использоваться для создания графика, с помощью команды sed: 

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 голосов
/ 02 мая 2019

В вашем втором длинном листинге $ 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
...