OcsigenまたはYobaを使用した動的アプリケーションが返されます

寒い日曜日の朝、普通の人は何をしますか？ 誰でも答えます。寒い日曜日の朝、人が寝ています。 彼は一週間働き、リラックスしたいからです。

寒い日曜日の朝、プログラマは何をしますか？ 寒い日曜日の朝、プログラマーは熱いお茶を飲んでコードを書きます。 彼は朝が寒いのでお茶を飲みますが、まだ目が覚めていませんが、望んでいるのでコードを書きます。 プログラマーは常にコードを書きたいと思っていますが、お金のためにコードを書くのは平日だけで、これに非常に疲れており、週末は自分で休みます。



今朝は、Ocsigenの最初のアプリケーションを作成します。 公式のマニュアルを最初に知りたければいいのですが、マニュアルは不完全で、「??????」のような困惑した行でいっぱいなので、あまり期待しないでください。 フランス語の反則。 したがって、私がメインのマニュアルになります。



覚えているかもしれませんが、私たちはかつてヨバ語の通訳を書きました 。 それ以来、インタプリタはわずかに改善され、別のクラスに割り当てられ、入力に行を取り始め、出力に行を与え始めました（コンソールで作業する代わりに）。 ここでのタスクは、Yoba をGoogleの主要言語として紹介し 、YobaインタープリターをWebアプリケーションに変換することですが、単純なアプリケーションではなく、クライアントアプリケーションに変換します。 操作カウンターをクラスに追加して、あまりにも厚かましくならないようにしましたが、それでも同じです。ユーザーにサーバーではなくコンピューターで計算能力を使わせてください。



最初に、ocsigenサーバーをインストールする必要があります。 ディストリビューション用に2.0をコンパイルすることができていないため、 この指示に従ってバンドルサーバーをホームディレクトリにインストールします。 バンドルを正しくおいしいものにするには、makeを実行する前にMakefile.configを編集してそこに書き込みます。

LOCAL := ${HOME}/bin/ocsigen

DEV := YES

OCAMLDUCE := YES

OCLOSURE := YES

OTHERS := YES





OcamlとFindlibは収集されず、すでにリポジトリにあります。 今回はO'Closureは必要ありませんが、念のため収集します。これにより、後で酸素を再構築する必要がなくなります。あなた自身が興味を持っているか、私からの記事が必要な場合。



次の項目はファイル$ {HOME} /bin/ocsigen/etc/ocsigenserver/ocsigenserver.confをすぐに編集します：適切なポートがそこに書かれていることと、開始​​するユーザーの名前とグループを確認します。 次は、将来のサイトの構成を準備します。 $ {HOME} /bin/ocsigen/etc/ocsigenserver/conf.d/yoba.confを作成し、内容を入力します。

 <ocsigen> <server> <charset>utf-8</charset> <extension findlib-package="ocsigenserver.ext.staticmod"/> <extension findlib-package="ocsigenserver.ext.ocsipersist-sqlite"> <database file="ocsidb"/> </extension> <extension findlib-package="ocsigenserver.ext.deflatemod" /> <extension findlib-package="eliom.server"/> <host charset="utf-8" hostfilter="*"> <site path="" charset="utf-8"> <static dir="/home/username/yoba" /> <eliom module="/home/username/yoba/_build/server/yoba.cmo"> <cache-size>10000</cache-size> </eliom> </site> <deflate compress="only"> <type>application/x-javascript</type> </deflate> </host> </server> </ocsigen>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

コンテンツについて簡単に：

• staticmodを使用すると、サーバーは静的データを返すことができます（この場合、これはコンパイルされた.jsファイルになります
• ocsipersist-sqlite-永続データを操作できるようにします。これが必要な理由がわかります。
• deflatemodは、予想どおり、送信時にデータを押します。 以下では、サイト設定のdeflateセクションを見ることができます。これはjsのみを押すことを示しています。 注：圧縮方式（gzipまたはdeflate）を選択することはできません。クライアントの期待に基づいて自動的に選択されます。
• eliom.serverは、フレームワークのサーバー部分全体を提供します
• ホストのhostfilterパラメーターで、すべてのドメインに応答すると言います
• そして、サイトの空のパスを示して、サイトがドメインのルートにあると言います。 空の行を「yoba」などに置き換えると、すべての静的コンテンツと共にアドレスhostname / yobaにサイトが強制されます-明確な利益。同じドメインに複数のサイトを保持し、好きなようにシャッフルできます
• / home / username / yobaは、コード（およびコンパイル済みのyoba.jsファイル）が格納されたディレクトリになり、_build / serverには、コンパイル済みのサーバーモジュールになります。 もちろん、理想的には、コンパイルしてからコードを別のフォルダーに転送する必要がありますが、コンパイルされたモジュールと同じフォルダーに静的コンテンツを保存しないでください。

