현재 위치

홈 ›› Forums ›› 공부 ›› 프로그래밍 QnA

웹 페이지를 html로 코딩해서 제작하였습니다. 이 페이지 상의 화살표 버튼을 만들어서 무선으로 로봇을 조종하려고 합니다.

skrkfql의 이미지
글쓴이: skrkfql / 작성시간: 토, 2011/09/24 - 10:22오후

일단 C프로그램을 통해서 로봇을 무선으로 조종하는 것은 제작하였습니다.
문제는 웹으로 이 C에다가 신호를 보내는 것인데

자바를 써서 소켓프로그래밍을 하는 것 외에는 답이 없을 것 같아 보이네요.
현재 소캣 프로그램은 공부하고 있습니다. 그런데 자바를 써본적이 없어서요.
HTML파일에다가 자바를 어떻게 적용할 수 있을까요?

혹시 HTML파일도 C와 소켓 연결(C에 신호를 줄 수 있게)이 되나요?

java파일은 eclipse를 사용해서 new java project로 제작하고 있습니다.
제가 자바를 전혀 안 다뤄봐서 너무 기초적인 질문만 드리네요.

File attachments: 
첨부파일 크기
HTML icon index.htm4.12 KB
Forums: 
프로그래밍 QnA
shint의 이미지

글쓴이: shint / 작성시간: 토, 2011/09/24 - 10:47오후

프로토콜'을 알파벳'이나 숫자로 만든후에
http://ip:port/원하는 주소/?shint=data
이런식으로 보낼 수 있다고 생각됩니다.

어차피 프로토콜'이니까요.
ajax를 활용한다면 더 나을거 같습니다.

flash나 flex에서도 됩니다.

----------------------------------------------------------------------------
젊음'은 모든것을 가능하게 만든다.

매일 1억명이 사용하는 프로그램을 함께 만들어보고 싶습니다.
정규 근로 시간을 지키는. 야근 없는 회사와 거래합니다.

각 분야별. 좋은 책'이나 사이트' 블로그' 링크 소개 받습니다. shintx@naver.com

skrkfql의 이미지

글쓴이: skrkfql / 작성시간: 금, 2011/09/30 - 5:06오후

신호를 항상 전송해주는 것은 아니구요.
C프로그램. 즉 컴퓨터로 전송해주려는 것입니다.
클라이언트에서 클릭 시 에 서버에서 받아서 서버 컴퓨터 내에 있는 C로 보내서 로봇을 조종할 예정입니다.

익명 사용자의 이미지

글쓴이: 익명 사용자 / 작성시간: 월, 2011/09/26 - 9:15오전

자,

웹브라우저로 로봇을 컨트롤하려면,

클라이언트 <-> 웹서버

와 일단 통신이 되야됩니다.

화살표를 눌렀다면 웹서버의 CGI 나 관련된 비슷한 스크립트가 동작하도록 해도 되구요,

그 스크립트나 CGI가 직접 통신해도 되지만, 제가 볼땐 일정한 인터페이스를 만들어놓고 통신하도록 하면 더 좋을 것 같습니다.

stdou, stdin 이 어차피 다 잖아요..

닭잡는데 소잡는 칼 쓸필요는 없다고 봅니다.

skrkfql의 이미지

글쓴이: skrkfql / 작성시간: 금, 2011/09/30 - 4:54오후

인터페이스로 화살표를 만들었구요.
그 화살표 버튼을 누를 경우 신호를 보내도록 할 생각이거든요.

skrkfql의 이미지

글쓴이: skrkfql / 작성시간: 금, 2011/09/30 - 5:10오후

인터페이스로 화살표를 만들었구요.
그 화살표 버튼을 누를 경우 신호를 보내도록 할 생각이거든요.

codebank의 이미지

글쓴이: codebank / 작성시간: 월, 2011/09/26 - 10:23오전

저도 얼마전 이러한 부분이 필요해서 급하게 만들었던 코드입니다.
그중 일부입니다.
환경은...
먼저 로봇 제어 컴퓨터가 서버형식으로 소켓 포트를 열어놓고 있어야 합니다.
HTML(PHP)코드는 직접 제어 컴퓨터에 연결하여 데이터를 전달하는 역할을 합니다.
만일 PHP를 잘 모르신다고 하더라도 기본 형식은 비슷하니 수정하시면 될겁니다.

로봇 제어쪽 서버코드는 일반 TCP/IP 소켓통신 형식으로 구성해 놓으시면되고 통신은 데이터만 받고
바로 close해버리는 형태로 되어있다고 가정합니다.
(IP와 Port는 임의로 바꾸어 놓았습니다.)
아래 예제는 위로 화살표 버튼이 눌렸을 경우 'Move F'를 보내도록 되어있지만 간단하게 'F'만 보내도되고
임의로 다른 문자를 보내도 됩니다. 그건 제작자의 프로토콜에 맞춰서 편안한 대로 코딩하면 됩니다.

