C++:vectorを使った多次元配列の動的確保
下記の vector.cpp は、std::vector を使って多次元配列を動的に確保するためのプログラムです。
#include <iostream>
#include <vector>
using namespace std;
void showVectorSize(vector<double>& v1) {
cout << v1.size() << endl;
}
void showVectorSize(vector<vector<double>>& v2) {
cout << v2.size() << "," << v2.front().size() << endl;
}
void showVectorSize(vector<vector<vector<double>>>& v3) {
cout << v3.size() << "," << v3.front().size() << "," << v3.front().front().size() << endl;
}
int main() {
int n1 = 10;
int n2 = 20;
int n3 = 30;
vector<double> v1;
v1 = vector<double>(n1, 0);
cout << v1[1] << endl;
showVectorSize(v1);
vector<vector<double>> v2;
v2 = vector<vector<double>>(n1, vector<double>(n2, 0));
cout << v2[1][2] << endl;
showVectorSize(v2);
vector<vector<vector<double>>> v3;
v3 = vector<vector<vector<double>>>(n1, vector<vector<double>>(n2, vector<double>(n3, 0)));
cout << v3[1][2][3] << endl;
showVectorSize(v3);
}
注)コンパイルする時は、オプション -std=c++11 を付けて下さい。付けない場合は、入れ子になったテンプレート引数において、
vector<vector<double> >
のように、> と > の間に空白を入れる必要があります。
g++ -std=c++11 -O2 vector.cpp -o vector.exe
参考サイト
css
body {
color: #252525;
font-family: 'Verdana','MS PGothic','Courier','Lucida Grande','Times New Roman','Consolas','Meiryo','MS Gothic';
font-size: 13pt;
line-height: 150%;
letter-spacing: 1px;
background-color: #888fff;
margin: 20px 50px 20px 50px;
}
AjaxとServletの連携
Ajax と Servlet を連携するやり方について紹介します。サーブレットコンテナは Jetty を用いています。
注)Jetty は、サーブレットコンテナとして機能だけではなく、 Webサーバの機能も備えています。
ファイルの配置
まず、Jetty のzipファイルをダウンロードし、適当な場所(ここでは D:\sdk)で解凍します。 次に webappsフォルダの直下に好きな名前のフォルダ(ここでは webapp)を作成し、更にその下にWEB-INFフォルダを作成し、その中に web.xml を入れて下さい。
D:\sdk\jetty\webapps\webapp\WEB-INF\web.xml
D:\sdk\jetty\webapps\webapp\WEB-INF\classes\SampleServlet.class
注)web.xml、SampleAjax.htm は、UTF-8 で保存してください!
<web-app> <servlet> <servlet-name>sampleservlet</servlet-name> <servlet-class>SampleServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>sampleservlet</servlet-name> <url-pattern>sampleservlet</url-pattern> </servlet-mapping> </web-app>
注)SampleServlet1.class、SampleServlet2.class のように、サーブレットが複数ある場合は、<web-app>・・・</web-app>の中に複数記述してください。
1.Ajaxのみのサンプル(Servletなし)
<html>
<body>
<form name="io">
<input type="button" value="実行" onClick="get()">
<textarea id="output" cols="50" rows="5"></textarea>
</form>
<script>
function get() {
xhr = new XMLHttpRequest();
xhr.onload = setResponseText;
xhr.open("GET", "/webapp/hello.txt", true);
xhr.send();
}
</script>
<script>
function setResponseText() {
document.getElementById("output").innerHTML = xhr.responseText;
}
</script>
</body>
</html>
Hello Ajax!
Hello Ajax!
Hello Ajax!
Hello Ajax!
Hello Ajax!
2.AjaxとServletを使ったサンプル(XMLHttpRequest版)
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Ajax</title>
</head>
<body>
<form name="io">
<input type="button" name="execute" value="実行">
<input type="text" name="input1">
<input type="text" name="input2">
<input type="text" name="input3">
<output name="output"></output>
</form>
<script>
document.io.execute.addEventListener("click", function () {
var url = "/webapp/sampleservlet";
var value1 = document.io.input1.value;
var value2 = document.io.input2.value;
var value3 = document.io.input3.value;
var request = "input1" + "=" + value1 + "&" + "input2" + "=" + value2 + "&" + "input3" + "=" + value3;
var callback = function (response) {document.io.output.innerHTML = response["key1"] + "," + response["key2"] + "," + response["key3"];};
$post(url, request, callback);
});
</script>
<script>
function $post(url, request, callback) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
callback(JSON.parse(this.responseText));
}
};
xhr.open("post", url, true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(request);
}
</script>
</body>
</html>
3.AjaxとServletを使ったサンプル(jQuery版)
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Ajax</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
<form>
<input type="button" id="execute" value="実行">
<input type="text" id="input1">
<input type="text" id="input2">
<input type="text" id="input3">
<output id="output"></output>
</form>
<script>
$("#execute").on("click", function () {
var url = "/webapp/sampleservlet";
var request = {};
request["input1"] = $("#input1").val();
request["input2"] = $("#input2").val();
request["input3"] = $("#input3").val();
var callback = function (response) {$("#output").text(response["key1"] + "," + response["key2"] + "," + response["key3"]);};
$.post(url, request, callback);
});
</script>
</body>
</html>
4.Servletのサンプル(共通)
上記のXMLHttpRequest版及びjQuery版に共通のServletサンプルです。
尚、SampleServlet.java において、サーブレットからクライアントに送信するデータ形式(setContentType)を application/json にしています。
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.ServletException;
public class SampleServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException {
response.setContentType("application/json");
String parameter1 = request.getParameter("input1");
String parameter2 = request.getParameter("input2");
String parameter3 = request.getParameter("input3");
PrintWriter out = response.getWriter();
out.println("{" + "\"key1\"" + ":" + "\"" + parameter1 + "\"" + "," + "\"key2\"" + ":" + "\"" + parameter2 + "\"" + "," + "\"key3\"" + ":" + "\"" + parameter3 + "\"" + "}");
}
}
Servletのコンパイル方法
下記のバッチファイルをダブルクリックして SampleServlet.java をコンパイルします。
set JAVA_HOME=D:\sdk\jdk set path=%JAVA_HOME%\bin javac -cp D:\sdk\jetty\lib\servlet-api-3.1.jar *.java pause
コンパイルしたファイル(SampleServlet.class)を下記のフォルダに入れてください。
Webサーバの起動方法
下記のバッチファイルをダブルクリックすると Jetty が起動します。
set JAVA_HOME=D:\sdk\jdk set path=%JAVA_HOME%\bin cd /d D:\sdk\jetty java -jar start.jar
Webサーバへのアクセス方法
WebブラウザのURLに以下のように入力すれば、Webサーバにアクセスすることができます。
http://localhost:8080/webapp/SampleAjax.htm
参考サイト
- JavaScript初級者から中級者になろう
- 非同期リクエスト
- JavaScript Ajax実装の雛形
- XMLHttpRequestを使う
- Ajaxでサーブレットにアクセスする
- AjaxとServlet:多局面メモ
- URLエンコーディング
- AjaxにおけるJSONの利用
- jQueryのscriptタグsrc指定
- Google:JavaScript addEventListener コールバック関数 引数
- addEventListenerでイベントハンドラに引数を渡す方法
- Passing arguments to callback functions
- 引数をとるコールバック関数の実現の仕方
- リスナー関数に引数を渡す方法
- jQuery.post()
- Javascript:Send JSON Object with Ajax
- xmlHttpRequestでjson形式のデータ送信
- jQueryを利用せずにAjaxを利用するサンプル
- JettyでCGIを使えるように設定
- Google:ユーザ権限でJettyを起動
css
body {
color: #252525;
font-family: 'Verdana','MS PGothic','Courier','Lucida Grande','Times New Roman','Consolas','Meiryo','MS Gothic';
font-size: 13pt;
line-height: 150%;
letter-spacing: 1px;
background-color: #888fff;
margin: 20px 50px 20px 50px;
}
css
body {
color: #252525;
font-family: 'Verdana','MS PGothic','Courier','Lucida Grande','Times New Roman','Consolas','Meiryo','MS Gothic';
font-size: 13pt;
line-height: 150%;
letter-spacing: 1px;
background-color: #888fff;
margin: 20px 50px 20px 50px;
}
夏は花火だ!
最近、花火を見ていないので、久しぶりに見たいな!