2021年3月24日 星期三

Access-Control-Allow-Origin

跨來源資源共用(CORS)

Mozilla 這邊文章寫得很詳細
簡單講當 User 去連 A 站,裡面的 AJAX 動作去 call B 站的資料,B 站就必需在 HTTP header 裡加入 Access-Control-Allow-Origin: *
使用完整 Source 路徑會更好,例如 Access-Control-Allow-Origin: https://blog.pank.org
Access-Control-Allow-Methods: 預設有 GET, HEAD, POST
所以在大部份的情況都不需要加

加入 Access-Control-Allow-Origin: * 大至上有兩個方法,從後端程式或 Web Server 端

後端程式,以 PHP 為例:
header('Access-Control-Allow-Origin: *');

Web Server 端,以 Apache 為例:
Header set Access-Control-Allow-Origin *
(也可以加在 .htaccess)

以 nginx 為例:
add_header 'Access-Control-Allow-Origin' '*'

沒有留言:

data URI

data URI 可以將影像,檔案等以 base64 編碼內嵌至網頁內,可以減少瀏覽器發出 Request 的次數 data URI 的表達式如下: data:[<mediatype>][;base64],<data> img 使用 data URI ...