HTML쪽은 다음과 같습니다.
---------------------------

[geshifilter-html]&#10;&lt;head&gt;&#10;...&#10;  &lt;script type=&quot;text/JavaScript&quot; language=&quot;JavaScript&quot;&gt;&#10;  &lt;!--&#10;    function move_forward ()&#10;    {&#10;      document.move_action.mvalue.value = &#039;F&#039;;&#10;      document.move_action.submit ();&#10;      return false;&#10;    }&#10;  ...&#10;&lt;/head&gt;&#10;&lt;body&gt;&#10;  &lt;form method=&#039;post&#039; name=&#039;move_action&#039; action=&#039;control_action.php&#039;&gt;&#10;    &lt;input type=&#039;hidden&#039; name=&#039;mvalue&#039; value=&#039;&#039; /&gt;&#10;    ...&#10;    &lt;input type=&#039;button&#039; name=&#039;forward&#039; value=&#039;^&#039; OnClick=&#039;move_forward ();&#039; /&gt;&#10;    ...&#10;  &lt;/form&gt;&#10;&lt;/body&gt;&#10;&lt;/hhtml&gt;&#10;
------------------------------------------- 실제 소켓통신을 하는 코드입니다.(control_action.php) -------------------------------------------- &#10;&lt;?PHP&#10;  $IP = &#039;192.168.0.1&#039;;&#10;  $PORT = 1234;&#10;  $sock = socket_create (AF_INET, SOCK_STREAM, SOL_TCP);&#10;  socket_connect ($sock, $IP, $PORT);&#10;  switch ($mvalue)&#10;  {&#10;    case &#039;F&#039; : socket_write ($sock, &quot;Move F&quot;); break;&#10;    case &#039;B&#039; : ...&#10;  }&#10;?&gt;&#10;&lt;script type=&#039;text/JavaScript&#039; language=&#039;JavaScript&#039;&gt;&#10;&lt;!--&#10;  self.location.href = document.referrer;&#10;//--&gt;&#10;&lt;/script&gt;&#10; ----------------------------------------------- 위와 같은 형식으로 하시면 됩니다. 혹시 몰라서 추가 합니다. 작성하다 화살표키나 키보드를 직접입력 받는 형식이 필요할 때는 검색사이트에서 'keypresshandler'를 찾아보시면 원하는 답변을 얻을 수 있을겁니다.[/geshifilter-html]

------------------------------
좋은 하루 되세요.

skrkfql의 이미지

글쓴이: skrkfql / 작성시간: 월, 2011/09/26 - 10:52오전

큰 도움이 되었습니다. ㅠㅠ 감사합니다 너무 감동이네요.
저희 쪽에 맞게 수정해보도록 하겠습니다. 즐거운 하루 한주 한달 일년 보내세요.

skrkfql의 이미지

글쓴이: skrkfql / 작성시간: 목, 2011/09/29 - 1:10오후

HTML코딩에 있는

여기 히든은 어떤 의미인가요?

index파일에 html과 php를 다 넣어도 될까요?

댓글 달기

텍스트 포맷에 대한 자세한 정보

Filtered HTML

  • 텍스트에 BBCode 태그를 사용할 수 있습니다. URL은 자동으로 링크 됩니다.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>
  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.

BBCode

  • 텍스트에 BBCode 태그를 사용할 수 있습니다. URL은 자동으로 링크 됩니다.
  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param>
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.

Textile

  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • You can use Textile markup to format text.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>

Markdown

  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • Quick Tips:
    • Two or more spaces at a line's end = Line break
    • Double returns = Paragraph
    • *Single asterisks* or _single underscores_ = Emphasis
    • **Double** or __double__ = Strong
    • This is [a link](http://the.link.example.com "The optional title text")
    For complete details on the Markdown syntax, see the Markdown documentation and Markdown Extra documentation for tables, footnotes, and more.
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>

Plain text

  • HTML 태그를 사용할 수 없습니다.
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.
  • 줄과 단락은 자동으로 분리됩니다.
댓글 첨부 파일
이 댓글에 이미지나 파일을 업로드 합니다.
파일 크기는 8 MB보다 작아야 합니다.
허용할 파일 형식: txt pdf doc xls gif jpg jpeg mp3 png rar zip.
CAPTCHA
이것은 자동으로 스팸을 올리는 것을 막기 위해서 제공됩니다.