やった！ コードを書くことにします。

悪名高いフォルダー/ home /ユーザー名/ yoba /を作成し、 アーカイブをYoba言語でダウンロードします -言語自体は既に作成しましたが、少しファイルしてクラスに変換するのは面白くないので、すぐにそれを取ります。 同じフォルダーに解凍し、標準のMakefile.configとMakefile.rulesを同じ場所にダウンロードします。プロジェクトの構築は簡単ではなく、figファイルを最初から作成できます。

何かを修正し、すぐに最初の構文の革新について学びます。Eliomでは、コードをセクションに配置できます。 {server {...}}セクション（セクションのないコードと同じ）はサーバーでコンパイルおよび実行され、 {client {...}}セクションはクライアントでコンパイルされ、 {shared {...}}はあちこちからアクセスできます。

インタープリターがクライアントで動作するため、yobaLang.mlファイルの名前をyobaLang.eliomに変更して開き、最初に「{client {」行を追加し、最後に「;;」を置き換えます。 （2つのセミコロン-これはコードの最上位でのみ命令の終わりであり、セクション内では使用できなくなります）から「}}」へ。 生成されたocamllexおよびocamlyaccコードは、makefileを作成するときに同様に編集されます。

それまでの間、すべてを実行するファイルを作成しましょう。 たとえば、home.eliomと呼びます。

ファイルの先頭で、将来のためにモジュールを開き、すぐに訪問者に提供されるサンプルコードを含む行を作成します。

 {shared{ open Eliom_pervasives open Lwt open HTML5.M open Eliom_parameters open Eliom_request_info open Eliom_output.Html5 open Ocsigen_extensions let code_example = ref "                    1     2                                       1     50            " }}
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

次に、アプリケーションのモジュールを作成します。クライアントとサーバーの相互作用が正しく機能するために、すべてのサービスがアプリケーションに代わって登録されます。 幸いなことに、これは簡単です。

 module My_appl = Eliom_output.Eliom_appl ( struct let application_name = "yoba" end)
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

