說明
PC掃碼登陸,手機掃碼成功點擊確定後,PC端沒動靜~~
重複多次後,胖胖仔細一看右上角。。重定向被禁止了!!!
由於二維碼是iframe內嵌到頁面中
<iframe style={{border:0,width:"100%",height:430,}} src={this.state.url} />
到這裏就有必要提一嘴iframe中的sandbox屬性,重點來了!
sandbox屬性
如果被規定爲空字符串(sandbox=""),sandbox 屬性將會啓用一系列對行內框架中內容的額外限制。
sandbox 屬性的值既可以是一個空字符串(應用所有的限制),也可以是空格分隔的預定義值列表(將移除特定的限制)。
sandbox有很多屬性,目前已經研究的屬性有:""、 allow-same-origin、allow-top-navigation、 allow-forms、allow-scripts,接下來分別說下每個屬性的作用。
- sandbox=""
表示應用allow-same-origin、allow-top-navigation、 allow-forms、allow-scripts等限制。 - sandbox="allow-scripts"
允許執行script腳本。 - sandbox="allow-forms"
允許提交表單。 - sandbox="allow-top-navigation"
允許 iframe 內容從包含文檔導航(加載)內容。 - sandbox="allow-same-origin"
允許 iframe 內容被視爲與包含文檔有相同的來源。
解決方案及思路
在iframe標籤中給sandbox設置allow-scripts以及allow-top-navigation屬性
<iframe sandbox="allow-scripts allow-top-navigation" style={{border:0,width:"100%",height:430,}} src={this.state.url} />
OK!問題圓滿解決!希望可以幫到看到此文的你(▽)。我是胖胖,不瘦回150斤不改名字的男人!!!