<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>WebAssembly | Men of Letters（メン・オブ・レターズ） &#8211; 論理的思考/業務改善/プログラミング</title>
	<atom:link href="https://laboratory.kazuuu.net/category/webassembly/feed/" rel="self" type="application/rss+xml" />
	<link>https://laboratory.kazuuu.net</link>
	<description></description>
	<lastBuildDate>Thu, 22 Dec 2022 20:43:06 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9</generator>

<image>
	<url>https://laboratory.kazuuu.net/wp-content/uploads/2021/02/cropped-L-32x32.png</url>
	<title>WebAssembly | Men of Letters（メン・オブ・レターズ） &#8211; 論理的思考/業務改善/プログラミング</title>
	<link>https://laboratory.kazuuu.net</link>
	<width>32</width>
	<height>32</height>
</image> 
<atom:link rel="hub" href="https://pubsubhubbub.appspot.com"/><atom:link rel="hub" href="https://pubsubhubbub.superfeedr.com"/><atom:link rel="hub" href="https://websubhub.com/hub"/>	<item>
		<title>Emscriptenの組み込みのシンプルなHTTPサーバーを使用する</title>
		<link>https://laboratory.kazuuu.net/use-emscriptens-built-in-simple-http-server/</link>
					<comments>https://laboratory.kazuuu.net/use-emscriptens-built-in-simple-http-server/#respond</comments>
		
		<dc:creator><![CDATA[小林]]></dc:creator>
		<pubDate>Thu, 22 Dec 2022 20:43:06 +0000</pubDate>
				<category><![CDATA[WebAssembly]]></category>
		<guid isPermaLink="false">https://laboratory.kazuuu.net/?p=12937</guid>

					<description><![CDATA[Emscriptenの組み込みのシンプルなHTTPサーバーを使用してみます。 この記事は、前回公開した「EmscriptenでC言語のプログラムをHTMLとJavaScriptに変換する」という記事の続きとなります。 目 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>Emscriptenの組み込みのシンプルなHTTPサーバーを使用してみます。</p>
<p>この記事は、前回公開した「<a href="https://laboratory.kazuuu.net/convert-c-programs-to-html-and-javascript-with-emscripten">EmscriptenでC言語のプログラムをHTMLとJavaScriptに変換する</a>」という記事の続きとなります。</p>

  <div id="toc" class="toc tnt-number toc-center tnt-number border-element"><input type="checkbox" class="toc-checkbox" id="toc-checkbox-2" checked><label class="toc-title" for="toc-checkbox-2">目次</label>
    <div class="toc-content">
    <ol class="toc-list open"><li><a href="#toc1" tabindex="0">■環境</a></li><li><a href="#toc2" tabindex="0">■簡単なC言語のプログラムを作成しコンパイル</a></li><li><a href="#toc3" tabindex="0">■Webブラウザで生成されたファイルにアクセスする</a></li></ol>
    </div>
  </div>

<h2><span id="toc1">■環境</span></h2>
<p>Windows10</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1.png"><img decoding="async" class="alignnone size-medium wp-image-12928" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1-300x53.png" alt="" width="300" height="53" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1-300x53.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1-1024x181.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1-768x136.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>&gt;emcc &#8211;version</p>
<p>emcc (Emscripten gcc/clang-like replacement + linker emulating GNU ld) 3.1.15 (8b4443a87f5eab5dbb9adb690f9ebed0a9da4bd9)</p>
<h2><span id="toc2">■簡単なC言語のプログラムを作成しコンパイル</span></h2>
<p><a href="https://laboratory.kazuuu.net/convert-c-programs-to-html-and-javascript-with-emscripten">「hello.c」という簡単なC言語のプログラムのファイルを作成</a>し、コンパイルを行います。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1.png"><img decoding="async" class="alignnone size-medium wp-image-12938" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-300x156.png" alt="" width="300" height="156" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-300x156.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-1024x534.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-768x401.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>コンパイルが成功すると、「hello.c」というファイルを保存した先にhtml,js,wasmファイルの3つが生成されます。今回は「test_html」というフォルダを作成し、その中にコンパイルしています。</p>
<h2><span id="toc3">■Webブラウザで生成されたファイルにアクセスする</span></h2>
<p>生成後、Webブラウザで生成されたファイルにアクセスしますが、この時にEmscriptenの組み込みのシンプルなHTTPサーバーを使用します。</p>
<pre>test_html&gt; emrun --no_browser --port 8080 hello.html</pre>
<p>使用するために、Windows10のコマンドプロンプトを起動し、cdコマンドで「test_html」フォルダ内に移動し、上記のコマンドを入力し、Enterキーを押します。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-1.png"><img decoding="async" class="alignnone size-medium wp-image-12939" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-1-300x74.png" alt="" width="300" height="74" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-1-300x74.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-1-1024x252.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-1-768x189.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-121613-1-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<pre>Web server root directory: C:\Users\user_\test_html
Now listening at http://0.0.0.0:8080/</pre>
<p>入力すると、上記のメッセージが出力されます。出力後、Webブラウザ（今回はGoogle chrome）を起動し、アドレスバーに「http://0.0.0.0:8080/」を入力し、アクセスします。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122138-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12940" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122138-1-300x142.png" alt="" width="300" height="142" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122138-1-300x142.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122138-1-1024x484.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122138-1-768x363.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122138-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>アクセスすると、「このサイトにアクセスできません http://0.0.0.0:8080/ のウェブページは一時的に停止しているか、新しいウェブアドレスに移動した可能性があります。ERR_ADDRESS_INVALID」と表示される場合があります。このような場合は、そもそも「0.0.0.0」を宛先に使うのは誤りであり、「http://127.0.0.1:8080/」か、「http://localhost:8080/」に変更し、アクセスします。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122554-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12941" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122554-1-300x124.png" alt="" width="300" height="124" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122554-1-300x124.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122554-1-1024x424.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122554-1-768x318.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122554-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>アクセスすると、作成したC言語のプログラムが、JavaScriptに変換され、C言語のプログラム内の処理である「文字列の出力」が行われたことを確認できました。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122809-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12942" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122809-1-300x78.png" alt="" width="300" height="78" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122809-1-300x78.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122809-1-1024x267.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122809-1-768x200.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-122809-1.png 1249w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>これでも確認できるのですが、コマンドプロンプト上を確認すると、上記のようなメッセージが出力され、JavaScriptに変換されたC言語のプログラムの処理が出力されません。</p>
<pre>&gt;emcc --emrun hello.c -s WASM=1 -o hello.html</pre>
<p>これを上記のコマンドを用いてコードを再コンパイルしてみます。再コンパイル後、再度HTTPサーバーを起動させてWebページにアクセスしてみます。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-123259.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12943" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-123259-300x120.png" alt="" width="300" height="120" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-123259-300x120.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-123259-1024x410.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-123259-768x307.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-123259.png 1254w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>アクセスすると、先程と同じようにWebページが表示されます。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03_1-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12944" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03_1-1-300x145.png" alt="" width="300" height="145" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03_1-1-300x145.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03_1-1-1024x494.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03_1-1-768x370.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03_1-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>表示されますが、コマンドプロンプト上を確認すると、JavaScriptに変換されたC言語のプログラムの処理が出力されていることが確認できました。このため、Emscriptenの組み込みのシンプルなHTTPサーバーを使用する場合は、再コンパイルして利用することを推奨します。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://laboratory.kazuuu.net/use-emscriptens-built-in-simple-http-server/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>EmscriptenでC言語のプログラムをHTMLとJavaScriptに変換する</title>
		<link>https://laboratory.kazuuu.net/convert-c-programs-to-html-and-javascript-with-emscripten/</link>
					<comments>https://laboratory.kazuuu.net/convert-c-programs-to-html-and-javascript-with-emscripten/#respond</comments>
		
		<dc:creator><![CDATA[小林]]></dc:creator>
		<pubDate>Wed, 21 Dec 2022 20:43:06 +0000</pubDate>
				<category><![CDATA[WebAssembly]]></category>
		<guid isPermaLink="false">https://laboratory.kazuuu.net/?p=12927</guid>

					<description><![CDATA[EmscriptenでC言語のプログラムをHTMLとJavaScriptに変換してみます。 目次 ■環境■簡単なC言語のプログラムを作成する■コード■コンパイルする■WebAssemblyコードのロードと実行・検証 ■環 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>EmscriptenでC言語のプログラムをHTMLとJavaScriptに変換してみます。</p>

  <div id="toc" class="toc tnt-number toc-center tnt-number border-element"><input type="checkbox" class="toc-checkbox" id="toc-checkbox-4" checked><label class="toc-title" for="toc-checkbox-4">目次</label>
    <div class="toc-content">
    <ol class="toc-list open"><li><a href="#toc1" tabindex="0">■環境</a></li><li><a href="#toc2" tabindex="0">■簡単なC言語のプログラムを作成する</a><ol><li><a href="#toc3" tabindex="0">■コード</a></li></ol></li><li><a href="#toc4" tabindex="0">■コンパイルする</a></li><li><a href="#toc5" tabindex="0">■WebAssemblyコードのロードと実行・検証</a></li></ol>
    </div>
  </div>

<h2><span id="toc1">■環境</span></h2>
<p>Windows10</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12928" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1-300x53.png" alt="" width="300" height="53" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1-300x53.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1-1024x181.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1-768x136.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-085108-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>&gt;emcc &#8211;version</p>
<p>emcc (Emscripten gcc/clang-like replacement + linker emulating GNU ld) 3.1.15 (8b4443a87f5eab5dbb9adb690f9ebed0a9da4bd9)</p>
<h2><span id="toc2">■簡単なC言語のプログラムを作成する</span></h2>
<p>EmscriptenでC言語のプログラムをHTMLとJavaScriptに変換してみますので、まずはC言語のプログラムを作成します。</p>
<h3><span id="toc3">■コード</span></h3>
<pre>#include 

int main() {
    printf("Hello World!!!!!!!!!!!!\n");
}</pre>
<p>今回は、main()という関数を定義し、関数が呼び出された時の処理としては、printf()を用いて括弧内に引数,パラメータとして渡した文字列を出力させるものです。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090235-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12929" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090235-1-300x143.png" alt="" width="300" height="143" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090235-1-300x143.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090235-1-1024x489.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090235-1-768x367.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090235-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>このファイルを「hello.c」という名前で保存します。保存先は今回「C:\Users\user_（フォルダパス）」となります。</p>
<h2><span id="toc4">■コンパイルする</span></h2>
<p>保存後、コンパイルするために、Windows10のコマンドプロンプトを起動します。</p>
<pre>C:\Users\user_&gt;emcc hello.c -o hello.html</pre>
<p>起動後、上記のコマンドを入力し、Enterキーを押します。「-o」オプションで、Emscriptenにコードを実行するためのHTMLやjsファイルなどを生成します。今回は「hello.html」というHTMLファイルなどが生成されます。</p>
<p>Enterキーを押すと何も出力されませんが、コンパイルが成功します。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090755-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12930" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090755-1-300x129.png" alt="" width="300" height="129" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090755-1-300x129.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090755-1-1024x441.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090755-1-768x331.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-090755-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>成功後、「hello.c」というファイルを保存した先を確認すると、html,js,wasmファイルが生成されていることが確認できました。</p>
<h2><span id="toc5">■WebAssemblyコードのロードと実行・検証</span></h2>
<p>確認ができましたので、これらのファイルの実行・検証を行っていきます。今回は、XAMPPを使用し、Apacheでローカルホストの設定を行い実行・検証を行います。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091324-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12932" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091324-1-300x152.png" alt="" width="300" height="152" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091324-1-300x152.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091324-1-1024x519.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091324-1-768x389.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091324-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>先程生成された3つのファイルをXAMPPのインストール先のhtdocsフォルダ内に移動させますが、今回はhtdocsフォルダ内に「test」というフォルダを新たに作成し、そこに移動させています。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091533-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12933" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091533-1-300x201.png" alt="" width="300" height="201" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091533-1-300x201.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091533-1-1024x686.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091533-1-768x514.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-091533-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>移動後、「XAMPP Control Panel」を起動し、パネル内の「Module」の「Apache」で「Actions」の「Start」ボタンをクリックします。クリックすると、Apacheが起動します。</p>

<a rel="noopener" href="http://localhost/test/hello.html" title="404 Not Found" class="blogcard-wrap external-blogcard-wrap a-wrap cf" target="_blank"><div class="blogcard external-blogcard eb-left cf"><div class="blogcard-label external-blogcard-label"><span class="fa"></span></div><figure class="blogcard-thumbnail external-blogcard-thumbnail"><img loading="lazy" decoding="async" src="https://s.wordpress.com/mshots/v1/http%3A%2F%2Flocalhost%2Ftest%2Fhello.html?w=160&#038;h=90" alt="" class="blogcard-thumb-image external-blogcard-thumb-image" width="160" height="90" /></figure><div class="blogcard-content external-blogcard-content"><div class="blogcard-title external-blogcard-title">404 Not Found</div><div class="blogcard-snippet external-blogcard-snippet"></div></div><div class="blogcard-footer external-blogcard-footer cf"><div class="blogcard-site external-blogcard-site"><div class="blogcard-favicon external-blogcard-favicon"><img loading="lazy" decoding="async" src="https://www.google.com/s2/favicons?domain=http://localhost/test/hello.html" alt="" class="blogcard-favicon-image external-blogcard-favicon-image" width="16" height="16" /></div><div class="blogcard-domain external-blogcard-domain">localhost</div></div></div></div></a></pre>
<p>起動後、Webブラウザ（今回はGoogle chrome）を起動し、アドレスバーに今回は上記のURLを入力しアクセスします。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-092008.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12934" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-092008-300x128.png" alt="" width="300" height="128" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-092008-300x128.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-092008-1024x435.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-092008-768x327.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-03-092008.png 1350w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>アクセスすると、「powered by emscripten」などと表記されたページが表示されます。ページ内内で、今回作成したC言語のプログラムが、JavaScriptに変換され、C言語のプログラム内の処理である「文字列の出力」が行われたことを確認できました。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://laboratory.kazuuu.net/convert-c-programs-to-html-and-javascript-with-emscripten/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>WebAssemblyのインストールと使用（Windows10）</title>
		<link>https://laboratory.kazuuu.net/installing-webassembly-windows-10/</link>
					<comments>https://laboratory.kazuuu.net/installing-webassembly-windows-10/#respond</comments>
		
		<dc:creator><![CDATA[小林]]></dc:creator>
		<pubDate>Fri, 01 Jul 2022 23:26:17 +0000</pubDate>
				<category><![CDATA[WebAssembly]]></category>
		<guid isPermaLink="false">https://laboratory.kazuuu.net/?p=12897</guid>

					<description><![CDATA[WebAssemblyのインストールと使用について解説しています。（Windows10） 目次 ■PC環境■EmscriptenSDKのインストール■PATH及びその他の環境変数をアクティブする■インストールの確認■C/ [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>WebAssemblyのインストールと使用について解説しています。（Windows10）</p>

  <div id="toc" class="toc tnt-number toc-center tnt-number border-element"><input type="checkbox" class="toc-checkbox" id="toc-checkbox-6" checked><label class="toc-title" for="toc-checkbox-6">目次</label>
    <div class="toc-content">
    <ol class="toc-list open"><li><a href="#toc1" tabindex="0">■PC環境</a></li><li><a href="#toc2" tabindex="0">■EmscriptenSDKのインストール</a></li><li><a href="#toc3" tabindex="0">■PATH及びその他の環境変数をアクティブする</a></li><li><a href="#toc4" tabindex="0">■インストールの確認</a></li><li><a href="#toc5" tabindex="0">■C/C++ファイルを作成しコンパイルする</a><ol><li><a href="#toc6" tabindex="0">■コード</a></li><li><a href="#toc7" tabindex="0">■実行・検証</a></li><li><a href="#toc8" tabindex="0">■コード</a></li></ol></li><li><a href="#toc9" tabindex="0">■「&#8217;emcc&#8217; は、内部コマンドまたは外部コマンド、 操作可能なプログラムまたはバッチ ファイルとして認識されていません。」の対処</a></li></ol>
    </div>
  </div>

<h2><span id="toc1">■PC環境</span></h2>
<p>&gt;Windows 10</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/06/2022-06-07-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12528" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/06/2022-06-07-1-300x282.png" alt="" width="300" height="282" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/06/2022-06-07-1-300x282.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/06/2022-06-07-1-1024x963.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/06/2022-06-07-1-768x723.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/06/2022-06-07-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>&gt;git &#8211;version</p>
<p>git version 2.35.1.windows.2</p>
<p>&gt;node &#8211;version</p>
<p>v16.14.0</p>
<h2><span id="toc2">■EmscriptenSDKのインストール</span></h2>
<p>まずは、EmscriptenSDKのインストールを行いますので、emsdkリポジトリのクローンを作成します。（<a href="https://github.com/emscripten-core/emsdk">https://github.com/emscripten-core/emsdk</a>）</p>
<p>クローンを作成するために、Windows10のコマンドプロンプトを起動します。</p>
<pre>&gt;git clone https://github.com/emscripten-core/emsdk.git</pre>
<p>起動後、上記のコマンドを入力し、Enterキーを押します。「git clone」コマンドで、リポジトリのクローンを作成します。</p>
<pre>Cloning into 'emsdk'...
remote: Enumerating objects: 3330, done.
remote: Counting objects: 100% (49/49), done.
remote: Compressing objects: 100% (34/34), done.
remote: Total 3330 (delta 26), reused 30 (delta 14), pack-reused 3281
Receiving objects: 100% (3330/3330), 1.95 MiB | 1.76 MiB/s, done.
Resolving deltas: 100% (2170/2170), done.</pre>
<p>Enterキーを上記のメッセージが出力され、クローンの作成が開始します。開始後、「done」と出力されます。これでemsdkリポジトリのクローンの作成完了となります。</p>
<pre>&gt;cd emsdk</pre>
<p>作成後、上記のコマンドを入力し、Enterキーを押します。「cd」コマンドで「emsdk」ディレクトリ内に移動します。</p>
<pre>&gt;emsdk install latest</pre>
<p>移動後、上記のコマンドを入力し、Enterキーを押します。Emscriptenのインストールを行います。</p>
<pre>Resolving SDK alias 'latest' to '3.1.15'
Resolving SDK version '3.1.15' to 'sdk-releases-upstream-568a46a9fb7e1f1686a6f7216b3dc976f28d2a79-64bit'
Installing SDK 'sdk-releases-upstream-568a46a9fb7e1f1686a6f7216b3dc976f28d2a79-64bit'..
Installing tool 'node-14.18.2-64bit'..
Downloading: C:/Users/user_/emsdk/zips/node-v14.18.2-win-x64.zip from https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/node-v14.18.2-win-x64.zip, 30570907 Bytes
Unpacking 'C:/Users/user_/emsdk/zips/node-v14.18.2-win-x64.zip' to 'C:/Users/user_/emsdk/node/14.18.2_64bit'
Done installing tool 'node-14.18.2-64bit'.
Installing tool 'python-3.9.2-nuget-64bit'..
Downloading: C:/Users/user_/emsdk/zips/python-3.9.2-4-amd64+pywin32.zip from https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/python-3.9.2-4-amd64+pywin32.zip, 14413267 Bytes
Unpacking 'C:/Users/user_/emsdk/zips/python-3.9.2-4-amd64+pywin32.zip' to 'C:/Users/user_/emsdk/python/3.9.2-nuget_64bit'
Done installing tool 'python-3.9.2-nuget-64bit'.
Installing tool 'java-8.152-64bit'..
Downloading: C:/Users/user_/emsdk/zips/portable_jre_8_update_152_64bit.zip from https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/portable_jre_8_update_152_64bit.zip, 69241499 Bytes
Unpacking 'C:/Users/user_/emsdk/zips/portable_jre_8_update_152_64bit.zip' to 'C:/Users/user_/emsdk/java/8.152_64bit'
Done installing tool 'java-8.152-64bit'.
Installing tool 'releases-upstream-568a46a9fb7e1f1686a6f7216b3dc976f28d2a79-64bit'..
Downloading: C:/Users/user_/emsdk/zips/568a46a9fb7e1f1686a6f7216b3dc976f28d2a79-wasm-binaries.zip from https://storage.googleapis.com/webassembly/emscripten-releases-builds/win/568a46a9fb7e1f1686a6f7216b3dc976f28d2a79/wasm-binaries.zip, 415658653 Bytes
Unpacking 'C:/Users/user_/emsdk/zips/568a46a9fb7e1f1686a6f7216b3dc976f28d2a79-wasm-binaries.zip' to 'C:/Users/user_/emsdk/upstream'
Done installing tool 'releases-upstream-568a46a9fb7e1f1686a6f7216b3dc976f28d2a79-64bit'.
Done installing SDK 'sdk-releases-upstream-568a46a9fb7e1f1686a6f7216b3dc976f28d2a79-64bit'.</pre>
<p>Enterキーを押すと、インストールが開始され「Done installing tool」、「Done installing SDK」と出力されます。これでインストールは完了となります。</p>
<h2><span id="toc3">■PATH及びその他の環境変数をアクティブする</span></h2>
<p>完了後、PATH及びその他の環境変数をアクティブにします。</p>
<pre>&gt;emsdk_env.bat</pre>
<p>アクティブにする場合、上記のコマンドを入力し、Enterキーを押します。</p>
<pre>Adding directories to PATH:
PATH += C:\Users\user_\emsdk

Setting environment variables:
PATH = C:\Users\user_\emsdk;C:\Program Files (x86)\Common Files\Oracle\Java\javapath;C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v11.5\bin;C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v11.5\libnvvp;C:\Program Files (x86)\Python37-32\Scripts\;C:\Program Files (x86)\Python37-32\;C:\Program Files\Python36\Scripts\;C:\Program Files\Python36\;C:\Program Files\Python38\Scripts\;C:\Program Files\Python38\;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\WINDOWS\System32\OpenSSH\;C:\Users\user_\AppData\Roaming\Python\Python38\Scripts\;C:\Program Files\MongoDB\Server\4.4\bin\;C:\xampp\php;C:\ProgramData\ComposerSetup\bin;C:\Program Files (x86)\Common Files\Sony Shared\FeliCaLibrary;C:\Program Files\Common Files\Sony Shared\FeliCaLibrary;C:\Program Files (x86)\Common Files\Sony Shared\FeliCaNFCLibrary;C:\Program Files\Common Files\Sony Shared\FeliCaNFCLibrary;C:\Program Files\NVIDIA Corporation\Nsight Compute 2021.3.0\;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\erl-24.1.7\bin;C:\Program Files (x86)\Elixir\bin;C:\WINDOWS\system32\config\systemprofile\.mix\escripts;C:\Program Files\nodejs\;C:\Program Files\PostgreSQL\14\bin;C:\Program Files\Git\cmd;C:\kotlinc\bin;C:\Program Files\OpenSSL-Win64\bin;C:\Program Files\Amazon\AWSCLIV2\;C:\Program Files\Docker\Docker\resources\bin;C:\ProgramData\DockerDesktop\version-bin;C:\Program Files\GTK3-Runtime Win64\bin;C:\Program Files\Amazon\AWSSAMCLI\bin\;C:\Users\user_\.pyenv\pyenv-win\bin;C:\Users\user_\.pyenv\pyenv-win\shims;C:\Users\user_\AppData\Local\Microsoft\WindowsApps;C:\Users\user_\AppData\Local\Programs\Microsoft VS Code\bin;C:\Users\user_\AppData\Roaming\Composer\vendor\bin;C:\Users\user_\AppData\Roaming\npm;C:\Program Files\heroku\bin;C:\terraform;C:\Program Files (x86)\GnuWin32\bin;C:\Program Files (x86)\zip-3.0-bin\bin;C:\Program Files (x86)\bzip2-1.0.5-bin\bin;
EMSDK = C:/Users/user_/emsdk
EM_CONFIG = C:\Users\user_\emsdk\.emscripten
Clearing existing environment variable: EMSDK_PY</pre>
<p>Enterキーを押すと、上記のメッセージが出力されます。「Clearing existing environment variable:（既存の環境変数のクリア）」と出力され、環境変数がアクティブになります。</p>
<h2><span id="toc4">■インストールの確認</span></h2>
<pre>&gt;emcc -v</pre>
<p>環境変数がアクティブになった後に、インストールの確認を行うために、上記のコマンドを入力し、Enterキーを押します。</p>
<pre>'emcc' は、内部コマンドまたは外部コマンド、
操作可能なプログラムまたはバッチ ファイルとして認識されていません。</pre>
<p>Enterキーを押すと、上記のようなメッセージが出力される場合は、正常にインストールが完了していません。</p>
<pre>&gt;emsdk activate latest</pre>
<p>なお、今回はEmscripten用の設定の更新を行っていなかったため、「認識されていません」と出力したので、上記のコマンドを入力し、Enterキーを押します。</p>
<pre>Resolving SDK alias 'latest' to '3.1.15'
Resolving SDK version '3.1.15' to 'sdk-releases-upstream-568a46a9fb7e1f1686a6f7216b3dc976f28d2a79-64bit'
Setting the following tools as active:
   node-14.18.2-64bit
   python-3.9.2-nuget-64bit
   java-8.152-64bit
   releases-upstream-568a46a9fb7e1f1686a6f7216b3dc976f28d2a79-64bit

Adding directories to PATH:
PATH += C:\Users\user_\emsdk\node\14.18.2_64bit\bin
PATH += C:\Users\user_\emsdk\upstream\emscripten

Setting environment variables:
PATH = C:\Users\user_\emsdk\node\14.18.2_64bit\bin;C:\Users\user_\emsdk\upstream\emscripten;C:\Users\user_\emsdk;C:\Program Files (x86)\Common Files\Oracle\Java\javapath;C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v11.5\bin;C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v11.5\libnvvp;C:\Program Files (x86)\Python37-32\Scripts\;C:\Program Files (x86)\Python37-32\;C:\Program Files\Python36\Scripts\;C:\Program Files\Python36\;C:\Program Files\Python38\Scripts\;C:\Program Files\Python38\;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\WINDOWS\System32\OpenSSH\;C:\Users\user_\AppData\Roaming\Python\Python38\Scripts\;C:\Program Files\MongoDB\Server\4.4\bin\;C:\xampp\php;C:\ProgramData\ComposerSetup\bin;C:\Program Files (x86)\Common Files\Sony Shared\FeliCaLibrary;C:\Program Files\Common Files\Sony Shared\FeliCaLibrary;C:\Program Files (x86)\Common Files\Sony Shared\FeliCaNFCLibrary;C:\Program Files\Common Files\Sony Shared\FeliCaNFCLibrary;C:\Program Files\NVIDIA Corporation\Nsight Compute 2021.3.0\;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\erl-24.1.7\bin;C:\Program Files (x86)\Elixir\bin;C:\WINDOWS\system32\config\systemprofile\.mix\escripts;C:\Program Files\nodejs\;C:\Program Files\PostgreSQL\14\bin;C:\Program Files\Git\cmd;C:\kotlinc\bin;C:\Program Files\OpenSSL-Win64\bin;C:\Program Files\Amazon\AWSCLIV2\;C:\Program Files\Docker\Docker\resources\bin;C:\ProgramData\DockerDesktop\version-bin;C:\Program Files\GTK3-Runtime Win64\bin;C:\Program Files\Amazon\AWSSAMCLI\bin\;C:\Users\user_\.pyenv\pyenv-win\bin;C:\Users\user_\.pyenv\pyenv-win\shims;C:\Users\user_\AppData\Local\Microsoft\WindowsApps;C:\Users\user_\AppData\Local\Programs\Microsoft VS Code\bin;C:\Users\user_\AppData\Roaming\Composer\vendor\bin;C:\Users\user_\AppData\Roaming\npm;C:\Program Files\heroku\bin;C:\terraform;C:\Program Files (x86)\GnuWin32\bin;C:\Program Files (x86)\zip-3.0-bin\bin;C:\Program Files (x86)\bzip2-1.0.5-bin\bin;
EMSDK_NODE = C:\Users\user_\emsdk\node\14.18.2_64bit\bin\node.exe
EMSDK_PYTHON = C:\Users\user_\emsdk\python\3.9.2-nuget_64bit\python.exe
JAVA_HOME = C:\Users\user_\emsdk\java\8.152_64bit
Clearing existing environment variable: EMSDK_PY
The changes made to environment variables only apply to the currently running shell instance. Use the 'emsdk_env.bat' to re-enter this environment later, or if you'd like to register this environment permanently, rerun this command with the option --permanent.</pre>
<p>Enterキーを押すと、上記のメッセージが出力され、設定が更新されます。</p>
<pre>&gt;emcc -v</pre>
<p>更新後、再度上記のコマンドを入力し、Enterキーを押します。</p>
<pre>emcc (Emscripten gcc/clang-like replacement + linker emulating GNU ld) 3.1.15 (8b4443a87f5eab5dbb9adb690f9ebed0a9da4bd9)
clang version 15.0.0 (https://github.com/llvm/llvm-project 27abff670bc7ad9702c4f9fc8b82aae6b530bf0f)
Target: wasm32-unknown-emscripten
Thread model: posix
InstalledDir: C:\Users\user_\emsdk\upstream\bin</pre>
<p>Enterキーを押すと、今度はemccのバージョンなどが出力されました。これでインストールの確認は完了となります。</p>
<h2><span id="toc5">■C/C++ファイルを作成しコンパイルする</span></h2>
<p>インストールの確認が完了し、CまたはC++コードをコンパイルできるようになりましたので、C/C++ファイルを作成しコンパイルしてみます。</p>
<h3><span id="toc6">■コード</span></h3>
<pre>#include 
int main(){
    printf("Hello World");
    return 0;
}</pre>
<p>今回はC++コードで、main()という関数を定義し、printfで「Hello World」という文字列を出力させるものです。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-075304-1.png"><img loading="lazy" decoding="async" class="alignnone wp-image-12898 size-medium" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-075304-1-300x146.png" alt="" width="300" height="146" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-075304-1-300x146.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-075304-1-1024x498.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-075304-1-768x374.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-075304-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>このコードを「C:\Users\user_（フォルダパス）」内に「cmain.cpp」という名前で保存します。</p>
<pre>&gt;emcc cmain.cpp</pre>
<p>保存後、コマンドプロンプトを起動し、上記のコマンドを入力し、Enterキーを押します。「emcc」コマンドで今回作成した「cmain.cpp」というファイルを指定します。</p>
<pre>shared:INFO: (Emscripten: Running sanity checks)</pre>
<p>Enterキーを押すと、上記のメッセージ、もしくは何も出力されない場合もありますが、これでコンパイルが成功します。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12899" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-300x121.png" alt="" width="300" height="121" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-300x121.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-1024x412.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-768x309.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1.png 1249w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>成功後、「C:\Users\user_（フォルダパス）」内を確認すると、「a.out.js」と「a.out.wasm」の2つのファイルが生成されていることが確認できました。</p>
<h3><span id="toc7">■実行・検証</span></h3>
<pre>&gt;node a.out.js</pre>
<p>確認後、コマンドプロンプト上に戻り、上記のコマンドを入力し、Enterキーを押します。今回生成された「a.out.js」というjsファイルを実行してみます。実行するために、nodeをインストールする必要があります。今回はバージョン「14.18.2」を使用しています。</p>
<pre>stdio streams had content in them that was not flushed. you should set EXIT_RUNTIME to 1 (see the FAQ), or make sure to emit a newline when you printf etc.
(this may also be due to not including full filesystem support - try building with -sFORCE_FILESYSTEM)</pre>
<p>Enterキーを押すと、上記のメッセージが出力されました。出力された内容を翻訳し確認すると「EXIT_RUNTIME を 1 に設定するか (FAQ を参照)、printf などの際に改行するように してください。(これは、ファイルシステムを完全にサポートしていないことが原因かもしれません -sFORCE_FILESYSTEM を付けてビルドしてみてください)」ということで、今回作成した「cmain.cpp」の内容を変更します。</p>
<h3><span id="toc8">■コード</span></h3>
<pre>#include 
int main(){
    printf("Hello World\n");
    return 0;
}</pre>
<p>変更内容としては、printf()を用いて文字列を出力する際に「\n（改行コード）」を記述し、ファイルを保存します。保存後、再度コンパイルを行い、その後、jsファイルを実行してみます。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12901" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-1-300x70.png" alt="" width="300" height="70" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-1-300x70.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-1-1024x238.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-1-768x178.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02_1-1-1.png 1249w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>実行してみると、今回は先程のメッセージは出力されず「Hello World」と出力されることが確認できました。</p>
<p><a href="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-082210-1.png"><img loading="lazy" decoding="async" class="alignnone size-medium wp-image-12902" src="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-082210-1-300x91.png" alt="" width="300" height="91" srcset="https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-082210-1-300x91.png 300w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-082210-1-1024x311.png 1024w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-082210-1-768x233.png 768w, https://laboratory.kazuuu.net/wp-content/uploads/2022/07/スクリーンショット-2022-07-02-082210-1.png 1250w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>なお、「cmain.cpp」の内容を変更せずに、コンパイルを行う際に、上記の「emcc cmain.cpp -s EXIT_RUNTIME=1」というコマンドを用いてコンパイルを行うと、生成されたjsファイルを実行する際に、先程のメッセージは出力されず「Hello World」と出力される。</p>
<h2><span id="toc9">■「&#8217;emcc&#8217; は、内部コマンドまたは外部コマンド、 操作可能なプログラムまたはバッチ ファイルとして認識されていません。」の対処</span></h2>
<p>「&#8217;emcc&#8217; は、内部コマンドまたは外部コマンド、 操作可能なプログラムまたはバッチ ファイルとして認識されていません。」と出力される場合がありますが、この場合は、Windows10のコマンドプロンプトを起動します。</p>
<pre>&gt;cd emsdk</pre>
<p>起動後、上記のコマンドを入力し、Enterキーを押します。「cd」コマンドで「emsdk」ディレクトリ内に移動します。</p>
<pre>&gt;emsdk_env.bat</pre>
<p>移動後、上記のコマンドを入力し、Enterキーを押します。emsdk_env.batを実行し、環境変数が追加します。</p>
<pre>PATH = C:\Users\user_\emsdk;C:\Users\user_\emsdk\upstream\emscripten;C:\Users\user_\emsdk\node\14.18.2_64bit\bin;C:\Program Files (x86)\Common Files\Oracle\Java\javapath;C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v11.5\bin;C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v11.5\libnvvp;C:\Program Files (x86)\Python37-32\Scripts\;C:\Program Files (x86)\Python37-32\;C:\Program Files\Python36\Scripts\;C:\Program Files\Python36\;C:\Program Files\Python38\Scripts\;C:\Program Files\Python38\;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\WINDOWS\System32\OpenSSH\;C:\Users\user_\AppData\Roaming\Python\Python38\Scripts\;C:\Program Files\MongoDB\Server\4.4\bin\;C:\xampp\php;C:\ProgramData\ComposerSetup\bin;C:\Program Files (x86)\Common Files\Sony Shared\FeliCaLibrary;C:\Program Files\Common Files\Sony Shared\FeliCaLibrary;C:\Program Files (x86)\Common Files\Sony Shared\FeliCaNFCLibrary;C:\Program Files\Common Files\Sony Shared\FeliCaNFCLibrary;C:\Program Files\NVIDIA Corporation\Nsight Compute 2021.3.0\;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\erl-24.1.7\bin;C:\Program Files (x86)\Elixir\bin;C:\Users\user_\.mix\escripts;C:\Program Files\nodejs\;C:\Program Files\PostgreSQL\14\bin;C:\Program Files\Git\cmd;C:\kotlinc\bin;C:\Program Files\OpenSSL-Win64\bin;C:\Program Files\Amazon\AWSCLIV2\;C:\Program Files\Docker\Docker\resources\bin;C:\ProgramData\DockerDesktop\version-bin;C:\Program Files\GTK3-Runtime Win64\bin;C:\Program Files\Amazon\AWSSAMCLI\bin\;C:\Users\user_\.pyenv\pyenv-win\bin;C:\Users\user_\.pyenv\pyenv-win\shims;C:\Users\user_\AppData\Local\Microsoft\WindowsApps;C:\Users\user_\AppData\Local\Programs\Microsoft VS Code\bin;C:\Users\user_\AppData\Roaming\Composer\vendor\bin;C:\Users\user_\AppData\Roaming\npm;C:\Program Files\heroku\bin;C:\terraform;C:\Program Files (x86)\GnuWin32\bin;C:\Program Files (x86)\zip-3.0-bin\bin;C:\Program Files (x86)\bzip2-1.0.5-bin\bin;
EMSDK = C:/Users/user_/emsdk
EM_CONFIG = C:\Users\user_\emsdk\.emscripten
EMSDK_NODE = C:\Users\user_\emsdk\node\14.18.2_64bit\bin\node.exe
EMSDK_PYTHON = C:\Users\user_\emsdk\python\3.9.2-nuget_64bit\python.exe
JAVA_HOME = C:\Users\user_\emsdk\java\8.152_64bit
Clearing existing environment variable: EMSDK_PY</pre>
<p>Enterキーを押すと、上記のメッセージが出力されます。これで「&#8217;emcc&#8217; は、内部コマンドまたは外部コマンド、 操作可能なプログラムまたはバッチ ファイルとして認識されていません。」と出力されなくなります。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://laboratory.kazuuu.net/installing-webassembly-windows-10/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
