switch requst form robe-ajax to axios

README.md

@@ -114,7 +114,7 @@ npm run lint
 -   如需重写antd样式配置，请修改`src/theme.js`
 -   项目配置文件在`src/utils/config.js`
 -   如需重写异步请求函数，请修改`src/utils/request.js`
-    （关于为什么使用robe-ajax而不是fetch：在一个无服务器的环境中模拟数据请求，[Mock](https://github.com/nuysoft/Mock)不能拦截Fetch，只能拦截XHR，所以我选了一个类似jquery Ajax的库robe-ajax）
+    （关于为什么使用axios而不是fetch：在一个无服务器的环境中模拟数据请求，[Mock](https://github.com/nuysoft/Mock)不能拦截Fetch）
 
 ## 参考
 

mock/app.js

@@ -14,7 +14,7 @@ let dataKey = mockStorge('AdminUsers', [
 
 module.exports = {
   'POST /api/login' (req, res) {
-    const userItem = req.body
+    const userItem = JSON.parse(req.body)
     const response = {
       success: false,
       message: '',

mock/users.js

@@ -59,7 +59,7 @@ module.exports = {
   },
 
   'POST /api/users' (req, res) {
-    const newData = req.body
+    const newData = JSON.parse(req.body)
     newData.createTime = Mock.mock('@now')
     newData.avatar = Mock.Random.image('100x100', Mock.Random.color(), '#757575', 'png', newData.nickName.substr(0, 1))
 
@@ -75,7 +75,7 @@ module.exports = {
   },
 
   'DELETE /api/users' (req, res) {
-    const deleteItem = req.body
+    const deleteItem = JSON.parse(req.body)
 
     usersListData.data = usersListData.data.filter((item) => {
       if (item.id === deleteItem.id) {
@@ -92,7 +92,7 @@ module.exports = {
   },
 
   'PUT /api/users' (req, res) {
-    const editItem = req.body
+    const editItem = JSON.parse(req.body)
 
     editItem.createTime = Mock.mock('@now')
     editItem.avatar = Mock.Random.image('100x100', Mock.Random.color(), '#757575', 'png', editItem.nickName.substr(0, 1))

package.json

@@ -21,6 +21,7 @@
   },
   "devDependencies": {
     "atool-build": "^0.7.6",
+    "axios": "^0.15.3",
     "babel-eslint": "^6.0.4",
     "babel-plugin-dev-expression": "^0.2.1",
     "babel-plugin-dva-hmr": "^0.1.0",
@@ -43,7 +44,6 @@
     "mockjs": "^1.0.1-beta3",
     "rc-tween-one": "^1.0.0",
     "redbox-react": "^1.2.10",
-    "robe-ajax": "^1.0.0",
     "watchjs": "^0.0.0"
   },
   "pre-commit": [

proxy.config.js

@@ -1,7 +1,7 @@
 const mock = {}
 
 require('fs').readdirSync(require('path').join(`${__dirname}/mock`)).forEach((file) => {
-  Object.assign(mock, require('./mock/' + file))
+  Object.assign(mock, require(`./mock/${file}`))
 })
 
 module.exports = mock

src/services/app.js

@@ -1,21 +1,24 @@
 import { request } from '../utils'
 
 export async function login (params) {
-  return request('/api/login', {
+  return request({
+    url: '/api/login',
     method: 'post',
     data: params,
   })
 }
 
 export async function logout (params) {
-  return request('/api/logout', {
+  return request({
+    url: '/api/logout',
     method: 'post',
     data: params,
   })
 }
 
 export async function userInfo (params) {
-  return request('/api/userInfo', {
+  return request({
+    url: '/api/userInfo',
     method: 'get',
     data: params,
   })

src/services/dashboard.js

@@ -1,23 +1,22 @@
 import { request } from '../utils'
 
 export async function myCity (params) {
-  return request('http://www.zuimeitianqi.com/zuimei/myCity', {
-    method: 'get',
-    cross: true,
+  return request({
+    url: 'http://www.zuimeitianqi.com/zuimei/myCity',
     data: params,
   })
 }
 
 export async function queryWeather (params) {
-  return request('http://www.zuimeitianqi.com/zuimei/queryWeather', {
-    method: 'get',
-    cross: true,
+  return request({
+    url: 'http://www.zuimeitianqi.com/zuimei/queryWeather',
     data: params,
   })
 }
 
 export async function query (params) {
-  return request('/api/dashboard', {
+  return request({
+    url: '/api/dashboard',
     method: 'get',
     data: params,
   })

src/services/users.js

@@ -1,28 +1,32 @@
 import { request } from '../utils'
 
 export async function query (params) {
-  return request('/api/users', {
+  return request({
+    url: '/api/users',
     method: 'get',
     data: params,
   })
 }
 
 export async function create (params) {
-  return request('/api/users', {
+  return request({
+    url: '/api/users',
     method: 'post',
     data: params,
   })
 }
 
 export async function remove (params) {
-  return request('/api/users', {
+  return request({
+    url: '/api/users',
     method: 'delete',
     data: params,
   })
 }
 
 export async function update (params) {
-  return request('/api/users', {
+  return request({
+    url: '/api/users',
     method: 'put',
     data: params,
   })

src/utils/mock.js

@@ -24,7 +24,7 @@ for (let i in mockData) {
             if (options.url.split('?')[1]) {
               options.query = serialize(options.url.split('?')[1])
             } else {
-              options.query = options.body ? serialize(options.body) : {}
+              options.query = options.body ? JSON.parse(options.body) : {}
             }
           }
           let res = {}

src/utils/request.js

@@ -1,20 +1,12 @@
-import Ajax from 'robe-ajax'
+import axios from 'axios'
+import qs from 'qs'
 
-export default function request (url, options) {
-  if (options.cross) {
-    return Ajax.getJSON('http://query.yahooapis.com/v1/public/yql', {
-      q: `select * from json where url='${url}?${Ajax.param(options.data)}'`,
-      format: 'json',
-    })
+export default function request (options) {
+  if (options.url.indexOf('//') > -1 && window.location.origin !== `${options.url.split('//')[0]}//${options.url.split('//')[1].split('/')[0]}`) {
+    options.url = `http://query.yahooapis.com/v1/public/yql?q=select * from json where url='${options.url}?${qs.stringify(options.data)}'&format=json`
+    delete options.data
   }
-  const { method = 'get' } = options
-  return Ajax.ajax({
-    url,
-    method,
-    data: options.data || {},
-    processData: method === 'get',
-    dataType: 'JSON',
-  }).done((data) => {
-    return data
+  return axios(options).then((result) => {
+    return result.data
   })
 }