發表文章

目前顯示的是有「firefox」標籤的文章

瀏覽器偵測網址改變, detect url change in browser javascript

網路上很多說法是用 popstate event 如果用AJAX (XHR)更新網頁內容,再用 history.pushState() 更新網址會抓不到 解法1 定期檢查 用 setInterval() 去定期檢查 window.location.href,消耗不必要的資源 解法2 事件驅動 透過browser extension去接收 tabs.onUpdated event 這個event只能在background page中收到,再透過tabs.sendMessage()丟去content script 的runtime.onMessage就能對網頁內容作處理了 webNavigation webRequest 在某些情況也可以用來解決AJAX更新網頁的偵測 我不想在extension要太多權限就用,manifest_version 3新加的 host_permissions限定只對目標網域處理 host_permissions 似乎在多數browser是optional permission...不能指定有點麻煩

Firefox Android addon/extension debug

Desktop和mobile支援的API不一樣,不是所有extension都能通用 iOS因為Apple規定browser只能用webkit,所以無法支援AMO的addon https://developer.mozilla.org/en-US/docs/Tools/about:debugging https://extensionworkshop.com/documentation/develop/developing-extensions-for-firefox-for-android/ https://developer.mozilla.org/en-US/docs/Tools/Web_Console/Split_console 有一部分訊息要用adb logcat來看,如果有裝android studio會比較方便看

Firefox回到上一個使用的分頁, return to the last used tab

https://addons.mozilla.org/firefox/addon/last-used-tab/ 動機: 我在工作時常需要切到別的分頁或是開新的分頁去查資料,查詢完畢想要回到原本的分頁 ex: 從分頁1->4->5,關掉45,這時會回到3不是回到1 使用方式: 按下設定的熱鍵或按鈕可以切到原本使用的分頁 (上面的例子就是可以從3直接跳到1)

Firefox 網址列搜尋 Location Bar search

http://kb.mozillazine.org/Location_Bar_Search 習慣上會開很多Tab放著,在切換時會很難記得也不方便切換過去 發現可以用搜尋的 ex: 在位址列打入 % youtube 就可以找到開啟的youtube tab (%後面要空一格) 其他更詳細的搜尋方法在來源網址有寫

Firefox 設定調整 about:config

http://kb.mozillazine.org/Category:Preferences 讓 Firefox 連線數變多 (然後加快速度) ( from gslin blog) network.http.max-persistent-connections-per-server   改成10 (和Chrome一樣) browser.urlbar.decodeURLsOnCopy 讓網址複製後可以保留文字,不用% escape 其他調過的東西忘了...

我安裝的 Firefox extensions

多數在其他瀏覽器應該也有 (因為webextension容易移植) 裝越多會消耗越多資源,不常使用的可以安裝後關掉 (disable) uBlock Origin 有名的擋廣告,優點是記憶體用量比較小 必備,安裝後可減少Firefox使用的資源量,加快網頁載入 Update Scanner 檢查網頁有無更新 Rotate and Zoom Image 旋轉,放大圖片 Video DownloadHelper 下載影片用,youtube等各平台 Open Multiple URLs 想一次開多個網頁? ex: 文字檔紀錄遊戲相關網頁一次全開 Country Flag + 看網站是在哪個國家 Tab Reloader ClearURLs 強化隱私,清除網址追蹤 (ex: google...etc) Search by Image 找圖片來源,可設定用多個網站 修正google search的連結 https://addons.mozilla.org/firefox/addon/google-search-link-fix YouTube High Definition YouTube背景播放 (Android限定) 死掉的extension ,還沒等到新版 Tab Mix 我寫的extension Youtube audio_only youtube只收聲音/只播放聲音 https://craftwarblog.blogspot.com/2017/11/firefoxchrome-extension-youtube.html Android也支援(建議安裝背景播放,85還不給裝,要等firefox開放安裝,不想等就用nightly版) Last Used Tab 回到上一個使用的tab https://craftwarblog.blogspot.com/2020/10/firefox-return-to-the-last-used-tab.html

How to get Twitter gif source?

圖片
Someone asks me how to get Twitter gif source. Take this for example https://twitter.com/paint002/status/916984184035360768 I use Firefox, press F12 to open tools below web page. 1. click there to start picking an element 2. click on gif to pick it 3. find source in src attribute (It is a .mp4 video in this example) Another method install this userscript, you can open original pictures (not embedded in web page) https://greasyfork.org/en/scripts/15271-extract-images-for-twitter

