ローカル エージェントをオンラインでホイッスルする (vue プロジェクト)

1. ホイッスルのインストール
   -g ホイッスルのインストール

2. インストール後、cmd コンソールが「w2 start」という笛を鳴らして起動します。

3. whistle ローカル フロントエンド 127.0.0.1:8899 (通常はこの URL) にアクセスします。

4. 現在 https ドメイン名を使用している場合は、https リクエストをプロキシできるように https 証明書をインストールする必要があることに注意してください。
   

5. 証明書をダウンロードしたら、[開く] をクリックします=> 証明書のインストール=> 次へ=> すべての証明書を次のストレージに配置します=> 参照=> 「信頼されたルート証明機関」を選択 => OK (MAC バージョンに従ってください)コンピュータをインストールするための「キーチェーン」モード)

6. ブラウザに拡張機能 SwitchyOmega をインストールします。対応する拡張機能は、Google Chrome プラグイン ストア (https://chrome.google.com/webstore/detail/proxy-switchyomega/padekgcemlokbadohgkifijomclgjgif?hl=zh-CN) で見つかります。
   

7. 拡張機能を開く
   

8. 作成後、SwitchyOmega 拡張機能を開きます
   

9. フロントエンド プロジェクトを開き、エージェントに注釈を付け、ホストを 0.0.0.0 に設定します (0.0.0.0 に設定すると IP アクセスが有効になり、作業用 IP アドレス ➕ ポートを使用してローカル プロジェクトに直接アクセスできるようになります。同じドメインで同時にこのプロジェクトにアクセスすることもできます)、npm run dev で直接開始します

10. オンラインサービスを開き、ロードされたjsファイルを見つけます
    

11. 127.0.0.1:8899 ホイッスル フロントエンドを開き、ルールをクリックします
    

12. 保存をクリックします

13. オンライン サービスを開き、ウィンドウの右上隅にある [拡張機能] をクリックして、構成したばかりのプロキシを選択します。
    

14. 有効になると、ローカルでデバッグできます。