165

現在、Visual Studio 2012 内で (デバッグ モードで) .css ファイルを編集しています。Chrome をブラウザとして使用しています。Visual Studio 内でアプリケーションの .css ファイルに変更を加えて保存すると、ページを更新しても .css ファイルの更新された変更が読み込まれません。.css ファイルはまだキャッシュされていると思います。

私が試してみました：

  1. CTRL / F5
  2. Visual Studio 2012 で、[Web] タブのプロジェクト プロパティに移動します。[開始アクション] セクションで [外部プログラムの開始] を選択します。Google Chrome のパスを貼り付けるか参照します (私の場合は C:\Users\xxx\AppData\Local\Google\Chrome\Application\ です)。 chrome.exe) [コマンド ライン引数] ボックスに -incognito を入力します。
  3. Chrome 開発者ツールを使用して、[歯車] アイコンをクリックし、[キャッシュを無効にする] をオンにしました。

手動でデバッグを停止し (Chrome を閉じて)、アプリケーションを再起動 (デバッグ中) しない限り、何も機能しないようです。

Chrome が常にすべての css 変更をリロードし、.css ファイルをリロードするように強制する方法はありますか?

更新:
1. 更新すると、.aspx ファイルのインライン スタイルの変更が反映されます。しかし、.css ファイルの変更はそうではありません。2. ASP.NET MVC4 アプリなので、GET を実行するハイパーリンクをクリックします。そうすることで、スタイルシートに対する新しいリクエストは表示されません。ただし、F5 をクリックすると、.css ファイルがリロードされ、ステータス コード ([ネットワーク] タブ) は 200 になります。

4

24 に答える 24

238

chrome に css と js を強制的に再読み込みさせるには:

Windows オプション 1: CTRL+ SHIFT+ R
Windows オプション 2: SHIFT+F5

OS X:⌘</kbd> + SHIFT + R

コメントで@PaulSlocumが述べたように更新されました（そして多くが確認されました）

元の答え:

Chrome は動作を変更しました。Ctrl+Rやります。

OS X の場合:⌘</kbd> + R

css/js ファイルの再読み込みに問題がある場合は、再読み込みを行う前にインスペクター ( CTRL+ SHIFT+ C) を開きます。

于 2013-05-06T16:48:42.353 に答える
159

はるかに複雑な解決策がありますが、非常に簡単で単純な解決策は、CSSインクルードにランダムなクエリ文字列を追加することです。

そのようなsrc="/css/styles.css?v={random number/string}"

phpまたは別のサーバー側言語を使用している場合は、を使用してこれを自動的に行うことができますtime()。だからそれはstyles.css?v=<?=time();?>

このように、クエリ文字列は毎回新しくなります。私が言ったように、より動的なはるかに複雑なソリューションがありますが、テストの目的では、この方法がトップ（IMO）です。

于 2013-03-22T04:28:54.233 に答える
151

[以下のアップデートを読む]

私が見つけた最も簡単な方法は、Chrome DevTools の設定です。DevTools の右上にある歯車アイコン (最近のバージョンでは 3 つの縦のドット) をクリックして、[設定] ダイアログを開きます。そこで、ボックスにチェックを入れます：「キャッシュを無効にする（DevToolsが開いている間）」

更新: この設定は移動されました。「ネットワーク」タブにあり、「キャッシュを無効にする」というラベルの付いたチェックボックスです。 ここに画像の説明を入力

于 2014-02-10T04:53:24.420 に答える
11

あなたはブラウザのキャッシュの問題に取り組んでいます。

ページ自体のキャッシュを無効にします。それはブラウザ/キャッシュにページのサポートファイルを保存しません。

<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1990 12:00:00 GMT" />

headデバッグしているページのタグ、またはサイトのheadタグ に挿入する必要がある/必要なこのコードmaster page

これにより、ブラウザはファイルをキャッシュできなくなり、最終的にファイルはブラウザの一時ファイルに保存されなくなるため、キャッシュがなくなるため、リロードは必要ありません:)

私はこれがうまくいくと確信しています:)

于 2013-03-22T04:28:51.313 に答える
8

私の場合、Chrome DevTools の設定で、「キャッシュを無効にする (DevTools が開いている間)」を設定するだけでは機能しません。ソースにリストされている「CSS ソース マップを有効にする」と「生成された CSS を自動再読み込みする」をチェックする必要があります。グループ、このキャッシュの問題をなくすために。

于 2014-10-02T02:34:50.547 に答える
6

私はここで同じ問題に直面していました！しかし、確かに、私の解像度は上記のすべての例よりも優れています。これを行うだけで、

  1. F12 を押して Chrome 開発者コンソールを表示します。
  2. ブラウザの上部にあるリロード ボタンを右クリックし、[キャッシュを空にしてハード リロード] を選択します。

それだけです！

于 2017-01-29T14:21:12.433 に答える
3