瀏覽器的選擇 Firefox or Chrome?

圖片
My preference: Firefox > Edge > Chrome Chrome is faster but consumes more memory. (1+ process per tab) Firefox concerns your privacy, Chrome wants your privacy for advertising. https://www.mozilla.org/en-US/firefox/all/#product-desktop-release Firefox is a bit slower than chrome but less memory usage. Chrome creates one process for every tab. Every extension uses more memory in Chrome than Firefox. https://craftwarblog.blogspot.com/2017/11/firefoxchrome-extension-youtube.html uses 23xxK in Chrome, 4xxK in Firefox. Firefox Quantum (Firefox 57 later) is getting faster and better responsive. Firefox is closing the gap to Chrome speed. You should try it if you don't have enough memory. You should use Firefox if you are lolicon.

Android Firefox Extension debug

https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Developing_WebExtensions_for_Firefox_for_Android https://developer.mozilla.org/en-US/docs/Tools/Remote_Debugging/Debugging_Firefox_for_Android_over_Wifi wifi的場合好像一定要裝他講的那個app,原先已裝QR Droid無效,wifi debug還是不能開? adb的用法 adb tcpip 5555 adb connect device_ip_address $ adb devices List of devices attached device_ip_address:5555 device adb kill-server  (reset and start from adb connect) 好像有奇怪的bug,玩一玩就連不上android了 (WebIDE shift+F8) 也許用usb比較好

使用者腳本 UserScript (user.js) install 安裝紀錄

關於userscript的介紹和安裝法,可以直接看greasyfork,有多國語言 https://greasyfork.org 基本上userscript manager主要功能都是相同的,只要沒bug應該都能跑 我寫的userscripts https://github.com/craftwar/userscript https://greasyfork.org/users/166015-craftwar 下面懶得更新了 userscript manager (you need install this first before you can install userscript) Greasemonkey http://www.greasespot.net/ Violentmonkey (I use this one) https://violentmonkey.github.io/ Tampermonkey http://tampermonkey.net/ After userscript manager is installed, you can install userscript in different ways. Click install from userscript publish site Ex: https://greasyfork.org , https://openuserjs.org Drag user.js into browser Click Add new script and paste userscript into manager 2017/11/30的狀況 Greasemonkey太陽春不實用 Tampermonkey source code的license不是開放的,不想用 Violentmonkey open source功能看起來也不錯,更新很勤 使用者腳本(userscript)的效能會比直接寫成extension差一點 (可忽略,原因是必需重複檢查權限) 是用eval執行,不是像extension直接inject js進去,debug比較麻煩 沒有extension的background script可以用,每個頁面都要開一個 優點是開發者維護更新上...

Firefox/Chrome extension: Youtube audio_only 只放聲音(supoort NightBot)

圖片
Firefox Chrome (2018/01/25 11-12的發票中了 200,兌現承諾上傳Chrome) Edge不會有,除非有人要donate我買開發者帳號 (想用得自己用開發者功能裝) github https://github.com/craftwar/youtube-audio 讓youtube只接收音樂的部份,沒影片省流量省資源省電 (save resource, cpu, gpu and battery) 點歌功能只要是從youtube放的都適用  (ex: NightBot的autoDJ) 用法很簡單,點圖示切換狀態,黑白為關閉狀態 我是用多個瀏覽器,一個固定打開,只想放音樂時用那個開 配合autoplay無限放當電台用? 如果不需用youtube的autoplay,可以用foobar2000播 需要裝這個component https://fy.3dyd.com/ (不是我寫的,也沒opensource,風險自行負責) 贊助連結 https://payment.allpay.com.tw/Broadcaster/Donate/83D029B697E779BF68E3243D8830CB97 基於 Youtube audio 改寫的 Firefox版的也是改別人的(而且只改文字描述部分),放上源頭 https://github.com/Ashish-Bansal/audio-only-youtube 本來只是想加nightbot支援,後來發現code太濫,忍不住就重寫了 改寫太多,變成我的code比較多,乾脆發佈成自己的作品了 順便做些個人偏好的調整 完全是根據原作品改寫,所以我很多東西不知道 和原版程式碼相比,減少一半行數 Edge支援 M$的開發者帳號更貴阿要$19 (本來想發edge的好貴就算了,兩張發票都買不起) about:flags 中打開也能load https://docs.microsoft.com/en-us/microsoft-edge/extensions/guides/adding-and-removing-extensions ==== dev note 簡單講原理就是youtube裡面本來就有audio on...