什么問題
WEB開發過程中,很多時候我們都是寫一些簡單的Demo,并不是開發一個完整項目,此時我們常見的操作是:
•新建文件夾
•新建需要的文件
•在Sublime(或其他編輯器)中完成DEMO的編碼
•雙擊HTML文件,直接在瀏覽器中運行演示
如果此時Demo中有AJAX操作,瀏覽器就會報一個錯:
XMLHttpRequest cannot load file:///Users/iceStone/Documents/Learning/angular/demo/angular-moviecat/movie/view.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
原因很簡單,瀏覽器(Webkit內核)的安全策略決定了file協議訪問的應用無法使用XMLHttpRequest對象,錯誤消息中也很清楚的說明了:
Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
跨域請求僅支持協議:http, data, chrome, chrome-extension, https, chrome-extension-resource
在某些瀏覽器中是允許這種操作的,比如Firefox瀏覽器,也就是說Filefox支持file協議下的AJAX請求。
解決辦法
作為我個人最喜歡的Chrome,強大,沒什么好說的,只有想不到,幾乎沒有做不到,所以必須也得支持:
Windows:
•設置Chrome的快捷方式屬性,在“目標”后面加上–allow-file-access-from-files,注意前面有個空格,重新打開Chrome即可。
Mac:
•只能通過終端打開瀏覽器:打開終端,輸入下面命令:open -a “Google Chrome” –args –disable-web-security然后就可以屏蔽安全訪問了[ –args:此參數可有可無]
補充說明
長久來看,你肯定是需要通過HTTP的方式訪問你的應用,那就需要配置HTTP服務器軟件。但是對于一些剛入門的同學,配一個HTTP服務器(比如Apache、IIS等)比較繁瑣,望而卻步。
•對于使用IDE的同學沒什么好說的,每個用于Web開發的IDE都內置http服務器,不用單獨配置。
•對于喜歡輕量級編輯器的同學,比如Sublime Text,它默認是沒有內置HTTP服務器的
接下來推薦一款Sublime的插件Sublime Server,這個插件可以提供一個靜態文件HTTP服務器,具體使用方式如下:
•安裝Package Control(Sublime的插件管理工具),不會安裝自行Google
•Command+Shift+P或Ctrl+Shift+P打開命令面板,輸入Package Control: Install Package
•稍等片刻(此時會連接到插件提供商的服務器,比較慢,有可能背墻),搜索SublimeServer
•安裝完成過后通過Tool → SublimeServer → Start SublimeServer
新聞熱點
疑難解答
圖片精選