[Javascript]淺談HTML IFrame 以及說明如何保護自己的網頁被他網隨意嵌入

HTML 裡的 IFrame 是什麼?
簡單的說
當我們在設計網頁的時候
我們可以用IFrame 這個語法來嵌入其他指定的網頁

比如說:
如果我想要在網頁上呈現某個 Yotube 影片
我可以這樣做

src="https://www.youtube.com/embed/XGSy3_Czz8k">

</iframe>

結果如下:

從上面的範例可以知道

IFrame 是個非常簡單好用的技術

但問題是,

由於任何人都能使用這個技術去嵌入網頁

如果你不希望有朝一日自己的網頁被IFrame到別人的網站上時

在你的網頁上加底下的語法就可以簡單避免

<script>

    if (document.referrer.indexOf(document.location.hostname) == -1) {

        alert("Access Violation");

    }

    else{

         // Do Something

    }

</script>

假設我們的網站是架設在 Http://abc.com.tw

當別人在她的網頁上(假如 Http://badman.com.hk) Iframe我們的網頁時

document.location.hostname 會得到 abc.com.tw

document.referrer 會得到Http://badman.com.hk

所以我們可以透過比較

referrer 跟 location.hostname 來決定上一層的網頁值不值的被信任

以上面語法來說

如果上一層網頁有相同的domain name, Iframe 才會有作用

反之, 就會跳出訊息警告

留言

這個網誌中的熱門文章

[解決方法] docker: permission denied

前言當我們執行docker 指令時若出現以下錯誤訊息 docker: Got permission denied while trying to connect to the Docker daemon socket at unix:///var/run/docker.sock: Post http://%2Fvar%2Frun%2Fdocker.sock/v1.26/containers/create: dial unix /var/run/docker.sock: connect: permission denied. See 'docker run --help'. 表示目前的使用者身分沒有權限去存取docker engine, 因為docker的服務基本上都是以root的身分在執行的, 所以在指令前加sudo就能成功執行指令但每次實行docker指令(就連docker ps)都還要加sudo實在有點麻煩, 正確的解法是我們可以把目前使用者加到docker群組裡面, 當docker service 起來時, 會以這個群組的成員來初始化相關服務 sudo groupadd docker sudo usermod -aG docker $USER 需要退出重新登錄後才會生效 Workaround 因為問題是出在權限不足, 如果以上方法都不管用的話, 可以手動修改權限來解決這個問題 sudo chmod 777 /var/run/docker.sock https://docs.docker.com/install/linux/linux-postinstall/

閱讀完整內容

[C#] Visual Studio, 如何在10分鐘內快速更改命名專案名稱

前言: 由於工作需要, 而且懶得再重寫類似的專案, 所以常常將之前寫的專案複製一份加料後, 再重新命名編譯假設今天我有一個專案HolyUWP, 我想把它重新命名成 BestUWP 時該怎麼做? 以下是幾個簡單的的步驟使用Visual Studio 2017 備份原來專案更改Solution名稱更改Assembly name, Default namespce 更改每支程式碼的Namespace 更改專案資料夾名稱備份原來專案由於怕改壞掉, 所以在改之前先備份更改Solution名稱更改sln的名稱, 這邊我改成BestUWP.sln 使用Visual Studio打開你的.sln, 右鍵點擊Solution後選擇Rename, 這邊我把它重新命名成BestUWP(跟檔案名稱一致) 必要的話可以順便修改Porject名稱更改Assembly name, Default namespce 進入 Project > OOXX Properties 修改Assembly Name, Default namesapce 更改每支程式碼的Namespace 基本上隨便挑一支有用到預設Namesapce(HolyUWP)的程式碼來改就好了重新命名後點擊Apply, 這個動作做完後所有用到舊Namespace的程式碼都會被改成新的更改專案資料夾名稱以上動作做完後, 基本上就可以把專案編譯出來測看看了~

閱讀完整內容

[解決方法] mac 作業系統上無法使用 docker

錯誤訊息 Cannot connect to the Docker daemon at unix:///var/run/docker.sock. Is the docker daemon running? 原因因為 docker 的設計是走 client-server 的架構, 如果少裝了 server 的部分就會出現以上的錯誤訊息解決方法因為 docker daemon 需要使用 linux kernel 上的某些功能, 所以若想要在 mac 的 OS X 上使用 docker 必須額外起一台 linux VM 給 docker daemon 用 Step 1. 安裝 virtual box $ brew install virtualbox --cask Step 2. 安裝 docker machine $ brew install docker-machine --cask Step 3. 設定使用 docker-machine 建立 VM 跑容器 $docker-machine create --driver virtualbox default $docker-machine restart 輸出環境變數 $docker-machine env default 如果執行以上的指令出現錯誤訊息 Error checking TLS connection: ... 可以執行以下指令重新產生憑證 $docker-machine regenerate-certs 最後套用環境變數, 讓 docker 知道要怎麼去跟這台 VM 溝通 $eval $(docker-machine env default) 測試若做完以上的步驟沒噴錯誤訊息的話, 可以跑個 hello-world 看看 docker daemon 有沒有起來 $docker run hello-world Unable to find image 'hello-world:latest' locally latest: Pulling from library/hello-world 0e03bdcc26d7: Pull complete Digest: sha256:95ddb6c31407e84e91a986b004aee40975cb0

閱讀完整內容

黑皮考町

搜尋此網誌