Simple HTTP Server

Hello everyone!

First of all, I’ve been working with Delphi for a few years now, but I self-thought programming …so I’m missing some basic sometime… But I learn very quickly with good example ;-)

I have an application that I need to add an access via web browser. The Application is a Touch Panel application that currently only works on the PC where it’s installed.  I want the user to be able to define it’s own HTML page with multiple buttons and be able to call this page through any web browser on any PC on the same network.

The HTML code should be simple (no Active X or Java stuff…)
If I can vulgarize the html command it should be as simple as assigning a command like  “Call Action 3” to a button,
The Server would receive and interpret this command…

I’ve been trying for quiet a while now using Indy and Intraweb example, but cannot figure it out…

So here’s my question:

Can someone show me a very simple example, with let say two or three buttons on an HTML page that call different things on the server app.

Many Thanks in advance!

May the best simple example win the points!
PaulPAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Ivanov_GCommented:
The buttons in HTML are "form" components. In order to make them Submit/Reset a form, you should use a <form> tag and it's action property. Example:

<form name="form1" method="post" action="action.php?action=1">
  <input type="submit" name="Submit" value="Submit">
</form>
<form name="form2" method="post" action="action.php?action=2">
  <input type="submit" name="Submit2" value="Submit">
</form>

Thus you have Form1 with button Submit on it, when it is clicked - it will go to action.php with parameter action=1. The other form - Form2 has a button Submit2. When it is clicked - it will go to action.php again, but with parameter action=2.

So, if you have action.php file on your webserver, it should look like this:

<?
  $action_id = $_GET['action'];
  if ($action_id == 1 )
  {
     // execute Action 1
  }
  else
  {
     // execute Action 2
  }
?>
0
PaulPAuthor Commented:
Thanks Ivanov, but I have no experience with PHP... how do I get my Delphi Application to receive this command?
0
PaulPAuthor Commented:
Humm I think I just got it...
I'll let you know...
0
Cloud Class® Course: SQL Server Core 2016

This course will introduce you to SQL Server Core 2016, as well as teach you about SSMS, data tools, installation, server configuration, using Management Studio, and writing and executing queries.

PaulPAuthor Commented:
Hello again Ivanov!

I've been trying but I cannot get what I want...

Without using PHP I manage to get a call from the webpage to the application, but then the webpage change to other page while I want it to remain the same...

So if I could get a working example it could greatly help me...

Also how do I get information displayed on the page dynamically ?
I mean, the Application have some state, like Schedule running, current action, Local time, etc....
How could I get this information to appear on the webpage using simple code as possible... Maybe a javascript or some could be use here...

Thanks for your help!
0
Ivanov_GCommented:
> but then the webpage change to other page while I want it to remain the same
I don't understand what you mean.

> Also how do I get information displayed on the page dynamically ?
If I understood correctly, the lack of PHP is a problem. I doubt you can adapt PHP interpreter for this small server. So one solution is to simple CGI-like methods. Let's suppose you have a so called DWT (Dynamic Web Template). It is something like:

<HTML>
<HEAD>
<TITLE>{$TITLE}</TITLE>
</HEAD>
<BODY>
<H2>{$SOME_TEXT_HERE}</H2>
</BODY>
</HTML>

So you can replace this {$....} regions with the text you want from your code.
0
PaulPAuthor Commented:
Humm still very abstract to me...

Any way to get  a more detail example...

0
Ivanov_GCommented:
Tell me exactly what this example should do. I mean step-by-step, so that I can give you good example.
0
PaulPAuthor Commented:
Hello Ivanov!

Here’s the description of the example the best I can.


The goal it to control a Delphi application remotely via a webpage.
Example of the application screen shoot http://www.paul-pelletier.com/LJTouch/pix/LJTouchPreview.jpg

As the application has many ways to be configure I cannot have a static webpage, the users will have to be able to create their own webpage following some predefine rules…

On the webpage, you can have buttons or simple link that sent commands to the Delphi application
Commands would something like Action_1, Action_2…


As a second part of this:
The application should be able to send status information to the webpage (data update every 5 second for example)  If the user want, the webpage will display this information.

I hope this is a better request, please tell me if it’s not enough…


