hoppscotch - 👽 オープンソース API 開発エコシステム - https://hoppscotch.io

(👽 Open source API development ecosystem - https://hoppscotch.io)

Created at: 2019-08-21 21:15:24
Language: Vue
License: MIT
ホップスコッチ ロゴ

ホップスコッチ

オープンソース API 開発エコシステム

貢献歓迎 Webサイト テスト つぶやき

寄稿者 による❤︎で構築


ホップスコッチ ホップスコッチ

サポート

Discordでチャット テレグラムでチャット GitHub で議論する

特徴

❤️ 軽量:ミニマルな UI デザインで作られています。

⚡️ 高速:リクエストを送信し、リアルタイムでレスポンスを取得/コピーします。

HTTP メソッド

  • GET
    - リソース情報の取得要求
  • POST
    - サーバーはデータベースに新しいエントリを作成します
  • PUT
    - 既存のリソースを更新します
  • PATCH
    - 非常に似て
    PUT
    いますが、リソースの部分的な更新を行います
  • DELETE
    - リソースまたは関連コンポーネントを削除します
  • HEAD
    - GET 要求と同じ応答ヘッダーを取得しますが、応答本文はありません。
  • CONNECT
    - ターゲット リソースによって識別されるサーバーへのトンネルを確立します。
  • OPTIONS
    - 対象リソースの通信オプションを記述する
  • TRACE
    - ターゲット リソースへのパスに沿ってメッセージ ループバック テストを実行します。
  • <custom>
    - 一部の API は、 などのカスタム リクエスト メソッドを使用します
    LIST
    。カスタム メソッドを入力します。

🌈 あなたのものにしましょう:背景、前景色、アクセント カラーのカスタマイズ可能な組み合わせ —今すぐカスタマイズ.

テーマ

  • テーマを選択: システム (デフォルト)、ライト、ダーク、ブラック
  • アクセント カラーの選択: グリーン (デフォルト)、ティール、ブルー、インディゴ、パープル、イエロー、オレンジ、レッド、ピンク
  • 気晴らしのない禅モード

カスタマイズされたテーマはクラウド/ローカル セッションと同期されます

🔥 PWA:デバイスにPWAとしてインストールします。

  • Service Worker による即時読み込み
  • オフラインサポート
  • RAM/メモリと CPU の使用率が低い
  • ホーム画面に追加します
  • デスクトップ PWA

🚀 リクエスト:エンドポイントから即座にレスポンスを取得します。

  1. 選ぶ
    method
  2. 入る
    URL
  3. 送信
  • 公開の「共有 URL」をコピー/共有する
  • 10 以上の言語とフレームワークのリクエスト コード スニペットを生成/コピー
  • 輸入
    cURL
  • ラベルのリクエスト

🔌 WebSocket:単一の TCP 接続で全二重通信チャネルを確立します。

📡 サーバー送信イベント:ポーリングに頼らずに、HTTP 接続を介してサーバーから更新のストリームを受信します。

🌩 Socket.IO: SocketIO サーバーでデータを送受信します。

🦟 MQTT: MQTT ブローカーのトピックをサブスクライブおよび発行します。

🔮 GraphQL: GraphQL は、API のクエリ言語であり、既存のデータを使用してこれらのクエリを実行するためのランタイムです。

  • エンドポイントを設定してスキーマを取得する
  • 複数列のドキュメント
  • カスタム リクエスト ヘッダーを設定する
  • クエリ スキーマ
  • クエリの応答を取得する

🔐 承認:エンドユーザーを識別できるようにします。

  • なし
  • 基本
  • 無記名トークン
  • OAuth 2.0
  • OIDC アクセストークン/PKCE

📢 ヘッダー:リクエストの本文が送信される形式について説明します。

📫 パラメータ:リクエスト パラメータを使用して、シミュレートされたリクエストのさまざまな部分を設定します。

📃 リクエスト ボディ: REST API を介してデータを送受信するために使用されます。

  • 設定
    Content Type
  • FormData、JSON、その他多数
  • Key-Value と RAW 入力パラメータ リストを切り替えます

👋 応答:ステータス ライン、ヘッダー、およびメッセージ/応答本文が含まれます。

  • 回答をクリップボードにコピー
  • 応答をファイルとしてダウンロード
  • 応答ヘッダーを表示する
  • HTML、画像、JSON、XML レスポンスの未加工およびプレビューを表示

⏰ 履歴:リクエスト エントリはクラウド/ローカル セッション ストレージと同期され、ワンクリックで復元されます。

📁 コレクション: API リクエストをコレクションとフォルダーで整理します。ワンクリックでそれらを再利用します。

  • 無制限のコレクション、フォルダー、およびリクエスト
  • ネストされたフォルダー
  • ファイルまたは GitHub Gist としてエクスポートおよびインポートする

コレクションはクラウド/ローカル セッション ストレージと同期されます

🌐 プロキシ:設定からプロキシ モードを有効にして、ブロックされた API にアクセスします。

  • IPアドレスを隠す
  • 修正
    CORS
    (クロスオリジン リソース共有) の問題
  • 非 HTTPS (
    http://
    ) エンドポイントで提供される API にアクセスする
  • プロキシ URL を使用する

公式プロキシ サーバーは Hoppscotch によってホストされています - GitHub -プライバシー ポリシー

📜 Pre-Request Scripts β:リクエストが送信される前に実行される、リクエストに関連付けられたコードのスニペット。

  • 環境変数を設定する
  • リクエスト ヘッダーにタイムスタンプを含める
  • URL パラメータでランダムな英数字の文字列を送信する
  • JavaScript 関数

📄 API ドキュメンテーション:動的な API ドキュメンテーションを簡単かつ迅速に作成して共有します。

  1. リクエストをコレクションとフォルダーに追加する
  2. コレクションをエクスポートし、API をチームの他のメンバーと簡単に共有できます
  3. 外出先でコレクションをインポートしてドキュメントを生成

⌨️ キーボード ショートカット:効率化のために最適化されています。

キーボード ショートカットに関するドキュメントを読む

🌎 i18n:あなたの言語でアプリを体験してください。

Hoppscotch の翻訳にご協力ください。

TRANSLATIONS
の詳細
CODE OF CONDUCT
と、プル リクエストを送信するプロセスについてお読みください。

📦 アドオン: hoppscotch の公式アドオン。

  • Proxy - Hoppscotch 用に作成された単純なプロキシ サーバー

  • CLI β - Hoppscotch の CLI ソリューション

  • ブラウザー拡張機能- Hoppscotch へのアクセスを簡素化するブラウザー拡張機能

    ファイアフォックス Firefox  |  クロム クロム

    拡張機能

    CORS
    は問題を修正します。

  • Hopp-Doc-Gen - Hoppscotch 用の API ドキュメント ジェネレーター CLI

アドオンはHoppscotch Organizationの下で開発および保守されています。

☁️ 認証 + 同期:サインインしてリアルタイムでデータを同期します。

サインイン

  • GitHub
  • グーグル
  • マイクロソフト
  • Eメール

データを同期する

  • 歴史
  • コレクション
  • 環境
  • 設定

✅ Post-Request Tests β:リクエストのレスポンス後に実行されるリクエストに関連するテストを記述します。

  • ステータス コードを整数で確認する
  • 応答ヘッダーをフィルター処理する
  • 応答データを解析する
  • 環境変数を設定する
  • JavaScript コードを書く

🌱 環境: 環境変数を使用すると、リクエストやスクリプトで値を保存して再利用できます。

  • 無制限の環境と変数
  • 事前リクエスト スクリプトによる初期化
  • GitHub gist としてエクスポート / インポート
ユースケース
  • 値を変数に格納することで、リクエスト セクション全体で参照できます
  • 値を更新する必要がある場合は、1 か所で変更するだけで済みます
  • 変数を使用すると、作業効率が向上し、エラーの可能性が最小限に抑えられます

👨‍👩‍👧‍👦 Teams β: チーム全体で協力して、API をより迅速に設計、開発、およびテストするのに役立ちます。

  • 無制限のチーム
  • 無制限の共有コレクション
  • 無制限のチームメンバー
  • 役割ベースのアクセス制御
  • クラウド同期
  • 複数のデバイス

🚚 一括編集:キーと値のペアを一括で編集します。

  • エントリは改行で区切られます
  • キーと値は
    :
  • 追加
    #
    したい行の先頭に追加しますが、無効のままにしておきます

その他の機能については、ドキュメントをお読みください。

デモ

hoppscotch.io

使用法

  1. URL フィールドに API エンドポイントを指定します
  2. 「送信」をクリックして、リクエストをシミュレートします
  3. 回答を見る

で構築

現像

  1. .env.example
    で見つかったファイル
    packages/hoppscotch-app
    を独自のキーで更新し、名前を に変更し
    .env
    ます。

サンプル キーは、製品ビルドでのみ機能します。

ブラウザベースの開発環境

ローカル開発環境

  1. このリポジトリを git でクローンします。
  2. を実行して、npm を使用して pnpm をインストールします
    npm install -g pnpm
    。
  3. クローンしたディレクトリ内で実行して、依存関係をインストール
    pnpm install
    します (おそらく
    hoppscotch
    )。
  4. で開発サーバーを起動します
    pnpm run dev
    。
  5. http://localhost:3000
    ブラウザで に移動して、開発サイトを開きます。

Docker 構成

  1. このリポジトリを git でクローンします。
  2. docker-compose up
    複製したディレクトリ内で実行します (おそらく
    hoppscotch
    )。
  3. http://localhost:3000
    ブラウザで に移動して、開発サイトを開きます。

ドッカー

公式コンテナ   ホップスコッチ/ホップスコッチ

docker run --rm --name hoppscotch -p 3000:3000 hoppscotch/hoppscotch:latest

リリース

  1. このリポジトリを git でクローンします。
  2. を実行して、npm を使用して pnpm をインストールします
    npm install -g pnpm
    。
  3. クローンしたディレクトリ内で実行して、依存関係をインストール
    pnpm install
    します (おそらく
    hoppscotch
    )。
  4. .env.example
    で見つかったファイル
    packages/hoppscotch-app
    を独自のキーで更新し、名前を に変更し
    .env
    ます。
  5. でリリース ファイルをビルドします
    pnpm run generate
    。
  6. でビルドされたプロジェクトを見つけます
    packages/hoppscotch-app/dist
    。これらのファイルを静的ホスティング サーバーでホストします。

貢献する

GitHub Flowを使用して貢献してください。ブランチを作成し、コミットを追加して、プル リクエストを開きます。

CONTRIBUTING
の詳細
CODE OF CONDUCT
と、プル リクエストを送信するプロセスについてお読みください。

継続的インテグレーション

継続的インテグレーションにはGitHub Actionsを使用します。ビルド ワークフローをご覧ください。

変更ログ

詳しくは

CHANGELOG
ファイルをご覧ください。

著者

このプロジェクトは、貢献するすべての人々のおかげで存在します—貢献します。

ライセンス

このプロジェクトは、MITライセンスの下でライセンスされています。詳細については、

LICENSE
ファイルを参照してください。