現在のバージョンの Chrome (55.x) では、ページをリロード (Command + R) したときにすべてのリソースがリロードされません。これは .css ファイルのデバッグには役立ちません。

Command + R は、.html、.php、.etc ファイルのみをデバッグする場合に問題なく動作し、ローカル/キャッシュ リソース (.css、.js) で動作するため高速です。デバッグの反復ごとにブラウザのキャッシュを手動で削除するのは便利ではありません。

Mac で .css ファイルを強制的にリロードする手順 (キーボード ショートカット / Chrome): Command + Shift + R

于 2017-01-15T15:55:14.763 に答える
2

古い質問だと思いますが、外部の css/js ファイルを 1 つだけリロードする方法を探している人がいれば、Chrome で現在最も簡単な方法は次のとおりです。

  1. DevTools の[ネットワーク] タブに移動します
  2. リソースを右クリックし、Replay XHRを選択してリクエストを繰り返します。

リロードを強制するには、[キャッシュを無効にする] オプションが選択されていることを確認してください。

于 2015-10-19T16:01:27.850 に答える
2

macOS Chrome の場合:

  1. 開発者ツールを開くcmd+ alt+i
  2. 開発者ツールの右上隅にある 3 つのドットをクリックします
  3. クリック設定
  4. 下にスクロールしてNetwork
  5. スクリーンショットの表示を有効にDisable cache (while DevTools is open)します: ここに画像の説明を入力
于 2016-11-01T15:23:39.513 に答える
1

まだ問題です。

「..css?something=random-value」のようなパラメーターを使用しても、カスタマー サポートの経験は何も変わりません。名前の変更のみが機能します。

ファイルの名前変更に関する別の見方。IIS で URL 書き換えを使用しています。時々 Helicon の Isapi リライト。

新しいルールを追加します。

+ Name: lame-chrome-fix.
+ Pattern: styles/(\w+)_(\d+)
+ Rewrite URL: /{R:1}.css

注: 名前と乱数を区別するために、アンダーケースの使用を留保します。他の何かかもしれません。

例：

<link href="/styles/template_<% 
Response.Write( System.DateTime.UtcNow.ToString("ddmmyyhhmmss")); %>" 
type="text/css" />

(スタイル フォルダーはありません。パターンの名前の部分です)。

コードを次のように出力します。

<link href="/styles/template_285316115328" 
rel="stylesheet" type="text/css">

次のようにリダイレクトします。

(R:1 = テンプレート)

/template.css

ただ説明が長い。

于 2016-12-28T15:01:46.570 に答える
1

このスクリプトをコピーして Chrome コンソールに貼り付けると、CSS スクリプトが 3 秒ごとに強制的にリロードされます。CSS スタイルを改善する際に役立つことがあります。

var nodes = document.querySelectorAll('link');
[].forEach.call(nodes, function (node) {
    node.href += '?___ref=0';
});
var i = 0;
setInterval(function () {
    i++;

    [].forEach.call(nodes, function (node) {
        node.href = node.href.replace(/\?\_\_\_ref=[0-9]+/, '?___ref=' + i);
    });
    console.log('refreshed: ' + i);
},3000);
于 2015-08-13T11:06:31.430 に答える
1

この簡単なトリックで解決しました。

<script type="text/javascript">
  var style = 'assets/css/style.css?'+Math.random();;
</script>

<script type="text/javascript">
  document.write('<link href="'+style+'" rel="stylesheet">');
</script>
于 2016-10-22T06:10:51.553 に答える
0

目標を達成する最も簡単な方法は、Chrome で新しいシークレット ウィンドウを開くか、Firefoxでプライベート ウィンドウを開くことです。これはデフォルトでキャッシュされません。

これを開発目的で使用できるため、プロジェクトにランダムなキャッシュを防止するコードを挿入する必要がありません。

IE を使用している場合は、神があなたを助けてくれますように!

于 2016-11-02T12:37:05.673 に答える
0

（Macで）Chromeを実行している1人が突然CSSファイルのロードを停止するというこの問題が発生しました。CMD + R はまったく機能しませんでした。本番システムで永続的なリロードを強制する上記の提案は好きではありません。

うまくいったのは、HTML ファイル内の CSS ファイルの名前を変更することでした (もちろん、CSS ファイルの名前を変更しました)。これにより、Chrome は最新の CSS ファイルを取得する必要がありました。

于 2015-06-05T01:24:57.173 に答える
-1

Chrome/firefox/safari/IEこれらのショートカットでページ全体をリロードします

Ctrl+ R (または) Ctrl+F5

それがあなたを助けることを願っています!.

于 2014-09-02T09:46:29.653 に答える
-1

ホスティング会社として SiteGround を使用していて、他のソリューションがどれもうまくいかない場合は、次のことを試してください。

cPanel から、[SITE IMPROVEMENT TOOLS] に移動し、[SuperCacher] をクリックします。次のページで、[キャッシュをフラッシュ] ボタンをクリックします。

于 2017-08-30T18:09:51.703 に答える