デバイスプレビュー - トラブルシューティング

デバイスで web ページをプレビューまたは検証できずお困りですか。Dreamweaver でのデバイスプレビューに関する問題のトラブルシューティングに役立つ次のヒントをご覧ください。

2021 年 11 月 16 日より、複数のデバイス間でページをプレビューする機能が、Dreamweaver のすべてのバージョンで廃止されました。リアルタイムプレビュー機能を使用して、複数のブラウザーでページをプレビューすることを推奨します。この回避策をデバイスのデバイスプレビューに使用できます。

最初にチェックする項目

デバイスプレビューの下記の基本的な前提条件を満たしているかどうかを確認します。それでも問題が発生する場合は、「高度なトラブルシューティング」を参照してください。

デバイスと Dreamweaver はインターネットに接続されており、同じネットワーク上にありますか?

デバイスプレビューは、Dreamweaver を実行するコンピューターとデバイスがそれぞれ別のネットワークに接続されている場合、機能しません。例えば、デバイスでモバイルサービスプロバイダーが指定したネットワーク接続が使用され、Dreamweaver を自宅のネットワークで実行した場合、デバイスプレビューは動作しません。

すべてのデバイスとデスクトップコンピューターが同じネットワーク上にあることを確認してください。

デバイスのブラウザーで JavaScript と Cookie が有効になっていますか?

デバイスプレビューでは、デバイスのブラウザー設定で JavaScript と Cookie が有効になっている必要があります。デバイスのブラウザー設定画面に移動し、JavaScript と Cookie を探して有効にしてください。

Dreamweaver とデバイスに同じ Adobe ID を使用していますか?

デバイスプレビューサービスでは、Adobe ID を使用してデバイスにログインする必要があります。この Adobe ID は、Dreamweaver メンバーシップの購入と試行に使用したのと同じ ID でなければなりません。別の Adobe ID を使用した場合、ログインはデバイスで技術的には認証されますが、Dreamweaver で使用している ID でサインインしない限り、ページをプレビューすることはできません。

Dreamweaver に使用している Adobe ID を確認するには、ヘルプ/<対象の Adobe ID> のログアウトをクリックします。

プレビューに有効なドキュメントを開いていますか?

デバイスの Dreamweaver のライブビューでレンダリングできるものであれば、技術的にどのドキュメントもプレビューできます。つまり、デバイスで HTML、PHP などのドキュメントをプレビューできます。CSS、XML、LESS、JS などのファイルをプレビューしようとすると、デバイスにエラーが表示され、Dreamweaver でプレビュー用の有効なドキュメントを開く必要があることを示すメッセージが表示されます。

デバイスプレビューサービスに必要なアクセス権を所有していますか?

Dreamweaver の Enterprise アカウントを使用している場合、デバイスプレビューサービスにアクセスできません。システム管理者にお問い合わせのうえ、このサービスを使用するために必要な権限があることを確認してください。

高度なトラブルシューティング

デバイスプレビューサービスを起動できない

Dreamweaver では、デバイスプレビューサービスのためローカルの HTTP およびノードサーバーが、ノードがランダムに割り当てたポートで実行されます。デバイスプレビューは、次のいずれかまたは両方がシステム管理者によってブロックされている場合、機能しません。

  • ノードサーバーがランダムに割り当てたポート
  • localhost の IP アドレス、127.0.0.1

この問題に対処するには、次の手順を実行します。

  1. Dreamweaver を再起動します。Dreamweaver でノードサーバーインスタンスを作成できなかった場合は、Dreamweaver を再起動すると、この問題が解決します。

    これでも問題が解決されない場合は、手順 2 および 3 に進みます。

  2. ノードサーバーからデバイスプレビューサービス専用のポートを割り当てます。このポート番号は、デバイスプレビューのキーとともに NodePort.json に追加する必要があります。これを行うプロセスはこちらで説明しています。

NodePort.json ファイルの作成

  1. NodePort.json ファイルを作成し、次の形式のファイルでポート番号を指定します。

    注意:

    このポート番号がシステム管理者によってブロックされていないことを確認します。

    {
    “previewport” : <portnumber>
    }
    

    例:使用するポート番号が 8010 の場合

    {
    “previewport” : 8010
    }
    
    注意:

    既にキー値のペアが追加された NodePort.json ファイルが作成されている場合は、コンマを使用して新しいキー値のペアを分割するか、別の行に新しいキー値ペアを指定します。

  2. 次のパスに NodePort.json ファイルを保存します。

    • Win%appdata%¥Adobe¥Dreamweaver CC 2015¥ja_JP¥Configuration
    • Mac~/Library/Application Support/Adobe/Dreamweaver CC 2015/ja_JP/Configuration
  3. Dreamweaver を再起動します。