Many thanks again!
0
Ivanov_GCommented:
OK, so now the explaination is detailed. But after I see your screen shot ... making it with buttons will be hard task. I would suggest a nested tables + some JavaScript to emulate the buttons effect. Look at the HTML below. Save it as HTML file and open it through browser. Buttons will require forms, from the next page handling so many forms will be difficult.

Basicly, the text inside the cell should act as a Button Caption. The link "action.php?x=1&y=1" means that when it is clicked, the button was X=1, Y=1 - i.e. the first button. On the Next page (action.php or something else) you detect 1 and 1 as a values and find out that the action should be Action_1. Then ... you will have to think out a way to send the info back the your application.

Your application should have 2 functions - to refresh the data to the webpage and to accept X and Y as a parameters in order to execute some action. If this is the program, which contains the THTTPServer inside, it can be done using FileStreams.

Correct me if I didn't understand something.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.text {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      color: #000000;
      text-decoration: none;
}
-->
</style>
</head>

<body>
<table width="200" border="0" cellspacing="0" cellpadding="1">
  <tr>
    <td><table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#000000">
        <tr>
          <td><table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
              <tr>
                <td onMouseOver='javascript:this.bgColor="red"' onMouseOut='javascript:this.bgColor="white"'>&nbsp;<span class="text"><a href="action.php?x=1&y=1">Button
                  1,1</a></span></td>
              </tr>
            </table></td>
        </tr>
      </table></td>
    <td><table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#000000">
        <tr>
          <td><table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
              <tr>
                <td onMouseOver='javascript:this.bgColor="red"' onMouseOut='javascript:this.bgColor="white"'>&nbsp;<span class="text"><a href="action.php?x=1&y=2">Button
                  1,2</a></span></td>
              </tr>
            </table></td>
        </tr>
      </table></td>
  </tr>
  <tr>
    <td><table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#000000">
        <tr>
          <td><table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
              <tr>
                <td onMouseOver='javascript:this.bgColor="red"' onMouseOut='javascript:this.bgColor="white"'>&nbsp;<span class="text"><a href="action.php?x=2&y=1">Button
                  2,1</a></span></td>
              </tr>
            </table></td>
        </tr>
      </table></td>
    <td><table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#000000">
        <tr>
          <td><table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
              <tr>
                <td onMouseOver='javascript:this.bgColor="red"' onMouseOut='javascript:this.bgColor="white"'>&nbsp;<span class="text"><a href="action.php?x=2&y=2">Button
                  2,2</a></span></td>
              </tr>
            </table></td>
        </tr>
      </table></td>
  </tr>
</table>
</body>
</html>
0
PaulPAuthor Commented:
Hello Ivanov!

You now have a pretty good understanding of what I want to do!

Thanks, I already thought about using a table as buttons, but you script to do a mouse over does help me...Thanks!
 I was thinking of using a simple hyperlink on the text with the action call... but I will also consider the Cell coordinate way...

But the part I need more help is how does my application receive the info from the webpage and use it and how can I send info to the webpage... I'm not sure how the Filestream thing works...

Thanks!
0
Ivanov_GCommented:
About receiving the info from the webpage: for the first button you have line "action.php?x=1&y=1". If you want - name it .html, it doesn't matter. So, when the client request webpage from the server, it goes in OnCommandGet method.

Something I want to mention here. Probably you know something about the parameters in HTTP, but I want to clarify them:
1) POST parameters - in Order to send post parameters, you should have <form> tag, and a button action Submit. This form has "action" parameter, which is another file. On this another file you can take the values of Edit, Check and Memo boxes. They are POST parameters.
2) GET parameters are given in the URL - like my example above - "action.php?x=1&y=1". X and Y are GET parameters.

So, now - about taking them.. As I said - the can be handled in OnCommandGet method. If you way the Indy demo for HTTPServer - in procedure TfmHTTPServerMain.HTTPServerCommandGet here is what I did:

var
  ...
  paramX    : Integer;
begin
  ...
  paramX := StrToInt(RequestInfo.Params.Values['x']);

And the from the client - open the following URL:
http://127.0.0.1:85/index.html?x=1 

if you debug your code, you will see that paramX = 1. This is what you need to know which "button" was clicked.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Delphi

From novice to tech pro — start learning today.