\ 最大8%ポイントアップ! / 詳細を見る

ソースコード表示するURLコマンド“view-source:”の変換ツール

スマートフォンでWebページのソースコードを確認する場合は少し面倒です。
対象ページのURLの先頭にURLコマンド「view-source:」を追加が必要となります。

そこで今回は “WebページのURL” から “URLコマンド「view-source:https://~」”に変換できるWebツールを作成してみました。

 

この記事はこんな方にオススメ!

  • スマートフォン ユーザーの方
    (パソコンでもview-source:でソース表示できるが、こちらの記事で紹介している方法の方が手っ取り早い。)
     
  • 下記のブラウザを使用している方
    参考情報:view-source URI scheme – Wikipedia
    • Google Chrome(Edgeなど、他のChromiumベースのブラウザを含む)
    • Mozilla Firefox
    • Netscape
    • Opera 15 以上
    • SeaMonkey
    • Web
       
  • Webページのソースコードを表示したい方
目次

“view-source:”変換ツール

さきにWebツールを掲載。各機能の説明は後述しています。

コチラにURLを貼り付け!

ココのボタンで変換が可能!

以降は、このツールの説明や関連記事を紹介しています。

ツールの説明

概要

ソースを表示したいWebページのURLをあらかじめコピーしておき、本ツールのテキストボックスに貼り付け、
その後、変換ボタンを押すとソースを表示できるURLコマンド“view-source:対象URL”という形式に変換するWebツール。

下記は変換のイメージです。

変換前
変換後
  • https://haretokidoki-blog.com
  • view-source:https://haretokidoki-blog.com

ボタン機能について

貼り付けボタン

クリップボードにあるURL、もしくはURLコマンドをテキストボックスに貼り付けします。

変換ボタン

変換処理を実行します。
変換処理は、変換対象の文字列により下記の3パターンに分岐。

パターン1:変換対象の文字列が http:// もしくは https:// ではじまる場合

先頭に”view-source:”を追加した文字列に変換します。

パターン2:分岐1以外 かつ 半角コロン(:)がある場合

URLコマンドの指定があるものの打ち間違えた(たとえば、逆にsource-view:で指定)と判断し、
先頭から半角コロンまでの文字を消し、”view-soruce”に変換します。

パターン3:上記以外の場合

対象文字列がURLではないと判断し、何も処理をしない。

コピーボタン

テキストボックスにある変換後の文字列をクリップボードに書き込みます。

コピー後、アドレスバーに貼り付けてアクセスするとソースコードを表示することができる。

クリアボタン

テキストボックスにある文字列をすべて削除します。

参考情報

参考情報:view-source URI scheme – Wikipedia

まとめ

  • URLコマンド「view-source:対象のURL」が作成できるWebツールを作った
     
  • 主にスマートフォン用のWebツール
     
  • 後日対応したいこと
    • もう少し見た目を気にしたい
    • 主要なブラウザで動作するか検証したい
      ChromeやEdge以外、他のChromiumベースでも動作すると思われる。
      また、Firefoxでもおそらく動作可能。
      たぶん、動作しないのは、Safariが動かないと思われる。要検討。
    • Safariでもview-sourceのようなURLコマンドが実現できないか調べて記載したい(別記事?)

ほかのWebツールを作成して紹介する予定。

サポート募集中

この記事はお役に立てたでしょうか。現在、サポートを募集しています。
コーヒーを一杯 ☕ ご馳走いただけないでしょうか。

この記事が気に入ったら
フォローしてね!

この記事をシェアする

コメント

コメントする

コメントは日本語で入力してください。(スパム対策)

CAPTCHA

目次