質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
CGI

CGI(Common Gateway Interface)とは、Webサーバー上でユーザプログラム動作させる仕組みのこと。また、動かす前提のプログラムをCGIと呼ぶこともあります。HTMLなどの静的な情報に限らず、プログラムの処理結果をベースにした動的情報の提供が可能です。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

解決済

お問い合わせフォームの文字化け

unikani129
unikani129

総合スコア3

CGI

CGI(Common Gateway Interface)とは、Webサーバー上でユーザプログラム動作させる仕組みのこと。また、動かす前提のプログラムをCGIと呼ぶこともあります。HTMLなどの静的な情報に限らず、プログラムの処理結果をベースにした動的情報の提供が可能です。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

2回答

0評価

0クリップ

407閲覧

投稿2022/02/09 04:30

HTMLで作成したお問い合わせフォームをcgiに渡すと
文字化けしたお問い合わせフォームページが返ってくる

HPのリニューアルに際して、
無料cgiライブラリを使ったお問い合わせフォームを作成しております。

初心者ですので前任者のコードのパスを書き換えただけですが上手に作動しません。
フォームチェック用のJavaScriptはHTMLに埋め込んでいます。

【送信前】
イメージ説明

【確認画面へボタン押下後】
イメージ説明

HTML

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>お問い合わせ</title> <link rel="stylesheet" href="../base.css" type="text/css"> <!--フォームチェック用JS--> <script language="JavaScript"> <!-- ////NINOオリジナルフォームチェック! qNm = new Array(); qJp = new Array(); //Emailチェックするか? EmailCheck=true; //お電話番号lチェックするか? PhoneCheck=true; //必須項目設定 qNm[0] = 'name' ; qJp[0] = 0; ///////////////////// function formCheck(){ errFlag = 0; messe = ''; //足し算結果が2以上のものはエラーとみなす for(m=0; m<qNm.length; m++){ targetEle = document.myform.elements[qJp[m]].value; if( targetEle == null || targetEle == ''){ messe += '●'+qNm[m]+'を入力してください\n'; errFlag = 1; } } //メールチェック if(EmailCheck == true){ ml = /.+@.+\..+/; // チェック方式 mf = document.myform.elements['Email'].value; if(mf){ if(!mf.match(ml)) { messe += '●E-mailが正しくありません\n'; errFlag = 1; } }else{ messe += '●E-mailを入力してください\n'; errFlag = 1; } } //お電話番号チェック if(PhoneCheck == true){ pf = document.myform.elements['tel'].value; if(pf == null || pf == ''){ messe += '●お電話番号を入力してください\n'; errFlag = 1; } } //エラーフラグがあれば、アラート表示 if(errFlag == 1){ alert(messe); return false; } } //--> </script> </head> <body> <div class="content"> <form id="entry" action="./form.cgi" method="POST" onSubmit="return formCheck();" name="myform"> <dl> <dt>お名前<span class="must">※</span></dt> <dd><input type="text" name="name" id="name" required></dd> <dt>企業名<span>&emsp;</span></dt> <dd><input type="text" name="company" id="company"></dd> <dt>お住まいの都道府県<span class="must">※</span></dt> <dd><input type="text" name="adress" id="adress" required></dd> <dt>メールアドレス<span class="must">※</span></dt> <dd><input type="email" name="Email" id="Email" required></dd> <dt>電話番号<span class="must">※</span></dt> <dd><input type="tel" name="tel" id="tel" required></dd> <dt>お問い合わせ内容<span class="must">※</span></dt> <dd><textarea name="detail" id="detail" required></textarea></dd> </dl> <p id="submit_buttom_wrap"> <input type="submit" id="submit_buttom" value="確認画面へ"> </p> </form> </div> </body> </html>

cgi

