1、axios在PC端瀏覽器的兼容性問題
axios支持IE8+,但原理是基於promise之上實現的,因此會存在不兼容IE的問題。
trident內核的瀏覽器下會報:vuex requires a Promise polyfill in this browser
解決方案:
(1)、首先安裝 babel-polyfill
,來解決IE不支持 promise
對象的問題
npm install babel-polyfill -s
(2)、安裝成功以后需要在 main.js
中引入 babel-polyfill
import 'babel-polyfill'
一般會配置 webpack.base.config.js
中 entry
module.exports = { context: path.resolve(__dirname, '../'), entry: { app: ["babel-polyfill", "./src/main.js"] // app: './src/main.js' }, }
2、axios在安卓低版本兼容性處理
在較低版本的安卓手機中發現發現封裝的axios請求無效,主要原因還是低版本的安卓手機無法使用promise
注意:安卓4.3以下的手機不支持axios的使用,無法使用promise,加上 polyfill就可以了。
解決方案: (1)、項目中安裝 es6-promise
npm install es6-promise -s
(2)、引入 es6-promise
import promise from 'es6-promise'
(3)、注冊 es6-promise
(一定要在axios之前注冊)
// 注意: es6-promise 一定要在 axios 請求 之前注冊 promise.polyfill() 或者 require('es6-promise').polyfill();
Browser(瀏覽器) cdn方式引入qs庫的使用方法
Browser cdn方式引入qs庫使用
普通html頁面使用axios post提價數據需要處理提交的數據,一般用到qs庫
今天剛好用到,記錄下來
<script src="https://cdn.bootcss.com/qs/6.7.0/qs.min.js"></script>
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
<html>
<body>
<div>
</div>
<script>
// 一般引入qs庫都賦值為qs,不過瀏覽器全局引入的是 window.Qs對象,
// 所以直接用 qs.stringify() 會報 qs undefined
var qs = Qs
// 配置post的請求頭
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'
// qs.stringify() 這里可以做一下封裝
axios.post('url', qs.stringify({
id: 1,
name: 'zhangsan'
})).then(function(res) {
// 返回 Promise對象數據
})
</script>
</body>
</html>