Julia 単体ではコンソールアプリケーションしか作れませんが、サードパーティのパッケージを使うことでウェブアプリケーションを作ることができます。
そのひとつに WebIO + Mux を使う方法があります。
そして、WebIO から見て Muxがフロントエンドになります。
これらのパッケージを使うには Julia の対話モードから “]” を押してパッケージモードにし、add コマンドでインストールします。
pkg> add WebIO
pkg> add Mux
次のサンプルは ”Hello, World!” です。(Mux ページのサンプルを参考にしたもの)
using Mux
@app test = (
Mux.defaults,
page(respond("<h1>Hello World!</h1>")),
page("/user/:user", req -> "<h1>Hello, $(req[:params][:user])!</h1>"),
Mux.notfound()
)
serve(test, 2333)
println("Start 'test' server > ")
read(stdin, Char)
これを実行してブラウザで開くと下のようになります。(アドレスバーに http://localhost:2333 を入力する)
このプログラムの最後で read(stdin, Char) を実行していますが、これがないとプログラムが直ちに終了してしまうので注意してください。
もう少し、複雑な処理をしようとすると Mux 単体ではちょっとたいへんです。
というのも、Mux は HTTP の薄いラッパーで機能があまり高くありません。
それを補うために HttpCommon をインストールしておく必要があります。このパッケージはウェブでよくある共通処理を実装しています。
フォームの例
次の例は、フォームのテンプレートを読み込んでクライアントへ送り、クライアントから POST メソッドで送り返されたフォーム内容を解析して結果をフォームに埋め込んで返すものです。
この例は、２つのベクトルを受け取り、内積を計算し結果をフォームに埋め込んでクライアント (ブラウザ) に返すものです。
$ julia calc.jl Start 'calc' server > GET / POST / . $
Julia ソース (calc.jl)
using Mux
using HttpCommon
using LinearAlgebra
calc_html = "<h1>Error</h1>"
function calc_action(req)
open("./calc.html", "r") do f
global calc_html = read(f, String)
end
if req[:method] == "POST"
println("POST /")
data = req[:data]
n = length(data)
param = ""
for i = 1:n
param = string(param, Char(data[i]))
end
params = parsequerystring(param) # HttpCommon
sv1 = split(params["v1"], ",+") # 空白が + に置き換わっているため
sv2 = split(params["v2"], ",+")
v1 = Vector{Int32}(undef, length(sv1))
v2 = Vector{Int32}(undef, length(sv2))
n = length(v1)
for i = 1:n
v1[i] = parse(Int32, sv1[i])
end
n = length(v2)
for i = 1:n
v2[i] = parse(Int32, sv2[i])
end
# println(v1, " ", v2)
y = dot(v1, v2)
replace(calc_html, "%result%" => y)
else
println("GET /")
replace(calc_html, "%result%" => "")
end
end
@app calc = (
Mux.defaults,
page("/", req -> calc_action(req)),
Mux.notfound()
)
serve(calc, 2333) # http://localhost:2333
println("Start 'calc' server > ")
read(stdin, Char)
テンプレートファイル (calc.html)
<!DOCTYPE html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta charset = "utf-8" />
<title>Mux test</title>
<style>
body {
margin-left:5%;
margin-right:5%;
}
h1 {
text-align:center;
color:crimson;
padding:8px;
}
input[type="text"] {
border-radius: 3px;
height:32px;
padding:2px;
}
input[type="button"] {
border-radius: 3px;
height:32px;
}
fieldset {
border-width:0px;
}
.result {
font-size:12pt;
color:magenta;
padding:5px;
}
</style>
<script>
function button1Click() {
if (form1.v1.value == "" || form1.v2.value == "") {
alert("ベクトルの値が空欄です。");
return;
}
form1.submit();
}
</script>
</head>
<body>
<h1>ベクトルの内積</h1>
<br />
<form id="form1" method="POST" action="/" style="margin-left:10%;">
<p>数値の間は必ず ", " (カンマと空白1つ) にしてください。</p>
<fieldset>v1: <input type="text" name="v1" id="v1" size="50" placeholder="3, -1, 6" /></fieldset>
<fieldset>v2: <input type="text" name="v2" id="v2" size="50" placeholder="2, 1, 4" /></fieldset>
<fieldset><input type="button" id="button1" value=" 計算する " onclick="button1Click()" /></fieldset>
<br />
<p class="result" id="result">結果： %result%</p>
</form>
</body>
</html>
行列式の計算
この例はテンプレートやフォームを使わず、計算結果をブラウザに表示するだけのものです。
具体的には 3×3 の正方行列を乱数 (0:9) を使って10個作り、その行列式を計算して表示しています。
コンソールアプリケーションでは、計算結果が多いと見にくいのでこういう使い方が向いています。
Julia ソース (det.jl)
using LinearAlgebra
using Mux
using Printf
# 正方行列の次元
const N = 3
# 計算とHTML作成
function calc_dets()
s = "<h1>行列式の計算</h1>\n"
s *= "<hr /><br />\n"
for i = 1:10
A = rand(Int32(0):Int32(9), (N, N))
d = det(A)
s *= "<table>"
for j = 1:N
s *= "<tr>"
for k = 1:N
s *= "<td>"
if k == 1
s *= "| "
end
s *= @sprintf("%d", (A[j, k]))
if k == N
s *= " |"
end
s *= "</td>"
end
s *= "</tr>"
end
s *= "</table>\n"
s *= "<p>= $d</p><br />\n"
end
return s
end
# HTML ヘッダ部分
head = """
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta charset = "utf-8" />
<title>Determinants</title>
<style>
body { padding:50px; margin-left:5%; margin-right:5%;}
h1 { padding:10px; color:crimson; text-align:center;}
table, td { border-width: 0px; padding:3px;}
</style>
</head>
<body>
"""
# HTML フッタ部分
foot = """
<p> </p><p> </p>
</body>
</html>
"""
# HTML の内容
content = head * calc_dets() * foot
# アプリケーションの定義
@app the_app = (
Mux.defaults,
page(respond(content)),
Mux.notfound()
)
# 実行開始
serve(the_app, 2333)
println("Start 'det' server > ")
read(stdin, Char)
| | | (_| | | Version 1.7.0 (2021-11-30)
_/ |\__'_|_|_|\__'_| | Official https://julialang.org/ release
|__/ |
julia> Threads.nthreads()
4
Jura-Zakki 樹羅雑記 