gemini://technicalsuwako.moe
テクニカル諏訪子
2023-03-08T00:00:00Z
テクニカル諏訪子
gostatic
blog/digital-kansi-most-danger-cctv.gmi
凛
【デジタル監視】プライバシーに一番危険な物は監視カメラ、二番はスマホ
2023-03-08T00:00:00Z
<p>やっとオンラインで匿名化出来たわね。<br />
<a href="/blog/digital-autonomy-send-encryption-mail/">自分のI2Pサーバーでホスティングしたり</a>、<a href="/blog/no-generator-easy-html/">静的サイトを管理して</a>、<a href="/blog/no-generator-easy-maintain/">編集したり</a>、<a href="https://social.076.moe/">フェディバース以外SNSを使わなくたり</a>、<a href="/blog/all-softwear-in-tor/">いつでもTor通してネットを使ったり</a>、<a href="/blog/digital-autonomy-send-encryption-mail/">PGP・GPGでメールを暗号化したり</a>、<a href="/blog/thinkpad-t43-ssd-install-way/">LINE・Disord・Zoom・Google・Windows等を使うのは遠慮したり</a>、<a href="/blog/webdev-javascript-ha-fuyou/">いつでもJavascriptを無効にしたり</a>、<a href="/support/monero/">全部モネロ(XMR)で払います</a>ね。<br />
しかし、おにぎりを食べる為コンビニに行くと、直ぐプライバシーがなくなります。<br />
何故!?</p>
<h2 id="heading">プライバシーに、一番危険な物は監視カメラだ</h2>
<p>監視カメラはどこでもあります。<br />
「犯罪者を捕まえる為」って口実を使ってどこでも設置出来ましたが、これは犯罪者の為わけではない、貴方の為です!<br />
監視カメラは顔認識機能性を持つのはみんなはわかりますが、それだけじゃありません。<br />
マスク着用したらも顔を隠れられません。<br />
<a href="https://youtube.owacon.moe/watch?v=ujcSrV-3GcI">マスクとサングラスを着用したらも顔認識が可能です</a>。<br />
実は、殆ど皆さんは顔パンツを着用したのに、主に新型茶番の感染拡大(<a href="/blog/digital-kansi-corona-taimrain/">インチキPCRを使って</a>)が続く中監視カメラが凄く増えたと気づきましたか?<br />
結局、目だけは十分です。<br />
それだけではない、スマホを持ってきたら危険性が増えています。<br />
監視カメラは4Gか5G、WiFi、ブルーツース等で使ってスマホのデータを読み込める事が知っていますか?</p>
<h2 id="heading-1">二番危険な物はスマホだ</h2>
<p><a href="https://videos.lukesmith.xyz/w/oZvz61zALM2Lj9fAfn4wQe">スマホはおもちゃっぽい追跡機器です</a>。<br />
監視カメラはスマホを持っているかどうか検出出来るかもしん。<br />
いつでもスマホを持ってくるから、これは非常に危険です。<br />
スマホから送られるデータを使って貴方の事を知っていますが、スマホを持たなければも貴方の事を知っています。<br />
理由は、殆ど皆さんはいつでもスマホを持ってくるから、貴方は出る杭となります。<br />
日本での皆さんで30%以上はスマホ(ガラケーやタブパソコン含めて)を持ってくる事が辞めたら、こんな監視を止められます。<br />
しかし、あたしだけは持ってこない感じです。</p>
<p>なお、基本な活動でスマホは段々必要となります。<br />
例えば、支払い(PayPay等)、ポイントカード、航空券、ルーターの設置、ネット銀行口座(日本ではまだないですが、欧米中豪でスマホを使うのは必須)、<a href="/blog/more-safe-than-2fa-is-pass-pwgen/">SNSにサインイン</a>等。<br />
もうすぐスマホ無しで市区町村外に旅する事も不可能になります。<br />
ソビエト連邦、北朝鮮、もうすぐ豪国とニュージーランドで許可なしで旅出来ません。<br />
この状況を変わらないと、日本でもそれが来ます。</p>
<h2 id="heading-2">スマホを持ってこないで</h2>
<p>スマホを自宅に残すと、同時に自分のプライバシーを改善したり、他人の安全性を改善したり、お命を改善したり、正しく歩いたり、他人の迷惑をかけるのは辞めたり、ディストピアを止められます。<br />
便利さだけがなくなりますが、すれは仮の感じだけです。<br />
速く慣れていると思います。</p>
<p>以上</p>
blog/no-generator-easy-maintain.gmi
凛
【HTML】静的サイトジェネレーター利用せず簡単に静的サイト編集する方法
2023-02-08T00:00:00Z
<p>昨日は静的サイト管理する方法を教えました。<br />
でも、編集はどう?<br />
例えば、会社名が変わったら、一個ずつ編集は必要でしょうか?<br />
必要はないわ!</p>
<h2 id="sed">sedで会社名の変更</h2>
<p><code lang="">sed</code>コマンドですべてのページで変更出来ますよ!</p>
<pre><code lang=""><span style="color:#a2f">cd</span> src
find . -type f -name <span style="color:#b44">"*.html"</span> -exec sed -i <span style="color:#b44">'s/クソガキ株式会社/テクニカル諏訪子開発サービス/g'</span> <span style="color:#666">{}</span> +
</code></pre><p>上記コマンドですべてのページで「クソガキ株式会社」が「テクニカル諏訪子開発サービス」に変更されます。<br />
でも、「クソガキ株式会社」の方が良いですので:</p>
<pre><code lang="">find . -type f -name <span style="color:#b44">"*.html"</span> -exec sed -i <span style="color:#b44">'s/テクニカル諏訪子開発サービス/クソガキ株式会社/g'</span> <span style="color:#666">{}</span> +
</code></pre><h2 id="sedhtml">sedでマークダウンからHTMLに交換</h2>
<p>この同じsedコマンドで、すべての「\」を「<br />」に交換出来ます。<br />
そうして、「# ほげほげ」を「<h1>ほげほげ</h1>」に交換し、「[ほげほげ](/hogehoge.html)」を「<a href="/hogehoge.html">ほげほげ</a>」に交換します。<br />
例えば、<code lang="">toiawase.html</code>ページで:</p>
<pre><code lang=""><span style="color:#000080;font-weight:bold"># 問い合わせ
</span><span style="color:#000080;font-weight:bold"></span>クソガキ株式会社\
地獄県鬼市死亡街6丁目6-6 サタンパレス666階\
最寄り駅:JL神様線 死後駅 徒歩約5ヶ月\
エレベーターがありません。\
[<span style="color:#008000;font-weight:bold">トップページへ</span>](<span style="color:#b44">/index.html</span>)
</code></pre><pre><code lang="">sed -i <span style="color:#b44">'s/^# \(.*\)/<h1>\0<\/h1>/g'</span> toiawase.html <span style="color:#080;font-style:italic">#h1タグ</span>
sed -i <span style="color:#b44">'s/\\/<br \/>/g'</span> toiawase.html <span style="color:#080;font-style:italic">#brタグ</span>
sed -i <span style="color:#b44">'s/^\(.*\)/ \0/g'</span> toiawase.html <span style="color:#080;font-style:italic">#4つ空白を入る</span>
sed -i <span style="color:#b44">'s/\[\(.*\)\](\(.*\))/<a href="\2">\1<\/a>/g'</span> toiawase.html <span style="color:#080;font-style:italic">#リンクタグ</span>
</code></pre><p>結果は下記ですね:</p>
<pre><code lang=""> <<span style="color:#008000;font-weight:bold">h1</span>>問い合わせ</<span style="color:#008000;font-weight:bold">h1</span>>
クソガキ株式会社<<span style="color:#008000;font-weight:bold">br</span> />
地獄県鬼市死亡街6丁目6-6 サタンパレス666階<<span style="color:#008000;font-weight:bold">br</span> />
最寄り駅:JL神様線 死後駅 徒歩約5ヶ月<<span style="color:#008000;font-weight:bold">br</span> />
エレベーターがありません。<<span style="color:#008000;font-weight:bold">br</span> />
<<span style="color:#008000;font-weight:bold">a</span> <span style="color:#b44">href</span><span style="color:#666">=</span><span style="color:#b44">"/index.html"</span>>トップページへ</<span style="color:#008000;font-weight:bold">a</span>>
</code></pre><p>その時から、マークダウンで書きましょう!!</p>
<pre><code lang="">mv index.<span style="color:#666">{</span>html,md<span style="color:#666">}</span>
mv toiawase.<span style="color:#666">{</span>html,md<span style="color:#666">}</span>
</code></pre><h3 id="indexmd">index.md</h3>
<pre><code lang=""><span style="color:#000080;font-weight:bold"># クソガキ株式会社へようこそ
</span><span style="color:#000080;font-weight:bold"></span>私達のサービスはクソ物凄いだぜ!!
</code></pre><h3 id="toiawasemd">toiawase.md</h3>
<pre><code lang=""><span style="color:#000080;font-weight:bold"># 問い合わせ
</span><span style="color:#000080;font-weight:bold"></span>クソガキ株式会社\
地獄県鬼市死亡街6丁目6-6 サタンパレス666階\
最寄り駅:JL神様線 死後駅 徒歩約5ヶ月\
エレベーターがありません。\
[<span style="color:#008000;font-weight:bold">トップページへ</span>](<span style="color:#b44">/index.html</span>)
</code></pre><h2 id="sedactive">sedでメニューのリンクを「active」タグを追加する方法</h2>
<p>まずはCSSで新しい行列を追加して下さい:</p>
<pre><code lang=""><span style="color:#666">...</span>
.<span style="color:#00f">active</span> {
<span style="color:#a2f;font-weight:bold">background</span>: <span style="color:#666">#ea44fb</span>;
<span style="color:#a2f;font-weight:bold">color</span>: <span style="color:#666">#000</span> <span style="color:#080">!important</span>;
<span style="color:#a2f;font-weight:bold">padding</span>: <span style="color:#666">4</span><span style="color:#0b0;font-weight:bold">px</span>;
}
</code></pre><p><code lang="">cat</code>でマージした後、下記の<code lang="">sed</code>コマンドを使ってこのタグを追加出来ます。<br />
今回は凄く簡単だわ〜</p>
<pre><code lang="">sed -i <span style="color:#b44">"s/href=\"\/\"/href=\"\/\" class=\"active\"/g"</span> index.html
sed -i <span style="color:#b44">"s/href=\"\/toiawase.html\"/href=\"\/toiawase.html\" class=\"active\"/g"</span> toiawase.html
</code></pre><h2 id="makesh">make.shの変更</h2>
<p>スクリプトはこれになりました:</p>
<pre><code lang=""><span style="color:#080">#!/bin/sh
</span><span style="color:#080"></span>rm -rf www/*
cp -v src/style.css www
<span style="color:#a2f">cd</span> src
<span style="color:#a2f;font-weight:bold">for</span> name in *.md; <span style="color:#a2f;font-weight:bold">do</span>
<span style="color:#b8860b">newname</span><span style="color:#666">=</span><span style="color:#b44">"</span><span style="color:#a2f;font-weight:bold">$(</span><span style="color:#a2f">echo</span> <span style="color:#b44">"</span><span style="color:#b8860b">$name</span><span style="color:#b44">"</span> | sed -ne <span style="color:#b44">'s/md/html/gp'</span><span style="color:#a2f;font-weight:bold">)</span><span style="color:#b44">"</span>
cp <span style="color:#b8860b">$name</span> <span style="color:#b8860b">$newname</span> <span style="color:#080;font-style:italic">#mdからhtmlにコピーする</span>
<span style="color:#080;font-style:italic"># マークダウンはHTML化</span>
sed -i <span style="color:#b44">'s/^# \(.*\)/<h1>\1<\/h1>/g'</span> <span style="color:#b8860b">$newname</span> <span style="color:#080;font-style:italic">#h1タグ</span>
sed -i <span style="color:#b44">'s/\\/<br \/>/g'</span> <span style="color:#b8860b">$newname</span> <span style="color:#080;font-style:italic">#brタグ</span>
sed -i <span style="color:#b44">'s/^\(.*\)/ \0/g'</span> <span style="color:#b8860b">$newname</span> <span style="color:#080;font-style:italic">#4つ空白を入る</span>
sed -i <span style="color:#b44">'s/\[\(.*\)\](\(.*\))/<a href="\2">\1<\/a>/g'</span> <span style="color:#b8860b">$newname</span> <span style="color:#080;font-style:italic">#リンクタグ</span>
<span style="color:#080;font-style:italic"># 合体</span>
cat include/header.html include/menu.html <span style="color:#b8860b">$newname</span> include/footer.html >> ../www/<span style="color:#b8860b">$newname</span>
<span style="color:#a2f">echo</span> <span style="color:#b44">"'src/</span><span style="color:#b8860b">$name</span><span style="color:#b44">' -> 'www/</span><span style="color:#b8860b">$newname</span><span style="color:#b44">'"</span>
<span style="color:#080;font-style:italic"># HTMLファイルはもう不要だ</span>
rm -rf <span style="color:#b8860b">$newname</span>
<span style="color:#a2f;font-weight:bold">done</span>
<span style="color:#a2f">cd</span> ../www
<span style="color:#080;font-style:italic"># 「active」タグを付く</span>
<span style="color:#a2f;font-weight:bold">for</span> name in *.html; <span style="color:#a2f;font-weight:bold">do</span>
<span style="color:#a2f;font-weight:bold">if</span> <span style="color:#666">[</span> <span style="color:#b8860b">$name</span> <span style="color:#666">=</span> <span style="color:#b44">'index.html'</span> <span style="color:#666">]</span>; <span style="color:#a2f;font-weight:bold">then</span>
sed -i <span style="color:#b44">"s/href=\"\/\"/href=\"\/\" class=\"active\"/g"</span> <span style="color:#b8860b">$name</span>
<span style="color:#a2f;font-weight:bold">else</span>
sed -i <span style="color:#b44">"s/href=\"\/</span><span style="color:#b8860b">$name</span><span style="color:#b44">\"/href=\"\/</span><span style="color:#b8860b">$name</span><span style="color:#b44">\" class=\"active\"/g"</span> <span style="color:#b8860b">$name</span>
<span style="color:#a2f;font-weight:bold">fi</span>
<span style="color:#a2f;font-weight:bold">done</span>
<span style="color:#a2f">cd</span> ..
</code></pre><p>ところで、こちらのプロジェクトのファイルは全部Gitlerにコミットしました。<br />
<a href="https://gitler.moe/TechnicalSuwako/sizutekipage/src/commit/11105976503e15388986a0d3b9cf211e6f9695cd">昨日のコミット</a><br />
<a href="https://gitler.moe/TechnicalSuwako/sizutekipage/src/commit/b50a5b45c3915c32b856c7fc5b07cc7bc3aa70dd">今日のコミット</a></p>
<p>以上</p>
blog/no-generator-easy-html.gmi
凛
【HTML】静的サイトジェネレーター利用せず簡単に静的サイト管理する方法
2023-02-07T00:00:00Z
<p>手動で静的サイトを作るのは簡単ですが、ちょっと面倒くさいですので、みんなはCMS(WordPress、fc2等)を使います。<br />
でも、CMSは凄く重くて、遅くて、不安ですから、あたしみたいな方は静的サイトジェネレーターを使っています。<br />
今回はジェネレーター利用せず静的サイトを作って、管理する方法を紹介します。</p>
<h1 id="heading">インストール</h1>
<p>今回は特に新しいソフトのインストールするのは不要ですが、公開するため「rsync」だけをインストールする事が必要となります。<br />
でも、本日の記事は公開ステップを紹介しませんので、インストールしなくてはOKです。</p>
<h1 id="heading-1">フォルダーとファイルの創作</h1>
<p>まずは新しいフォルダーとファイルを創作しましょう。<br />
HTMLと言えば、ヘッダー、メニュー、コンテンツ、フッターが思い出しますわね。<br />
ですから、ヘッダー、メニュー、及びフッターは別々のフォルダーに貼りますね。</p>
<pre><code lang="">mkdir -p sizutekipage/<span style="color:#666">{</span>src,www<span style="color:#666">}</span>
mkdir sizutekipage/src/include
touch sizutekipage/src/<span style="color:#666">{</span>index,toiawase<span style="color:#666">}</span>.html
touch sizutekipage/src/include/<span style="color:#666">{</span>header,footer,menu<span style="color:#666">}</span>.html
touch sizutekipage/src/style.css
<span style="color:#a2f">cd</span> sizutekipage/src
</code></pre><p>ヘッダー、フッター、とメニューを作りましょう!</p>
<h2 id="includeheaderhtml">include/header.html</h2>
<pre><code lang=""><span style="color:#080"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"></span>
<<span style="color:#008000;font-weight:bold">html</span> <span style="color:#b44">xmlns</span><span style="color:#666">=</span><span style="color:#b44">"http://www.w3.org/1999/xhtml"</span> <span style="color:#b44">xml:lang</span><span style="color:#666">=</span><span style="color:#b44">"ja"</span>>
<<span style="color:#008000;font-weight:bold">head</span>>
<<span style="color:#008000;font-weight:bold">meta</span> <span style="color:#b44">content</span><span style="color:#666">=</span><span style="color:#b44">"text/html; charset=utf-8"</span> <span style="color:#b44">http-equiv</span><span style="color:#666">=</span><span style="color:#b44">"content-type"</span> />
<<span style="color:#008000;font-weight:bold">title</span>>クソガキ株式会社</<span style="color:#008000;font-weight:bold">title</span>>
<<span style="color:#008000;font-weight:bold">link</span> <span style="color:#b44">rel</span><span style="color:#666">=</span><span style="color:#b44">"stylesheet"</span> <span style="color:#b44">type</span><span style="color:#666">=</span><span style="color:#b44">"text/css"</span> <span style="color:#b44">href</span><span style="color:#666">=</span><span style="color:#b44">"/style.css"</span> />
</<span style="color:#008000;font-weight:bold">head</span>>
<<span style="color:#008000;font-weight:bold">body</span>>
</code></pre><h2 id="includefooterhtml">include/footer.html</h2>
<pre><code lang=""> <<span style="color:#008000;font-weight:bold">hr</span> />
<<span style="color:#008000;font-weight:bold">center</span>>
クソガキ株式会社
</<span style="color:#008000;font-weight:bold">center</span>>
</<span style="color:#008000;font-weight:bold">div</span>>
</<span style="color:#008000;font-weight:bold">body</span>>
</<span style="color:#008000;font-weight:bold">html</span>>
</code></pre><h2 id="includemenuhtml">include/menu.html</h2>
<pre><code lang=""> <<span style="color:#008000;font-weight:bold">div</span> <span style="color:#b44">class</span><span style="color:#666">=</span><span style="color:#b44">"menu"</span>>
<<span style="color:#008000;font-weight:bold">a</span> <span style="color:#b44">href</span><span style="color:#666">=</span><span style="color:#b44">"/"</span>>トップ</<span style="color:#008000;font-weight:bold">a</span>> |
<<span style="color:#008000;font-weight:bold">a</span> <span style="color:#b44">href</span><span style="color:#666">=</span><span style="color:#b44">"/toiawase.html"</span>>問い合わせ</<span style="color:#008000;font-weight:bold">a</span>>
</<span style="color:#008000;font-weight:bold">div</span>>
<<span style="color:#008000;font-weight:bold">div</span> <span style="color:#b44">class</span><span style="color:#666">=</span><span style="color:#b44">"container"</span>>
</code></pre><h2 id="stylecss">style.css</h2>
<pre><code lang=""><span style="color:#008000;font-weight:bold">body</span> {
<span style="color:#a2f;font-weight:bold">background</span>: <span style="color:#666">#000</span>;
<span style="color:#a2f;font-weight:bold">color</span>: <span style="color:#666">#fff</span>;
<span style="color:#a2f;font-weight:bold">margin</span>: <span style="color:#666">0</span>;
}
<span style="color:#008000;font-weight:bold">a</span> {
<span style="color:#a2f;font-weight:bold">color</span>: <span style="color:#666">#666</span>;
}
.<span style="color:#00f">menu</span> {
<span style="color:#a2f;font-weight:bold">background</span>: <span style="color:#666">#444</span>;
<span style="color:#a2f;font-weight:bold">font-size</span>: <span style="color:#666">14</span><span style="color:#0b0;font-weight:bold">px</span>;
<span style="color:#a2f;font-weight:bold">padding</span>: <span style="color:#666">8</span><span style="color:#0b0;font-weight:bold">px</span>;
<span style="color:#a2f;font-weight:bold">margin-bottom</span>: <span style="color:#666">12</span><span style="color:#0b0;font-weight:bold">px</span>;
}
.<span style="color:#00f">menu</span> <span style="color:#666">></span> <span style="color:#008000;font-weight:bold">a</span> {
<span style="color:#a2f;font-weight:bold">color</span>: <span style="color:#666">#ea44fb</span>;
}
.<span style="color:#00f">container</span> {
<span style="color:#a2f;font-weight:bold">background</span>: <span style="color:#666">#00f</span>;
<span style="color:#a2f;font-weight:bold">border</span>: <span style="color:#666">1</span><span style="color:#0b0;font-weight:bold">px</span> <span style="color:#a2f;font-weight:bold">solid</span> <span style="color:#666">#77a</span>;
<span style="color:#a2f;font-weight:bold">margin</span>: <span style="color:#a2f;font-weight:bold">auto</span>;
<span style="color:#a2f;font-weight:bold">width</span>: <span style="color:#666">100</span><span style="color:#0b0;font-weight:bold">%</span>;
<span style="color:#a2f;font-weight:bold">max-width</span>: <span style="color:#666">1200</span><span style="color:#0b0;font-weight:bold">px</span>;
<span style="color:#a2f;font-weight:bold">padding</span>: <span style="color:#666">4</span><span style="color:#0b0;font-weight:bold">px</span>;
}
</code></pre><h2 id="indexhtml">index.html</h2>
<pre><code lang=""> <<span style="color:#008000;font-weight:bold">h1</span>>クソガキ株式会社へようこそ</<span style="color:#008000;font-weight:bold">h1</span>>
私達のサービスはクソ物凄いだぜ!!
</code></pre><h2 id="toiawasehtml">toiawase.html</h2>
<pre><code lang=""> <<span style="color:#008000;font-weight:bold">h1</span>>問い合わせ</<span style="color:#008000;font-weight:bold">h1</span>>
クソガキ株式会社<<span style="color:#008000;font-weight:bold">br</span> />
地獄県鬼市死亡街6丁目6-6 サタンパレス666階<<span style="color:#008000;font-weight:bold">br</span> />
最寄り駅:JL神様線 死後駅 徒歩約5ヶ月<<span style="color:#008000;font-weight:bold">br</span> />
エレベーターがありません。
</code></pre><h1 id="heading-2">コンパイル</h1>
<p>catコマンドを使って、ウエブサイトを作成しましょう!!<br />
まずはCSSファイルをコピーして下さい。</p>
<pre><code lang=""><span style="color:#a2f">cd</span> ..
cp src/style.css www
cat src/include/header.html src/include/menu.html src/index.html src/include/footer.html >> www/index.html
cat src/include/header.html src/include/menu.html src/toiawase.html src/include/footer.html >> www/toiawase.html
</code></pre><p>作成成功!!</p>
<h1 id="heading-3">スクリプト化</h1>
<p>しかし、毎回繰り返すのは面倒くさいですね。<br />
スクリプトを作りましょう!!</p>
<pre><code lang="">touch make.sh
chmod +x make.sh
nvim make.sh
</code></pre><h2 id="makesh">make.sh</h2>
<pre><code lang=""><span style="color:#080">#!/bin/sh
</span><span style="color:#080"></span>rm -rf www/*
cp -v src/style.css www
<span style="color:#a2f">cd</span> src
<span style="color:#a2f;font-weight:bold">for</span> name in *.html; <span style="color:#a2f;font-weight:bold">do</span>
cat include/header.html include/menu.html <span style="color:#b8860b">$name</span> include/footer.html >> ../www/<span style="color:#b8860b">$name</span>
<span style="color:#a2f">echo</span> <span style="color:#b44">"'src/</span><span style="color:#b8860b">$name</span><span style="color:#b44">' -> 'www/</span><span style="color:#b8860b">$name</span><span style="color:#b44">'"</span>
<span style="color:#a2f;font-weight:bold">done</span>
<span style="color:#a2f">cd</span> ..
</code></pre><p>作成するには、「sizutekipage」フォルダーから<code lang="">./make.sh</code>を実行して下さい。<br />
ね、簡単でしょ?</p>
<p>以上</p>
blog/thinkpad-t43-ssd-install-way.gmi
凛
【ハード】IBM ThinkPad T43にSSDを入る方法
2023-02-03T00:00:00Z
<p>秋葉原のジャンク通りでやっとIBM ThinkPad T43のめちゃくちゃ古いノートパソコンを見つけました。<br />
勿論SSDなしで、金額は6,800円でした。</p>
<p><img src="https://ass.technicalsuwako.moe/t43-ssd/qlWBD5gMQqqU8QAN2gEryQ.jpg" alt="" /></p>
<p>でも、問題は一つがあります:SSDを入れないってことです。<br />
T43の時代のパソコンはSATAじゃなくて、IDEのハードディスクを使いましたから。<br />
SSDはSATAに変わった時後で作られましたので、IDE系SSDが存在しません。<br />
そうして、IDE系HDDを見つけるのは珍しいです。</p>
<p>でも、一つの方法がありますわ。<br />
mSATA→IDE交換アダプターを使って安くて簡単にSSDを使えます。</p>
<p>使ったやつは、<a href="https://www.amazon.co.jp/gp/product/B00EUXS7WG">KRHK-MSATA/I9</a>と<a href="https://www.amazon.co.jp/gp/product/B07GZFGD2B">Zheino M3 (256 GB)</a>です。<br />
買った時、金額は6,297円でした。</p>
<p><img src="https://ass.technicalsuwako.moe/t43-ssd/PO3316IiQyiTgVLQWSesFA.jpg" alt="" /><br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/Lp9-nNNCTM6j4ZN4rwJg2A.jpg" alt="" /><br />
ちなみに、SSDはサイズの比較ためです。<br />
それ以外特に関係がありません。</p>
<p><img src="https://ass.technicalsuwako.moe/t43-ssd/ynKP6u4tRoqAkCExe2RkZg.jpg" alt="" /><br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/kRG-xU1uSlqvk6yhP3S1aQ.jpg" alt="" /></p>
<p>次の問題は、普通に入るのは無理でした。<br />
しょうがないですが、完全に分解しないと、SSDを入れないらしい。(写真を取りませんでしたが)</p>
<p>でも、分解して、SSDを入って、再組み立ったら、ノートパソコンがやっとSSDを読められました!!<br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/12GTLfI9RZiXZu-5Do1X3Q.jpg" alt="" /></p>
<p>次はOSのインストールですね。<br />
メモリは2GB以上で無理ですので、古いOSを利用しか出来ない感じですね。<br />
でも、ネットで古いOSを使うのは凄く危険かしら。<br />
そうして、プロセサーは32-bitですので、新しいOSの選びは少ないのです。<br />
ですから、OpenBSDを入りました。</p>
<p><img src="https://ass.technicalsuwako.moe/t43-ssd/IBlRnwW_SpqusPmb7zKrTQ.jpg" alt="" /><br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/JZfynYBUSkaaziwsj7ML1A.jpg" alt="" /><br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/D6YGneiMQRqoAX50IG7o6A.jpg" alt="" /><br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/Zc8inzNGQlKKPrOePtsRYw.jpg" alt="" /><br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/3HVQMjXPQviCwY-9dkugzA.jpg" alt="" /><br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/ba1d1zq7TNyHSxJ6nslMOQ.jpg" alt="" /></p>
<p>出たー出た!!出ったーーー<br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/pwpPRGKJS169B3GNYXOnNw.jpg" alt="" /><br />
<img src="https://ass.technicalsuwako.moe/t43-ssd/Z5toPySHRu2HvaS2LzkKtg.jpg" alt="" /></p>
<p>以上</p>
blog/access-network-wireguard.gmi
凛
【セキュリティ】Wireguardを使って安全に自宅のネットワークをアクセスする方法
2023-01-17T00:00:00Z
<p>また会社員になったから、あんま自宅にいない状況となりました。<br />
セキュリティのため、私のサーバーは:80と:443以外自宅だけからアクセス出来る様に設定しました。<br />
でも、会社にいながらアクセス出来たら良いなぁと思いましたので、今回はWireguardで安全に自宅のネットワークをアクセスする方法を教えると思います。</p>
<p>ここの記事で:</p>
<ul>
<li>VPSはOpenBSD</li>
<li>ゲートウェイはDevuan</li>
<li>ノートパソコンとゲームパソコンはArtix Linux</li>
</ul>
<p>記事の場合、「ゲートウェイ」は自宅のネットワーク内のサーバーで、VPSはネットワーク外のサーバーと意味です。</p>
<p>ソフトのインストールコマンド以外全部のコマンドは全部のLinuxディストリビューション及びBSD OSで同じです。<br />
うまく出来たら、ノートパソコン→VPS→ゲートウェイ→ゲームパソコンのログインは可能となります。<br />
ここの場合、Artix→OpenBSD→Devuan→Artixですね。</p>
<p>ノート→VPS→ゲーム(Artix→OpenBSD→Artix)も可能ですが、自宅ネットワークで複数パソコンやサーバー(あたしは10台ぐらい)があれば、1台のゲートウェイがあった方が良いです。<br />
そうしてセキュリティの為、SSHとWireguardしか何も実行されていないサーバーの方が安全ですね。</p>
<h1 id="vps">VPS</h1>
<p>OpenBSDを使ってVPSなら、ConoHa又はVultrを勧めます。<br />
ConoHaのOpenBSDイメージは古いバージョンですので、まずは最新バージョンまで「pkg_add -ui」及び「sysupgrade」コマンドを実行する事が必要です。<br />
どっちでもで、一番安いVPSは十分です。</p>
<h1 id="heading">買い物</h1>
<p>まずは専用サーバーを買ってみよっか!<br />
あれば、Lenovo ThinkCentre又はNECのジャンク品は一番勧めますが、結局何でも良いです。<br />
東京に近く住んだら、秋葉原のジャンク通りで2000~4000円で買えます。<br />
あとはSSDを買うのは必要ですが、小さいSSDは大丈夫です。<br />
ACケーブル及びイーサネットケーブルも必要です、なければキーボードとモニタも必要ですが、すでに持ってるやつを使いましょう。<br />
まとめて5千円でサーバーの購入が可能です。</p>
<h1 id="devuan">ゲートウェイでDevuanのインストール</h1>
<p>いつでも通りDevuanをインストールしましょう。<br />
でもサーバーですので、XFCEじゃなくて、ベースインストーラーを使って下さい。</p>
<h2 id="ssh">SSHのセキュリティ対策</h2>
<p>インストールする後、セキュリティ対策の為、下記のステップは必要です。</p>
<h3 id="vps-1">VPSとゲートウェイの側</h3>
<p>普通ユーザー作って下さい。<br />
注意:Devuanの場合、wheelじゃなくて、sudoです。</p>
<pre><code lang="">useradd -m (ユーザー名)
passwd (ユーザー名)
usermod -G wheel (ユーザー名)
su -l (ユーザー名)
mkdir ~/.ssh
touch ~/.ssh/authorized_keys
</code></pre><h3 id="heading-1">すべての側</h3>
<p>初めての場合、SSHキーを作成して下さい。</p>
<pre><code lang="">ssh-keygen -t ed25519
</code></pre><p>そのままEnterキーを押して下さい。<br />
パスワードを入らないで下さい。</p>
<pre><code lang="">cat ~/.ssh/id_ed25519.pub
</code></pre><p>出力をコピーして、</p>
<ul>
<li>Artixのノートパソコンの内容はOpenBSDのVPSの「~/.ssh/authorized_keys」に貼って</li>
<li>OpenBSDのVPSの内容はDevuanのゲートウェイのものに貼って</li>
<li>Devuanのゲートウェイの内容はArtixのゲームパソコンのものに貼って</li>
</ul>
<p>「/etc/ssh/sshd_config」ファイルを編集して下さい。</p>
<pre><code lang="">...
PermitRootLogin no
...
PasswordAuthentication no
...
</code></pre><p>SSHサービスの再起動。</p>
<table>
<thead>
<tr>
<th>Devuan</th>
<th>Artix (runitの場合)</th>
<th>OpenBSD</th>
</tr>
</thead>
<tbody>
<tr>
<td>service ssh restart</td>
<td>sv restart sshd</td>
<td>rcctl restart sshd</td>
</tr>
</tbody>
</table>
<p>まだVPS→ゲートウェイのログインは不可能ですが、そろそろ可能となります。</p>
<h1 id="wireguard">Wireguardの設置</h1>
<h2 id="vps-2">VPS側</h2>
<p>じゃ、始めましょう!<br />
まずはパッケージをインストールしましょう。</p>
<pre><code lang="">doas pkg_add wireguard-tools
</code></pre><p>rootになって、Wireguardのコンフィグを作成しましょう。</p>
<pre><code lang="">doas su
mkdir /etc/wireguard
chmod <span style="color:#666">700</span> /etc/wireguard
<span style="color:#a2f">cd</span> /etc/wireguard
wg genkey | tee private.key | wg pubkey > public.key
</code></pre><h2 id="heading-2">ゲートウェイ側</h2>
<p>大体同じステップですね。</p>
<pre><code lang="">sudo apt install wireguard-tools
</code></pre><pre><code lang="">sudo su
mkdir /etc/wireguard
chmod <span style="color:#666">700</span> /etc/wireguard
<span style="color:#a2f">cd</span> /etc/wireguard
wg genkey | tee private.key | wg pubkey > public.key
vi /etc/wireguard/wg0.conf
</code></pre><pre><code lang=""><span style="color:#666">[</span>Interface<span style="color:#666">]</span>
<span style="color:#b8860b">PrivateKey</span> <span style="color:#666">=</span> (ゲートウェイの「/etc/wireguard/private.key」の内容)
<span style="color:#b8860b">Address</span> <span style="color:#666">=</span> 192.168.10.2/24
<span style="color:#666">[</span>Peer<span style="color:#666">]</span>
<span style="color:#b8860b">PublicKey</span> <span style="color:#666">=</span> (VPSの「/etc/wireguard/public.key」の内容)
<span style="color:#b8860b">Endpoint</span> <span style="color:#666">=</span> (VPSのIPアドレス):443
<span style="color:#b8860b">AllowedIPs</span> <span style="color:#666">=</span> 0.0.0.0/0
</code></pre><h2 id="vps-3">VPS側</h2>
<pre><code lang="">vi /etc/wireguard/wg0.conf
</code></pre><pre><code lang="">[Interface]
PrivateKey = (VPSの「/etc/wireguard/private.key」の内容)
ListenPort = 443
[Peer]
PublicKey = (ゲートウェイの「/etc/wireguard/public.key」の内容)
AllowedIPs = 0.0.0.0/0
PersistentKeepalive = 25
</code></pre><pre><code lang="">sysctl net.inet.ip.forwarding<span style="color:#666">=</span><span style="color:#666">1</span>
vi /etc/sysctl.conf
</code></pre><pre><code lang="">net.inet.ip.forwarding=1
</code></pre><pre><code lang="">vi /etc/pf.conf
</code></pre><pre><code lang="">...
pass # establish keep-state
pass in on wg0
pass in inet proto udp from any to any port 443
pass out on egress inet from (wg0:network) nat-to (vio0:0)
...
</code></pre><pre><code lang="">pfctl -f /etc/pf.conf
</code></pre><h2 id="heading-3">ゲートウェイ側</h2>
<pre><code lang="">wg-quick up wg0
</code></pre><h1 id="heading-4">確認しましょう</h1>
<p>お疲れ様でした!!<br />
じゃ、ノートパソコンは違うネットワーク(例えば、スマホのWiFiホットスポット又はスタバの無料WiFi)に接続して、ノートパソコンからVPSにログインして下さい。<br />
VPSからゲートウェイにログインして下さい。<br />
ゲートウェイからネットワーク以内のゲームパソコンにログインして下さい。<br />
VPS→ゲートウェイにログインするには、IPアドレスは「192.168.10.2」となります。</p>
<p>今から世界中でどこでもから自宅のゲームパソコンをアクセス出来ます!!</p>
<p>以上</p>