1 仕事を選ぶ
言語 判定はあくまで出発点で、直すのはクリック1回です。
すべてのオブジェクトのキーを並べ替える コードポイントではなく読みの順で並べるので、item2がitem10より前に来ます。JSONのみです。
いちばん外側の要素の名前 XMLは頂点にひとつだけ要素を持ちますが、JSONは持ちません。だから、ひとつこしらえる必要があります。
2 貼り付ける
3 結果を持ち出す
# JSONフォーマッター — 整形・圧縮・変換
JSON・XML・HTML・CSS・YAMLを、整形するか変換します。よそのサーバーに貼り付けるものは何もありません。
> JSON・XML・HTML・CSS・YAMLの整形と最小化、JSONとYAML・XMLの相互変換。パーサーはブラウザの中で動き、アップロードは一切ありません。トークンや設定ファイルが手元の端末を離れることはありません。
これはhttps://abox.tools/ja/json-formatter/にあるブラウザー用の対話型ツールです。ファイルはそのブラウザーを実行する端末上で処理します。意図した共有や任意の通信機能はページ内で説明します。以下は文章による説明です。利用するにはアドレスを開いてください。
## テキストとコードは**ブラウザー内で処理**されます。処理のためのアップロードはありません。
整形も変換も文字列に対する計算で、このページの中で行われます。パーサーは手書きで`src/`にあります。`shared/parse-json.js`、`shared/parse-xml.js`、`css.js`、`shared/parse-yaml.js`。それ以外は何もありません。この道具にはどんなネットワーク機能もありません。取りに行く先も、送る先もありません。それがこのサイトのほぼどこよりも効いてくるのがここです。人が整形ツールに貼り付けるものは、アクセストークン、セッションのクッキー、顧客の記録、未公開のコードだからです。
- ✗ アップロードなし
- ✗ 登録なし
- ✗ サイズ制限なし
- ✓ オフラインで動作
- ✓ ソース公開
## JSONをアップロードせずに整形・変換する手順
1. **仕事を選びます。** タブは2つ、入力欄は1つ。*整形*はJSON・XML・HTML・CSS・YAMLを整えるか、平らに圧縮します。*変換*はJSONをYAMLやXMLにし、その逆もします。いま整形したテキストがそのまま変換するテキストになるので、2回貼り付ける必要はありません。
2. **貼り付けるか、ファイルをドロップします。** 選択してコピーできるものなら何でも構いません。選択欄に落としたファイルはお使いのブラウザが読んで欄に入れます。省略できるアップロードの段階が、そもそもありません。
3. **言語を判定させるか、自分で指定します。** メニューには、テキストを何として読んだかが出ます。直すのはクリック1回です。判定はあくまで出発点であり、だからこそ黙って適用せずに表示しています。
4. **字下げを選ぶか、平らに詰めます。** 半角2つ、4つ、あるいはタブ。平らに詰めるとは、読むためだけにあった空白をすべて取り去った同じ文書のことで、結果にはそれで何バイト減ったかが出ます。
5. **エラーは、エラーのある場所で読みます。** ここでパーサーが失敗したときは、何を見つけたのか、何行目の何列目かを伝えます。「位置4193に予期しないトークン」ではありません。たいていはそれだけで、ほかを開かずに設定ファイルを直せます。
6. **結果を持ち帰ります。** コピーするか、出てきた言語の名前が付いたファイルとしてダウンロードしてください。
## 詳しい解説
[JSONを誰にも渡さずに整形する方法](https://abox.tools/ja/guides/format-json-without-uploading-it/): 自分のブラウザの中でJSONを整え、確かめ、詰める方法。整形ツールがファイルについて決して変えてはいけないもの、エラーの読み方、そして貼り付ける先が問題になる理由。
## 箱の中のほかのツール
- [YAML・JSON変換](https://abox.tools/ja/yaml-to-json/): 双方向で、それぞれの代償も伝えます。どちらも、よそのサーバーに貼り付けられることはありません。
- [XMLフォーマッター](https://abox.tools/ja/xml-formatter/): 読むために整えたXML、送るために平たく圧縮したXML、そして双方向のJSON変換。そのどれも、よそのサーバーに貼り付けられることはありません。
- [テキスト差分](https://abox.tools/ja/text-diff/): 2つのテキストを入れると、すべての違いが行単位・単語単位で印付きで出てきます。よそのサーバーに貼り付けるものは何もありません。
- [Base64エンコーダー・デコーダー](https://abox.tools/ja/base64/): Base64、パーセントエンコード、HTMLエンティティ、16進、バックスラッシュのエスケープを双方向で。よそのサーバーに貼り付けるものは何もありません。
## よくある質問
### テキストはどこかにアップロードされますか？
いいえ。このページのパーサーもプリンターも、お使いのブラウザの中で、お手元のハードウェアで動く関数です。この道具にはどんなネットワーク機能もありません。何かを取りに行くことも、送ることもありません。ページの`Content-Security-Policy`には接続してよいアドレスがすべて書かれていて、そのどれもこのサイトのものではありません。アクセストークンやセッションのクッキー、顧客の記録をここで扱う理由はそれです。そういうものを他人の整形ツールに貼り付けるのは、相手に渡すのと同じことだからです。
### JSONの整形で、見た目以外に変わるものはありますか？
ありません。そしてこれは、聞こえるほど簡単ではありません。キーは書いた順のままです。`JSON.parse`の上に作られた整形ツールは、整数のようなキーを黙って先頭へ動かすので、`{"10":a,"2":b}`が`{"2":b,"10":a}`になって戻ってきます。数字は打ったままの桁を保つので、20桁のIDが末尾3桁を倍精度に持っていかれることもなく、`1e999`が`null`になることもありません。重複したキーは両方残します。どちらが勝つかを規格が決めていない以上、片方を捨てるのはあなたに代わって決めることになるからです。
### どの言語を整形できますか？
JSON、XML、HTML、CSS、YAMLです。JSON・XML・HTML・CSSは平らに詰めることもできますが、YAMLはできません。YAMLの短い書き方はフロースタイルで、読みにくく、読みにくいことはファイルをYAMLで持っておく理由の正反対だからです。JavaScriptは意図して一覧に入れていません。下の質問をご覧ください。
### JavaScriptやPython、SQLを整形しないのはなぜですか？
プログラミング言語を整えるとは、それをきちんと解析するということであり、ほとんど正しい整形ツールは、まったくないより悪いからです。見た目は問題ないのに別のことをするコードを生みます。JSON・XML・CSS・YAMLの文法は、手で読み、自分で走らせられるテストで確かめられる程度に小さいものです。JavaScriptの整形ツールといえばPrettierで、1メガバイトのパーサーです。あれはウェブページではなく、エディターの中にあるべきものです。
### YAMLにnoと書いたのに、JSONでは文字列になりました。なぜですか？
それが文字列だからで、ここが読むのはYAML 1.1ではなくYAML 1.2だからです。YAML1.1では`yes`、`no`、`on`、`off`が真偽値でした。ノルウェーの国コードが`false`になる、あの有名な不具合です。YAML 1.2はそれをやめ、この道具も同じです。テキスト以外として読まれるのは`true`、`false`、`null`、`~`だけです。逆向きでは、これらの語は*引用符付き*で書き戻します。この道具なら引用符がなくてもテキストとして読みますが、そのファイルを次に開くものはそうとは限らないからです。PyYAMLはいまも既定が1.1です。厳しく読み、控えめに書く。両方の向きで正しくなる組み合わせはこれだけです。
### YAMLをJSONにすると何が失われますか？
コメントです。JSONには置く場所がありません。アンカー、エイリアス、タグは推測せずにはっきり拒否します。どれもJSONには言えないことを言っており、黙って解釈をひとつ選ぶ変換器は、ファイルの内容とは違う文書をあなたに渡すことになるからです。逆向きでは何も失われません。JSONの文書はすでにYAMLの文書です。
### JSONをXMLにすると何が失われますか？
空のオブジェクト、空の配列、空の文字列の違いです。どれも空の要素になります。そして、それぞれの値の型も失われます。XMLに型がないからで、逆変換がすべてを文字列のままにし、`8080`を数値だと決めつけないのもそのためです。配列は繰り返しの要素になります。読み戻せる形はそれだけだからです。要素名にできないキーは、扱いにくい文字を置き換えます。どのパーサーも読まない文書を吐き出すよりはましだからです。
### HTMLの字下げをやり直すと、ページの見た目は変わりますか？
変わることがあり、そこは正直に書いておきます。インライン要素どうしのあいだの空白は、単語と単語のあいだの空白です。動かすのはただではありません。歯止めは2つあります。`<pre>`と`<textarea>`はそのまま写し取ること、そしてテキストしか入っていない要素は1行のままにすることです。それ以外は整えます。
### どれくらい大きいファイルまで扱えますか？
ここに上限は設けていません。その費用を払うサーバーが存在しないからです。実際の頭打ちはお使いの端末です。数メガバイトのJSONなら問題ありません。とても長い文書では、キーボードを取り合う代わりに、入力が一息つくのを待ってから整形し直します。
### 無料ですか。アカウントは必要ですか？
無料です。アカウントも、ログインも、試用期間もなく、貼り付けられる量にも制限はありません。このサイトには広告があり、それが費用を賄っています。広告にテキストの情報が渡されることはありません。
### オフラインでも動きますか？
動きます。ページを一度読み込んでから通信を切っても、そのまま使えます。何もアップロードされていないことを示す、いちばん簡単な方法でもあります。整形のためにテキストをどこかへ送っている道具なら、線を抜いた瞬間に止まるからです。
## この主張を確かめる方法
- **処理はこのブラウザー内で行います。** 入力と結果はブラウザー内で処理し、処理コードはそれらを処理用にアップロードしません。Content-Security-Policyは資源と接続先を制限しますが、許可済みの相手はリクエストを受け取れます。内容は検査せず、何も送られないことを単独で証明しません。具体的な操作の要求とソースを比較するか、切断中にローカル操作を完了してください。
- **ここからは何も取りに行きません。** `src/`のどこにも`fetch`も、`XMLHttpRequest`も、`sendBeacon`もありません。どのパーサーも、どのプリンターも、文字列を受け取って文字列を返す、このページの中の関数です。
- **整形は、渡されたものをそのまま保ちます。** JSONのオブジェクトは、書いた順のキーと、書いたとおりの数字で戻ってきます。`src/shared/parse-json.js`が`JSON.parse`の呼び出しではなくパーサーだからです。あちらは整数のようなキーを並べ替え、20桁のIDをいちばん近い倍精度に変えてしまいます。`tests/js/text-format.test.js`のテストは、まさにそこを確かめています。
- **Googleが読み込むものと、渡されないもの。** 広告と計測のスクリプトはGoogleから、寄付ボタンはBuy Me a Coffeeから来ています。そのどれにも、あなたのテキストは1文字も渡されません。テキストを読み、解析し、書き出すコードはすべてこのオリジンから配信され、リポジトリに載っています。
- **オフラインで動きます。** 通信を切ってもこの道具は何も変わりません。もともと通信する段階が存在しないからです。これがいちばん単純な証明です。
**自分で確かめてください。**以上のどれも、鵜呑みにする必要はありません。このページは、リポジトリにあるテンプレートと設定から、誰でも読んで実行できるビルドスクリプトが生成しています。その結果は`dist`ブランチに置いてあるので、配信されているものと、ソースをビルドした結果とを差分で比べられます。 https://github.com/A-Box-of-Tools/website
まず読むとよいのは、Content-Security-Policyについては`config/site.toml`、書いた順どおりにキーを保つパーサーは`src/shared/parse-json.js`にあります。変換がなぜパーサー1つとプリンター1つで、両方の形式を同時に知るものが間に何もないのかは、`src/convert.js`を読んでください。
JSONをアップロードせずに整形・変換する手順
- 仕事を選びます。タブは2つ、入力欄は1つ。整形はJSON・XML・HTML・CSS・YAMLを整えるか、平らに圧縮します。変換はJSONをYAMLやXMLにし、その逆もします。いま整形したテキストがそのまま変換するテキストになるので、2回貼り付ける必要はありません。
- 貼り付けるか、ファイルをドロップします。選択してコピーできるものなら何でも構いません。選択欄に落としたファイルはお使いのブラウザが読んで欄に入れます。省略できるアップロードの段階が、そもそもありません。
- 言語を判定させるか、自分で指定します。メニューには、テキストを何として読んだかが出ます。直すのはクリック1回です。判定はあくまで出発点であり、だからこそ黙って適用せずに表示しています。
- 字下げを選ぶか、平らに詰めます。半角2つ、4つ、あるいはタブ。平らに詰めるとは、読むためだけにあった空白をすべて取り去った同じ文書のことで、結果にはそれで何バイト減ったかが出ます。
- エラーは、エラーのある場所で読みます。ここでパーサーが失敗したときは、何を見つけたのか、何行目の何列目かを伝えます。「位置4193に予期しないトークン」ではありません。たいていはそれだけで、ほかを開かずに設定ファイルを直せます。
- 結果を持ち帰ります。コピーするか、出てきた言語の名前が付いたファイルとしてダウンロードしてください。
詳しい解説
JSONを誰にも渡さずに整形する方法 自分のブラウザの中でJSONを整え、確かめ、詰める方法。整形ツールがファイルについて決して変えてはいけないもの、エラーの読み方、そして貼り付ける先が問題になる理由。
箱の中のほかのツール
よくある質問
テキストはどこかにアップロードされますか？
いいえ。このページのパーサーもプリンターも、お使いのブラウザの中で、お手元のハードウェアで動く関数です。この道具にはどんなネットワーク機能もありません。何かを取りに行くことも、送ることもありません。ページのContent-Security-Policyには接続してよいアドレスがすべて書かれていて、そのどれもこのサイトのものではありません。アクセストークンやセッションのクッキー、顧客の記録をここで扱う理由はそれです。そういうものを他人の整形ツールに貼り付けるのは、相手に渡すのと同じことだからです。
JSONの整形で、見た目以外に変わるものはありますか？
ありません。そしてこれは、聞こえるほど簡単ではありません。キーは書いた順のままです。JSON.parseの上に作られた整形ツールは、整数のようなキーを黙って先頭へ動かすので、{"10":a,"2":b}が{"2":b,"10":a}になって戻ってきます。数字は打ったままの桁を保つので、20桁のIDが末尾3桁を倍精度に持っていかれることもなく、1e999がnullになることもありません。重複したキーは両方残します。どちらが勝つかを規格が決めていない以上、片方を捨てるのはあなたに代わって決めることになるからです。
どの言語を整形できますか？
JSON、XML、HTML、CSS、YAMLです。JSON・XML・HTML・CSSは平らに詰めることもできますが、YAMLはできません。YAMLの短い書き方はフロースタイルで、読みにくく、読みにくいことはファイルをYAMLで持っておく理由の正反対だからです。JavaScriptは意図して一覧に入れていません。下の質問をご覧ください。
JavaScriptやPython、SQLを整形しないのはなぜですか？
プログラミング言語を整えるとは、それをきちんと解析するということであり、ほとんど正しい整形ツールは、まったくないより悪いからです。見た目は問題ないのに別のことをするコードを生みます。JSON・XML・CSS・YAMLの文法は、手で読み、自分で走らせられるテストで確かめられる程度に小さいものです。JavaScriptの整形ツールといえばPrettierで、1メガバイトのパーサーです。あれはウェブページではなく、エディターの中にあるべきものです。
YAMLにnoと書いたのに、JSONでは文字列になりました。なぜですか？
それが文字列だからで、ここが読むのはYAML 1.1ではなくYAML 1.2だからです。YAML1.1ではyes、no、on、offが真偽値でした。ノルウェーの国コードがfalseになる、あの有名な不具合です。YAML 1.2はそれをやめ、この道具も同じです。テキスト以外として読まれるのはtrue、false、null、~だけです。逆向きでは、これらの語は引用符付きで書き戻します。この道具なら引用符がなくてもテキストとして読みますが、そのファイルを次に開くものはそうとは限らないからです。PyYAMLはいまも既定が1.1です。厳しく読み、控えめに書く。両方の向きで正しくなる組み合わせはこれだけです。
YAMLをJSONにすると何が失われますか？
コメントです。JSONには置く場所がありません。アンカー、エイリアス、タグは推測せずにはっきり拒否します。どれもJSONには言えないことを言っており、黙って解釈をひとつ選ぶ変換器は、ファイルの内容とは違う文書をあなたに渡すことになるからです。逆向きでは何も失われません。JSONの文書はすでにYAMLの文書です。
JSONをXMLにすると何が失われますか？
空のオブジェクト、空の配列、空の文字列の違いです。どれも空の要素になります。そして、それぞれの値の型も失われます。XMLに型がないからで、逆変換がすべてを文字列のままにし、8080を数値だと決めつけないのもそのためです。配列は繰り返しの要素になります。読み戻せる形はそれだけだからです。要素名にできないキーは、扱いにくい文字を置き換えます。どのパーサーも読まない文書を吐き出すよりはましだからです。
HTMLの字下げをやり直すと、ページの見た目は変わりますか？
変わることがあり、そこは正直に書いておきます。インライン要素どうしのあいだの空白は、単語と単語のあいだの空白です。動かすのはただではありません。歯止めは2つあります。<pre>と<textarea>はそのまま写し取ること、そしてテキストしか入っていない要素は1行のままにすることです。それ以外は整えます。
どれくらい大きいファイルまで扱えますか？
ここに上限は設けていません。その費用を払うサーバーが存在しないからです。実際の頭打ちはお使いの端末です。数メガバイトのJSONなら問題ありません。とても長い文書では、キーボードを取り合う代わりに、入力が一息つくのを待ってから整形し直します。
無料ですか。アカウントは必要ですか？
無料です。アカウントも、ログインも、試用期間もなく、貼り付けられる量にも制限はありません。このサイトには広告があり、それが費用を賄っています。広告にテキストの情報が渡されることはありません。
オフラインでも動きますか？
動きます。ページを一度読み込んでから通信を切っても、そのまま使えます。何もアップロードされていないことを示す、いちばん簡単な方法でもあります。整形のためにテキストをどこかへ送っている道具なら、線を抜いた瞬間に止まるからです。