Chromeを使用してhttp経由で配信されたWebページ上の画像のローカルファイルパスを指定できるようにしたいのですが、これは可能ですか?
IE=を使用してこれを実行したことを覚えていますが、その方法を思い出せません!信頼できる設定がいくつかあると思います...
たとえば、「 http://duri.me/ 」を使用して画像をbase-64コードに変換し、結果をブラウザにコピーできます。お気に入り:
<img width='16' height='16' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAApklEQVQ4jWP8//8/Ay5Q4s6GU7Jn5y9GBgYGBiacuokELKTYSpQByKB68UkMMUExQ0ZkPsVeYEQPREZGRpK8gOGCdy/PwTEyH8ZGF8MbBgwMDAxC4kZ4xfAaALMFGfz//5+6gYjXBS+fXUHhaxjEMqKrQXGBglU8SgyIS+mgYHR5DAPIAYz////HavL5DQVwtmHABAyND44tZGRgwBMG2DRhAxR7AQBhgT3yD6eBRwAAAABJRU5ErkJggg=='>
「Chrome」について言及したので、Chrome拡張機能を使用してファイルにローカルアクセスできるようにすることができます。
次の手順を実行します:
1)画像が置かれているローカルフォルダーに、「manifest.json」という名前のファイルを作成し、次のように入力します。
{
"name": "File Exposer",
"manifest_version": 2,
"version": "1.0",
"web_accessible_resources": ["*.jpg","*.JPG"]
}
2)これはあなたのchromeアドレスバーです:chrome:// extensions /
3)「開発者モード」がチェックされていることを確認します(ページの右上)
4)[Load Unpacked Extension]ボタンをクリックします
5)画像とmanifest.jsonファイルがあるローカルフォルダーに移動し、[ok]をクリックします
6)拡張機能「File Exposer」がリストに表示され、「Enabled」にチェックマークが付いているはずです。フォルダーがネットワークドライブまたはその他の低速ドライブ上にあるか、ファイルがたくさんある場合、リストに表示されるまでに10〜20秒以上かかることがあります。
7)拡張機能に関連付けられている「ID」文字列に注意してください。これはEXTENSION_IDです
8)これで、HTMLで次のようにしてファイルにアクセスできます。「EXTERNSION_ID」を、拡張によって生成されたIDに変更します。
<img src='chrome-extension://EXTENSION_ID/example1.jpg'>
* .jpgは再帰的であり、指定されたフォルダーとすべてのサブフォルダー内のファイルと自動的に一致することに注意してください。各サブフォルダーを指定する必要はありません。また、大文字と小文字が区別されます。
「img」タグでは、元のフォルダー、そのフォルダーからの相対フォルダーを指定しないため、サブフォルダーのみを指定する必要があります。
Manifest.jsonファイルを変更する場合は、拡張機能の横にある[再読み込み(Ctrl + R)]リンクをクリックする必要があります。
ローカル以外のウェブページ ローカルファイルにアクセスできません Chromeまたは最新のウェブブラウザ。
これは LocalLinks ( for Firefox )を使用してオーバーライドできますが、自分のマシンでのみ機能します。
ライブサイトでローカルイメージをテストする場合は、ローカルWebサーバーを実行し、DevToolsを使用してページに http://127.0.0.1:8123/img.jpg のようなURLを設定できます。
Webサーバーを実行するには、さまざまな方法があります。1.定義されたフォルダーを使用したブラウザーの拡張機能「Webサーバーfor Chrome」 https://chrome.google.com/webstore/detail/web-server-for-chrome/ ofhbbkphhbklhfoeikjpcbhemlocgigb
pythonがある場合は、選択したフォルダで埋め込み http server を実行します
python3 -m http.server 8123#python 3バージョン
python -m SimpleHTTPServer 8123#python 2バージョン
Chromeこれは次のようになります
file:///C:/sample.txt
私の場合、レスポンシブサイズを変えたときの1つの小さな画像の変化を確認するだけで済みました。名前を付けて保存するのが最も簡単でした...完全なWebページをデスクトップに表示してから、代わりに開きます。画像srcを調べて編集します。