Yobeでコードを実行し、結果を返す関数を追加します。関数は純粋にクライアントになり、サーバーはそれについても知りません。

 {client{ let yoba_execute str = ( let yparser = new YobaLang.yoba_interpretator () in yparser#parse str; yparser#get_output) }}
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ユーザー要求を処理するサービスを作成します。 ocsigenでのサービスの作成は非常に簡単で便利です。各サービスは、方法と強く型付けされた（！）GET / POSTパラメーターのセットによって特徴付けられます。 したがって、サーバーは、リクエストに基づいてどのサービスがリクエストを処理するかを決定します。 パラメーターなしで要求を処理するデフォルトのサービス、1つのGETパラメーターで要求を処理する同じアドレスの2番目のサービス、1つのPOSTパラメーターで3番目のサービスを作成できます。 そして、彼らは混乱しないでしょう。 ただし、現時点では、必要なサービスは1つだけです。

 let empty_service = Eliom_services.service ~path:[""] ~get_params:(Eliom_parameters.unit) ();;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

パスは、サービスがサイトのデフォルトパスに沿って（Apacheのインデックスページとして）提供されることを象徴し、〜get_paramsで、サービスがパラメーターを受け入れないことを示しました。



ページテンプレートを作成します。

 let page_template code_input counter_value = html (head (title (pcdata "Yoba interpreter")) [] ) (body [ h1 [pcdata "Yoba! For human beings"]; p [pcdata "  !  —  !"]; div [ raw_textarea ~a:[a_id "clientcode"] ~name:"clientcode" ~rows:25 ~cols:60 ~value:code_input (); raw_button ~button_type:`Button ~name:"clientbutton" ~a:[a_id "clientbutton"] ~value:"!" [pcdata "!"]; ]; pre ~a:[a_id "clientoutput"] []; hr (); p [pcdata "-  : "; b [pcdata (string_of_int counter_value)]] ]);;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ご覧のとおり、すべてのページ要素は、厳密に定義されたパラメーターを入力として受け取る関数です。そのため、作成されたHTMLページの静的な類型化が実行されます。 そのため、html関数は2つのパラメーターを入力として受け入れます-1つは「Head」タイプで、もう1つは「Body」タイプです。 そしてdiv-div内にあることが許可されている要素のリストを入力として受け取ります。



しかし、私たちはもう少し詳しく説明します。 まず、page_template関数は、コードと訪問者カウンターという2つのパラメーターを入力として受け入れます。 1つ目はtextareaに配置され、2つ目は一番下の<p>タグの内側にあります。 第二に、raw_textareaおよびraw_button関数の名前はとても生です-正当な理由です。 同様の単純な非「raw_」関数がありますが、それらは、何らかのサービスを常に参照する素晴らしい、強く型付けされたフォーム内に要素を作成するように設計されていますパラメータ）。 しかし、テキストエリアとボタン（これは<input>タグではなく、HTML5の最も自然な<button>タグ）は何も送信しませんが、ページ内で戯れるので、フォームはありません。 第三に、インタープリターの結果を保存する特別な<pre>を作成しました。



ところで、私は訪問者のカウンターに言及しましたか？ 私は完全に忘れました、書きましょう。 これを行うには、LwtとOcsipersistの2つの新しいモジュールをすぐに理解します。 1つ目は協調スレッドの操作を担当し、2つ目は永続的なストレージを担当します。

酸素フローシステムは協調的です。 これは、新しいプロセス、呼び出しスタック、その他のがらくたの作成を必要とする従来のスレッドの代わりに、非常に軽量なスレッド（ほとんどすべての呼び出しに使用されるほど軽い）が得られることを意味します。 あらゆる種類のナンセンスを作成する代わりに、スレッドに目を向けて、コードにいわゆる コンパイラ自体が必要なすべてを実行し、デッドロックの可能性を最小限に抑える協力ポイント。

 let get_count = let counter_store = Ocsipersist.open_store "counter_store" in let cthr = Ocsipersist.make_persistent counter_store "countpage" 0 in let mutex = Lwt_mutex.create () in (fun () -> cthr >>= (fun c -> Lwt_mutex.lock mutex >>= (fun () -> Ocsipersist.get c >>= (fun oldc -> let newc = oldc + 1 in Ocsipersist.set c newc >>= (fun () -> Lwt_mutex.unlock mutex; return newc) ) ) ) ) ;;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

OCamlに慣れていない場合（最初にやったように）、私たちの機能がトリッキーであることに気付くでしょう。 Get_count自体は、ミューテックスとストレージオブジェクトを格納する「オブジェクト」です。 コードに「get_count」を記述すると、input（）を受け取り、すべての作業を実行する関数が返されます。 次に、関数に入ります。 すぐにトリッキーな演算子 ">> ="が表示されます。これは、最初の引数（スレッド）の結果を2番目の引数（新しいスレッドを作成する関数）の入力に渡す特別な演算子です。 正式には、オペレーターの署名は次のとおりです。

 val (>>=) : 'at -> ('a -> 'bt) -> 'bt
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

そして、最後のreturn関数はスレッドの結果を返します。

Ocsipersistを使用すると、何もわからなくてもすべてが明確になります。



どこでget_countを呼び出してページテンプレートを生成しますか？ そして、ここに彼女は、解釈関数です：

 let interpret code = let req = Eliom_request_info.get_ri () in let ref = match Lazy.force_val req.ri_referer with | None -> "" | Some x -> x in Ocsigen_messages.accesslog ("Referer: " ^ ref); get_count() >|= (page_template code);;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

この機能は、いくつかの興味深い機能を紹介します。 残念ながら、Oksigenは、リクエストに関する簡単な情報のみをログに書き込みます-誰、どのユーザーエージェント、どのホスト、どのページ、いつ。 また、リファラーを取得したかった。 さて、リクエストに関する情報を取得し、リファラーを引き出します。 再び巧妙に作成されています-存在しない可能性のある値（他の言語のNullなど）であり、レイジーコンピューティングにもラップされています。つまり、要求するまで、どこにも格納されていません。

別の新しい演算子 "> | ="は ">> ="に似ています-唯一の違いは、スレッドの作業の結果が、新しいスレッドがまったく返さない予定の関数の入力に渡されることです。



それで終わりです。 サービスを登録し、コードの解釈方法を学習します。

 My_appl.register empty_service (fun () () -> Eliom_services.onload {{ Js.Opt.iter (Dom_html.document##getElementById (Js.string "clientbutton")) ( fun clntbutton -> clntbutton##onclick <- Dom_html.handler (fun _ -> Js.Opt.iter (Dom_html.document##getElementById (Js.string "clientcode")) ( fun cdinput -> Js.Opt.iter (Dom_html.document##getElementById (Js.string "clientoutput")) ( fun cdoutput -> let cdinputarea = Dom_html.CoerceTo.textarea cdinput in Js.Opt.iter cdinputarea (fun x -> let i = Js.to_string x##value in cdoutput##innerHTML <- Js.string (yoba_execute i) ) ) ); Js._true ) ) }}; interpret !code_example);;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

{{...}}ブロックはクライアント関数のようなものです-ページのonloadハンドラーに登録します。

クライアントコードでは、構文が若干異なります。 Jsオブジェクトのメソッドにアクセスするには、単一のシャープではなく、ダブルが使用されるため、Dom_html.document ## getElementByIdは単純な「document.getElementById」に対応します。

ここで確認できる多数のJs.Opt.iterは、getElementById関数が必ずしも何も返さないという事実によるものです。 したがって、Js.Opt.iterは、結果が本当にそうである場合にのみ、結果に対してアクションを実行します。 したがって、探していたページ上の3つのオブジェクトには、4つのJs.Opt.iterが必要でした。 4-デフォルトでは、getElementById関数は最も一般的なプロパティのみを持つ要素型のオブジェクトを返すため。 そして、textareaのvalueプロパティに到達するために、オブジェクトをtextarea型にキャスト（Dom_html.CoerceTo）しようとしていますが、これは一般的な場合の結果を保証しません。



したがって、登録されたサービスハンドラーは2つのことだけを行います。ページの先頭でJsコードを呼び出し、上記のテンプレートを返します。



気配りのある読者は、なぜ最初にcode_exampleを文字列（ref）へのリンクとして宣言し、それをどこでも参照解除するのか、すでに気付いて疑問に思うかもしれません。 そして事は、ある時点で、私たちのヨーバは真に集団であるべきだということでした。 ユーザーが解釈して他の人に見せようとしたことを保存しましょう。

これを行うには、最初のサービスの隣に、特別に訓練された2番目のサービスを作成します。これは、コードを含む行を取得してcode_exampleに配置します。 JavaScriptからサービスを呼び出すには、Eliom_output.Camlに代わってサービスを作成します。

 let update_code_service = Eliom_output.Caml.register_service ~path:["update code"] ~get_params:(string "f") (fun f () -> code_example := f; return ());;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

次に、クライアント関数（最も内部的なもの）を変更して、1行だけ追加します。

  let i = Js.to_string x##value in ignore(Eliom_client.call_caml_service ~service:%update_code_service i ()); cdoutput##innerHTML <- Js.string (yoba_execute i)
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

出来上がり！ これで、ページにアクセスしたすべての人に、最後に実行されたコードが表示されます。 確かに、サーバーを再起動しても、この例は元の場所に戻ります。



最後に、Makefileを作成します。

 MODULE = yoba APP = yoba include Makefile.config SERVERFILES := home.eliom CLIENTFILES := yobaType.ml yobaLexer.eliom yobaParser.eliom yobaLang.eliom home.eliom SERVERLIB := -package eliom.server,ocsigenserver,lwt CLIENTLIB := -package js_of_ocaml INCLUDES = EXTRADIRS = include Makefile.rules yobaParser.eliom: ocamlyacc yobaParser.mly echo '{client{' >yobaParser.eliom cat yobaParser.ml >>yobaParser.eliom echo '}}' >>yobaParser.eliom sed -i 's/;;//' yobaParser.eliom rm yobaParser.ml yobaParser.mli yobaLexer.eliom: yobaParser.eliom ocamllex yobaLexer.mll echo '{client{' >yobaLexer.eliom cat yobaLexer.ml >>yobaLexer.eliom echo '}}' >>yobaLexer.eliom sed -i 's/;;//' yobaLexer.eliom rm yobaLexer.ml _build/client/yobaLexer.cmo: _build/client/yobaParser.cmo _build/client/yobaLang.cmo: _build/client/yobaLexer.cmo _build/client/yobaParser.cmo $(STATICDIR)/$(APP).js: _build/client/${MODULE}.cmo ${JS_OF_ELIOM} -jsopt -pretty -verbose ${CLIENTLIB} -o $@ $^ #yui-compressor --charset utf-8 $@ > $@_min #mv $@_min $@ pack: $(STATICDIR)/$(APP).js
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

yobaLexer.eliomとyobaParser.eliomを生成する必要があるため、このための適切なルールを作成しました。 同様に、デフォルトの依存関係ジェネレーターは、レクサーとパーサーをコンパイルする順序の決定に対応していないため、いくつかのルールで彼を支援しました。

これで実行できます：

make depend

make

make pack





最初の呼び出しはコンパイル順序を生成し、2番目はサーバーコードをコンパイルし、3番目はサーバーパーツによって自動的に呼び出されるjavascriptファイルを生成しますが、この呼び出しはページテンプレートに登録しませんでした。 yui-compressorへの呼び出しと後続のmvのコメントを外すと、jsコードを少し圧縮できます（私の場合、400kbから209kbまで）。

最後にocsigenserverアセンブリから通知されたエクスポートPATHを記述して、すべての指示を完了する必要があります。



その後、$ HOME / bin / ocsigen / binに移動して、。/ ocsigenserverと言います。

ブラウザを開いて、解釈を試みてください。 そして、あなたが怠tooすぎるなら、あなたは私と戯れることができます： sorokdva.net