ファイアウォール設定によって Dreamweaver への接続がブロックされる

デスクトップコンピューターまたはエンタープライズファイアウォールのファイアウォール設定で外部デバイスからの接続がブロックされていると、デバイスは Dreamweaver に接続できません。 

  1. コンピューター上のファイアウォール設定で外部デバイスからの接続を許可するように構成します。オフィスのコンピューターを使用している場合は、システム管理者に問い合わせてください。

    外部デバイスからの接続に対して確認を要求するようにファイアウォールが設定されている場合は、Dreamweaver ノードサーバーへのアクセスを許可するようにメッセージが表示されます。例えば、Windows ファイアウォールを構成した場合、アクセスを許可するオプションがプロンプトに表示されます。適切なネットワーク(パブリックまたはプライベート)を選択し、「アクセスを許可する」をクリックします。

    注意:コンピューターがどのネットワークに接続されているかを確認するには、コントロールパネルの Windows ファイアウォールの設定を開き、設定を確認します。

  2. ノードサーバーからデバイスプレビューサービス専用のポートを割り当てます。このポート番号は、デバイスプレビューのキーとともに NodePort.json に追加する必要があります。これを行うプロセスはこちらで説明しています。

プロキシサーバー設定によって外部デバイスへの接続がブロックされる

Dreamweaver を実行するコンピューターの IP アドレスがプロキシサーバーのホワイトリストに含まれていないと、デバイスプレビューは動作しません。

システム管理者にお問い合わせのうえ、コンピューターをプロキシサーバー設定のホワイトリストに追加してください。

JavaScript と Cookie がデバイス上のブラウザーで有効になっていない

デバイスプレビューでは、デバイスのブラウザー設定で JavaScript と Cookie が有効になっている必要があります。デバイスのブラウザー設定画面に移動し、JavaScript と Cookie を探して有効にしてください。その後、デバイスで QR コードを再スキャンして web ページをプレビューします。

プレビューが動作せず、この記事にリダイレクトされる

2021 年 11 月 16 日より、複数のデバイス間でページをプレビューする機能が、Dreamweaver のすべてのバージョンで廃止されました。リアルタイムプレビュー機能を使用して、複数のブラウザーでページをプレビューすることを推奨します。この回避策をデバイスのデバイスプレビューに使用できます。

次のような場合に、この記事にリダイレクトされます。

  • デバイスを Dreamweaver に接続できない。
    • デバイスと Dreamweaver が異なるネットワーク上にある。

      デバイスプレビューは、Dreamweaver を実行するコンピューターとデバイスがそれぞれ別のネットワークに接続されている場合、機能しません。例えば、デバイスでモバイルサービスプロバイダーが指定したネットワーク接続が使用され、Dreamweaver を自宅のネットワークで実行した場合、デバイスプレビューは動作しません。

      すべてのデバイスとデスクトップコンピューターが同じネットワーク上にあることを確認してから、web ページのプレビューを再試行してください。

    • コンピューターのファイアウォール設定によりデバイスからの接続の受信が遮断される。
  • デバイスから無効または古い URL(adobe.ly の短い URL)にアクセスしている。デバイスで QR コードを再スキャンしてページをプレビューしてください。
  • Windows 8.1 Pro OS 上の Internet Explorer 11 を介して web ページにアクセスしている場合。Internet Explorer のバージョンが 11.0.9600.17690 またはそれ以降であることを確認するか、別のブラウザーを使用してプレビューします。
  • 内部エラーが発生した場合。しばらくたってから web ページをプレビューするか、Dreamweaver を再起動してください。

Dreamweaver でデバイスプレビューを使用するための回避策

デバイスでページレイアウトを表示するには、この回避策を使用できます。次の手順に従います。

  1. テストサーバーの設定方法のリンクを使用して、テストサーバーを設定します。

  2. ファイルを保存して、テストサーバーにプッシュします。標準ツールバー(ウィンドウツールバー標準)を有効にして、テストサーバー上の Web ページの URL を検索します。

  3. Dreamweaver アプリケーションから URL を取得し、それをモバイルブラウザーに貼り付けます。URL は次の形式です。http://localhost/Devicepreview/index.htmllocalhost をコンピューターの IP アドレスに置き換えます。 例:http://xx.xxx.xxx.xxx/Devicepreview/index.html where xx.xxx.xxx.xxx は、コンピューターの IP アドレスです。

  4. コンピューターと同じインターネット接続に接続されている任意のデバイスで上記の URL(IP アドレスを含む)を使用すると、デバイスで Web ページを表示できます。

 Adobe

ヘルプをすばやく簡単に入手

新規ユーザーの場合

Adobe MAX 2025

Adobe MAX Japan
クリエイターの祭典

2025 年 2 月 13 日
東京ビッグサイト