#!/usr/bin/perl require './form/jcode.pl'; $tempFile = './contact.html'; #■□■□■□■□■□■□■□■□■□ $hensin = 1; $kakunin_Gamen = 1; @hisuu = (); $hisuu_Email = 0; $thispl = 'form.cgi'; $mailprog = '/usr/sbin/sendmail'; $mailaddress = '受信用アドレスを入力しています'; $subject = 'HPよりお問い合せがあります'; $mailhead = "以下の内容が送信されてきました。"; $Ssubject = 'お問い合せありがとうございます'; $Smailhead = 'お問い合せありがとうございます $Smailfoot = ' '; #■□■□■□■□■□■□■□■□ #◆◆◆◆フォーム内容を確認 if ($ENV{'REQUEST_METHOD'} eq "POST") { read(STDIN, $buffer, $ENV{'CONTENT_LENGTH'}); } else { $buffer = $ENV{'QUERY_STRING'}; } foreach(@hisuu){#---------チェックボックス・ラジオボタンの必須項目チェック用 $hisuu_check{$_} =0; } @ERROR = (); @pairs = split(/&/, $buffer); foreach $pair (@pairs) { ($name, $value) = split(/=/, $pair); $name =~ tr/+/ /; $name =~ s/%([a-fA-F0-9][a-fA-F0-9])/pack("C", hex($1))/eg; $value =~ tr/+/ /; $value =~ s/%([a-fA-F0-9][a-fA-F0-9])/pack("C", hex($1))/eg; $value =~ s/<!--(.|\n)*-->//g; #-------------------SSIの禁止用 &jcode'convert(*name,'sjis'); &jcode'convert(*value,'sjis'); $FORM{$name} = $value; if($value ne ''){ push(@NAME,$name); push(@VALUE,$value); } #必須項目の記入判断 $hisuu_check{$name} =1;#---------チェックボックス・ラジオボタンの必須項目チェック用 if(!$value){#---------チェックボックス・ラジオボタン”以外”の必須項目チェック用 if($name ne 'Email'){ foreach(@hisuu){ if( $_ eq $name){ push(@ERROR,$name); } } } } }#foreach #◆◆◆◆確認画面を表示するのかメール送るのかの判断 if (!$FORM{'kakunin'}){ if($hisuu_Email){ if($FORM{Email}){ if( $FORM{Email} =~ /[^\x21-\x7E]/ || $FORM{Email} =~ /[\(\)<>,;:\\"\[\]]/ || $FORM{Email} !~ /^[^@]+@[^@]+$/ ) { push(@ERROR,'E-mailが正しくありません(全角文字・スペースが含まれていないかご確認ください)'); } }else{ push(@ERROR,'E-mail'); } } while (($name, $value) = each(%hisuu_check)) {#---------チェックボックス・ラジオボタンの必須項目チェック用 if(!$value){ push(@ERROR,$name); } } if(!@ERROR){ if($kakunin_Gamen){ &kakuninGamen; } else{ &okuru; } }else{ &error; } }else{ &okuru; } #◆◆◆◆確認画面を表示 sub kakuninGamen{ $write = '<table border="0" width="667" height="349" cellpadding="0" cellspacing="0" align="center" style="margin-top:0px; background:url(images/bg_tamago.jpg) right top no-repeat;"><tr><td valign="top">'; $write .= '<table border="0" width="400" cellpadding="0" cellspacing="0"><tr><td>'; $write .= "<form action=\"$thispl\" method=\"post\">"; $write .= '<tr><td colspan="2" height="50" varign="middle">以下の内容をご確認の上、よろしければ<b>「送信する」</b>ボタンをクリックして下さい。</td></tr>'; $write .= '<tr><td colspan="2"><hr noshade size="1" style="margin:3px 0 3px 0;"></td></tr>'; $x = 0; foreach (@NAME) { if($VALUE[$x]){ $write .= "<tr>\n"; $write .= "<input type=\"hidden\" name=\"$NAME[$x]\" value=\"$VALUE[$x]\">\n"; $VALUE[$x] =~ s/\n/<br>/g; $write .= "<td width=\"10%\" nowrap>$NAME[$x]:</td>\n"; $write .= "<td width=\"90%\">$VALUE[$x]</td>\n"; $write .= "</tr>\n"; $write .= '<td colspan="2"><hr noshade size="1" style="margin:3px 0 3px 0;"></td>'; $write .= "</tr>\n"; } $x++; } $write .= ' </table> <br /> <table border="0" cellpadding="0" cellspacing="0" width="667"><tr><td> <input type="hidden" name="kakunin" value="on" > <input type="submit" value="- 送信する -" class="inp"> <input type="button" name="back" onClick="history.back()" value="- 戻る -" class="inp"> </td></tr></table> </form> </td></tr></table> '; &pageWrite; } #◆◆◆◆確認画面を表示 sub pageWrite{ print "Content-Type: text/html; charset=Shift_JIS\n"; print "Content-Language: ja\n"; print "Pragma: no-cache;\n\n"; #テンプレート読んで書き出し open(TEMP,"$tempFile"); @temp = <TEMP>; close(TEMP); #配列をひとつの変数にまとめる $tempFlag = 1; foreach (@temp){ if($_ =~ /<!--__systemCheck__-->/){ if($tempFlag){ $tempFlag = 0; $tempMatome .= "<!--__write__-->\n"; }else{ $tempFlag = 1; } } if($tempFlag){ $tempMatome .= $_; } } $tempMatome =~ s/<!--__write__-->/$write/g; print $tempMatome; exit(0); }#sub kakuninGamen #◆◆◆◆メールを送ってサンクスページを表示 → 終了 sub okuru{ require "mimew.pl"; open(MAIL,"|$mailprog -t"); $mail_head = ""; $mail_head .= "Content-type: text/plain; charset=ISO-2022-JP\n"; $mail_head .= "Content-Transfer-Encoding: 7bit\n"; $mail_head .= "MIME-Version: 1.0\n"; $mail_head .= "Return-Path: $FORM{'Email'}\n"; $mail_head .= "From: $FORM{'Email'}\n"; $mail_head .= "To: $mailaddress\n"; if($bccaddress){ $mail_head .= "Bcc: $bccaddress\n"; } $mail_head .= "Subject: $subject\n\n"; $mail_head = &mimeencode($mail_head); $mail_message .= "$date\n"; $mail_message .= "$mailhead\n\n"; $mail_message .= "□□□□□□□□□□□□□□□□□□□□\n\n"; for($x = 0; $x < $#NAME; $x++) { if ($NAME[$x] ne 'kakunin'){ $mail_message .= "【 $NAME[$x] 】 "; $mail_message .= "$VALUE[$x]\n\n"; } } $mail_message .= "□□□□□□□□□□□□□□□□□□□□\n\n"; $mail_message .= "ホスト名:$host\n"; $mail_message .= "IPアドレス:$addr\n"; $mail_message .= "ブラウザ:$ENV{'HTTP_USER_AGENT'}\n"; &jcode'convert(*mail_message,'jis'); print MAIL $mail_head; print MAIL $mail_message; close (MAIL); #print "Location: $thanks\n\n"; if($hensin && $FORM{'Email'}){ &Hensin; } $write = '<table border="0" width="667" cellpadding="0" cellspacing="0" align="center" style="margin-top:0px; background:url(images/bg_tamago.jpg) right top no-repeat;"> <tr><td><br /><p style="height:250px;">お問い合せありがとうございます。</p></td></tr></table>'; &pageWrite; exit; } #◆◆◆◆エラーの表示 sub error{ print "Content-Type: text/html; charset=Shift_JIS\n"; print "Content-Language: ja\n"; print "Pragma: no-cache;\n\n"; print <<EOF; <HTML> <HEAD> <TITLE>エラー</TITLE> <style type="text/css"> <!-- td{font-size:12px;} --> </style> </head> <body bgcolor="#ffffff" text="#000000"> <center> <br><br><br> <table border="0" cellpadding="1" cellspacing="0" bgcolor="#ff6600"><tr><td> <table border="0" cellpadding="10" cellspacing="0" bgcolor="#ffffee"> <tr> <td class="hutuu"><font color="#009900">■</font> 恐れ入りますが、以下の項目は必ずご記入ください <font color="#009900">■</font></td> </tr> <tr> <td class="hutuu"><br> EOF $xx = 0; foreach $Error(@ERROR){ print "<font color=\"#cc0000\">【 $Error 】 </font>"; } if(!@ERROR){ if($Mlhusei){ print "<font color=\"#cc0000\">E-mailの記入が正しくありません</font>"; } } print <<EOF; <br><br></td> </tr> <tr> <td class="hutuu">ブラウザの戻るボタンで前のページに戻り、再度ご記入ください。</td> </tr> </table> </td></tr></table> </center> </body> </html> EOF exit(0); }

【やりたいこと】
・”確認画面へ”押下後、確認画面を表示して、メール送信

【試したこと】
・サーバー上の実行権限を既存のものと同じにした
・パスの確認

簡単なミスを見逃しているだけかもしれませんが、どなたかご教授ください。
どうぞよろしくお願いいたします。

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

itagagaki

2022/02/09 05:35

form.cgiファイルの文字コードはシフトJISですか?
m.ts10806

2022/02/09 06:05

Perlの質問タグもあったと思います

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

CGI

CGI(Common Gateway Interface)とは、Webサーバー上でユーザプログラム動作させる仕組みのこと。また、動かす前提のプログラムをCGIと呼ぶこともあります。HTMLなどの静的な情報に限らず、プログラムの処理結果をベースにした動的情報の提供が可能です。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。