瀏覽器的 console log 幾種不同呈現方式

瀏覽器在 Debug 常常使用 console.log(),除了 console.log 外,還有沒有更多的參數可以使用呢?

  • console.log():標準的文字
  • console.error():出現紅字錯誤文字 和 錯誤的 X
  • console.warn():出現黃色警告文字 和 警告的 !
  • console.table():可於 console 出現表格
  • 客製化 console.log:(前景綠字、背景黃色、24px 字體大小)
    (() => {
        console.log('%c%s', 'color: green; background: yellow; font-size: 24px;','Success!')
    })();

詳見此篇:Better console.logs

Google 決定於 2022年6月停止 Chrome Apps 支援

Google 於 Chrome 提供 Apps (主要 Chroms OS 主要都是以 Chrome Apps 為主),但是使用量太低,於是被 Google 決定要關閉。

從 2020/3 就停止接受新的 Chrome Apps,2020/6 就對 Windows、Mac、Linux 停止支援 Chrome Apps,2022/6 連 ChromeOS Apps 都關閉。

閱讀全文〈Google 決定於 2022年6月停止 Chrome Apps 支援〉

PHP Cookie SameSite 的設定方式

Chrome 80 之後的版本,預設的 Cookie 設定將會無法跨站存取 Cookie 值,若想要允許 Cookie 跨網站存取的話(SameSite = None),需要使用 HTTPS 才可以。

  • 註:SameSite 用來阻止瀏覽器將 Cookies 跨網站發送 (prevents the browser from sending this cookie along with cross-site requests)

閱讀全文〈PHP Cookie SameSite 的設定方式〉

微軟新版 Edge 會偽裝成其它瀏覽器 - 2019

瀏覽器都會帶 User Agent 來跟 Server 說自己是誰,Server 的程式端才能給正確的資料、格式、畫面。

但是微軟新版的 Edge 會隨著 Domain 不同,會修改自己的 User Agent 來偽裝成其它瀏覽器~

閱讀全文〈微軟新版 Edge 會偽裝成其它瀏覽器 - 2019〉

Googlebot 將使用新版 Chromium 引擎來執行 JavaScript

Googlebot 以前都使用 Chrome 41.0 的引擎來 Rendering (解析) JavaScript,預計要更新成 Chromium 最新的版本 (74.0+)。

由 access.log 可以看到下述:

"Mozilla/5.0 (Linux; Android 6.0.1; Nexus 5X Build/MMB29P) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.96 Mobile Safari/537.36 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)"

不過,雖然宣佈了,目前暫時還沒看到新版的 Bot 來的跡象~

閱讀全文〈Googlebot 將使用新版 Chromium 引擎來執行 JavaScript〉

瀏覽器 如何列出網頁 非 https 的內容

現在使用 Firefox、Chrome 等瀏覽器,https 的頁面都會顯示綠色標章,而 https 網頁裡面有包含 http 的內容,就會顯示不安全等等的訊息(註1),要怎麼找出是哪些內容不安全呢?

簡單說,就是如何找出目前 https 的網頁,哪些內容(網址)還是 http 的。(註2)

閱讀全文〈瀏覽器 如何列出網頁 非 https 的內容〉

微軟新版的 Windows 10 將使用 Chromium 取代 Edge 的核心

實做瀏覽器的核心很辛苦,太多瀏覽器的核心又會造成前端工程師的困擾,瀏覽器太多版本實在不是好事,不過太少造成獨占也不太好就是了~

  • 註:不過,瀏覽器少對 前端工程師 與 QA 來說,應該都算是好事~

閱讀全文〈微軟新版的 Windows 10 將使用 Chromium 取代 Edge 的核心〉

蘋果、微軟等 四大瀏覽器業者 將在2020年停止支援 TLS 1.0、1.1

蘋果 (Safari)、微軟 (IE、Edge)、Google (Chrome)、Mozilla (Firefox) 為目前主流瀏覽器的四大業者,他們共同宣佈將於 2020年中止支援 TLS 1.0TLS 1.1,建議採用 TLS 1.2 以後的版本。

閱讀全文〈蘋果、微軟等 四大瀏覽器業者 將在2020年停止支援 TLS 1.0、1.1〉

網頁於 Chrome 不要出現(關閉) Translate 的訊息

於 Chrome 開啟網頁,常常會下拉是不是需要翻譯(Translate) 的區塊視窗,自己的網頁希望不要跳出這個區塊,要怎麼做呢?

閱讀全文〈網頁於 Chrome 不要出現(關閉) Translate 的訊息〉

瀏覽器的 Cookie 容量限制

瀏覽器的 Cookie 是做登入、紀錄、追蹤等等,最常使用的工具。

不過現在 Cookie 要放的東西越來越多,Cookie 到底可以塞的容量是多少呢?

  • 註1:照標準應該是 4096 bytes,不過瀏覽器實作時,都可能會有些落差~
  • 註2:下述取自此篇:RFC-2965 HTTP State Management Mechanism
    • Practical user agent implementations have limits on the number and size of cookies that they can store.
      • at least 300 cookies
      • at least 4096 bytes per cookie (as measured by the characters that comprise the cookie non-terminal in the syntax description of the Set-Cookie2 header, and as received in the Set-Cookie2 header)
      • at least 20 cookies per unique host or domain name

閱讀全文〈瀏覽器的 Cookie 容量限制〉