ノンカフェインであなたにやさしい

Ruby,Rails,HTML,CSS,Reactなど

WSL2に立てたサーバーに同ネットワークにある別端末からアクセスする

WSL上で開発をしていて立てたサーバーに別端末からアクセスする方法です。
Macでは何もせずにアクセスできたのですが、WSLの場合、Windows側にポートフォワーディングを設定する必要があります。

WSLのIPを調べる

ifconfig で確認
172.21.171.162 の部分

$ ifconfig
eth0: flags=4163<UP,BROADCAST,RUNNING,MULTICAST>  mtu 1500
        inet 172.21.171.162  netmask 255.255.240.0  broadcast 172.21.175.255
        inet6 fe80::215:5dff:fe53:6719  prefixlen 64  scopeid 0x20<link>
        ether 00:15:5d:53:67:19  txqueuelen 1000  (イーサネット)
        RX packets 25699  bytes 10913242 (10.9 MB)
        RX errors 0  dropped 0  overruns 0  frame 0
        TX packets 4954  bytes 2993879 (2.9 MB)
        TX errors 0  dropped 0 overruns 0  carrier 0  collisions 0

lo: flags=73<UP,LOOPBACK,RUNNING>  mtu 65536
        inet 127.0.0.1  netmask 255.0.0.0
        inet6 ::1  prefixlen 128  scopeid 0x10<host>
        loop  txqueuelen 1000  (ローカルループバック)
        RX packets 109531  bytes 128195327 (128.1 MB)
        RX errors 0  dropped 0  overruns 0  frame 0
        TX packets 109531  bytes 128195327 (128.1 MB)
        TX errors 0  dropped 0 overruns 0  carrier 0  collisions 0

PowerShellでポートフォワーディングを設定

※管理者として実行してください

netsh interface portproxy add v4tov4 listenport=3000 connectaddress=[先程調べたIP]

設定されているポートフォワーディングは

netsh interface portproxy show v4tov4 で確認可能

PS C:\WINDOWS\system32> netsh interface portproxy add v4tov4 listenport=3000 connectaddress=172.21.171.162

PS C:\WINDOWS\system32> netsh interface portproxy show v4tov4

ipv4 をリッスンする:         ipv4 に接続する:

Address         Port        Address         Port
--------------- ----------  --------------- ----------
*               3000        172.21.171.162  3000

PostgreSQLでdatabaseをReadOnlyに設定する

default_transaction_read_onlyon に設定する

alter database database_name set default_transaction_read_only = on;

postgresqlco.nf

その他メモ

レプリカのDBを作ってReadOnlyに設定する手順

現行DBのexport

pg_dump  database_name > import.sql

レプリカへのインポート

psql replica_database_name < import.sql

ReadOnlyに設定

alter database replica_database_nameset default_transaction_read_only = on;

WARN When using nuxt generate, you should set target: 'static' in your nuxt.config

古いNuxtプロジェクトを nuxt generate したらWarningが出た。

 WARN  When using nuxt generate, you should set target: 'static' in your nuxt.config
       👉 Learn more about it on https://go.nuxtjs.dev/static-target

nuxt.config.jstarget: 'static' と書く必要があるらしい

export default {
  ssr: false,
  target: 'static',

WARN mode option is deprecated. Please use ssr: true for universal mode or ssr: false for spa mode and remove mode from nuxt.config

古いNuxtプロジェクトを起動したらWarningが出た。

WARN  mode option is deprecated. Please use ssr: true for universal mode or ssr: false for spa mode and remove mode from nuxt.config

nuxt.config.jsmode が非推奨になったらしいので書き換える

- mode: 'spa',
+ ssr: false,

Windows 10 20H2にアップデートしてMicrosoft Edge(従来版)が消えてしまった時の対応

Windows 10 20H2にアップデートすると従来版Edgeが消えてしまうようです。

Windows 10 バージョン 20H2 から、Microsoft Edge 従来版は含まれなくなりました。 Windows 10 のこのバージョンから、並べて表示エクスペリエンスはサポートされていません。
旧バージョンの Microsoft Edge にアクセスする | Microsoft Docs

対応は以下

  1. レジストリエディターでキーを削除
  2. Microsoft Edge(従来版)のショートカット作成

レジストリエディターでキーを削除

レジストリエディターを開く

Windowsのスタートボタンを押し「regedit」で検索
レジストリエディター」を選択

support.microsoft.com

指定のキーを削除する

下記のキーを探し削除します。
事前にエクスポートなどをしておくと安心です。

HKEY_LOCAL_MACHINE\SOFTWARE\WOW6432Node\Microsoft\EdgeUpdate\ClientState\{56EB18F8-B008-4CBD-B6D2-8C97FE7E9062} 

Microsoft Edge(従来版)のショートカット作成

デスクトップ画面を右クリックして「新規作成 -> ショートカット」を選び以下のパスにショートカットを作成します。

%windir%\explorer.exe shell:Appsfolder\Microsoft.MicrosoftEdge_8wekyb3d8bbwe!MicrosoftEdge 

名前は「Microsoft Edge(従来版)」としておきましょう。

f:id:kuronekopunk:20201218105820p:plain

フォルダアイコンになってしまったのでEdgeのアイコンを設定します。
ショートカットを右クリック「プロパティ -> ショートカットタブ -> アイコンの変更 -> 参照」をクリック
参照先を以下のパスにして「MicrosoftEdge.exe」を選択

C:\Windows\SystemApps\Microsoft.MicrosoftEdge_8wekyb3d8bbwe

f:id:kuronekopunk:20201218110530p:plain

「適用」をするとEdgeの旧アイコンが設定できました。

f:id:kuronekopunk:20201218110153p:plain

スタートメニューに追加する

ファイラーで以下を開き、デスクトップのショートカットを入れる。

C:\ProgramData\Microsoft\Windows\Start Menu\Programs

無事スタートメニューに従来版が表示されました

f:id:kuronekopunk:20201218110342p:plain

参考