Skip to content

Commit 5a1a0f2

Browse files
RexShengRexSheng
committed
1.2.0 release
1 parent 4f3998a commit 5a1a0f2

File tree

13 files changed

+675
-169
lines changed

13 files changed

+675
-169
lines changed

‎README.md

Lines changed: 21 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,14 @@
55
## Build Setup
66

77
``` bash
8-
# 页面直接引用（放在vue.js引用之后）
8+
# 调用方式一：页面直接引用（放在vue.js引用之后）
99
<script src="https://rexsheng.github.io/vue-http-rexsheng/latest/http.js"></script>
10+
#页面引用之后，就可以使用全局Vue.ajax.send(...)或者页面实例中使用this.$ajax.send(...)了
1011

11-
# npm安装
12+
# 调用方式二：npm安装
1213
npm install vue-http-rexsheng --save-dev
13-
14-
# config in entry file like 'src/main.js'
14+
# npm安装完后，在入口文件比如'src/main.js'中配置引用
1515
import http from 'vue-http-rexsheng';
16-
1716
Vue.use(http,{instanceName:"$ajax",mockInstanceName:"$mock",wsInstanceName:"$socket",
1817
resultFormat:function(d){
1918
return d.data;
@@ -23,9 +22,10 @@ Vue.use(http,{instanceName:"$ajax",mockInstanceName:"$mock",wsInstanceName:"$soc
2322
},errorFormat:function(d){
2423
return d.data;
2524
},defaultConfig:{}})
26-
#设置ajax全局请求过滤器，option参数为当前请求option
25+
26+
#设置ajax全局请求拦截器，option参数为当前请求option
2727
Vue.ajax.interceptors.setRequest(function(option,request){return option;})
28-
#设置ajax全局响应过滤器,option参数为全部响应对象
28+
#设置ajax全局响应拦截器,option参数为全部响应对象
2929
{
3030
data:data,//响应数据
3131
status:req.status,//响应状态码
@@ -35,10 +35,17 @@ Vue.ajax.interceptors.setRequest(function(option,request){return option;})
3535
request:req//当前请求
3636
}
3737
Vue.ajax.interceptors.setResponse(function(option,request){return option;})
38+
#1.2.0新增设置多个拦截器,使用addRequest或者addResponse,第二个参数为顺序数字，数字越小，优先级越高，默认为0
39+
Vue.ajax.interceptors.addRequest(function(option,request){return option;},2)
40+
Vue.ajax.interceptors.addResponse(function(option,request){return option;},2)
41+
#1.2.0新增别名请求get,post,put,delete,options,patch,head,例如：
42+
Vue.ajax.get(`String` url,`Object` data,`Function` successFn,`Function` errorFn,`Object` Scope)
3843
#设置ajax全局前缀路径
3944
Vue.ajax.config.baseUrl="http://localhost:8080"
4045
#设置ajax全局是否启用mockserver,默认`false`
4146
Vue.ajax.config.mockMode=false
47+
#1.2.0新增设置全局mock策略,默认`scope`：局部优先，`global`:全局配置优先，忽略局部配置
48+
Vue.ajax.config.mockStrategy="scope"
4249
#成功的status码
4350
Vue.ajax.config.successStatus=function(status){return status==200;}
4451
#mock缺失时的自定义处理
@@ -67,6 +74,8 @@ Vue.ajax.addMock(
6774
"@delete:/user/3":"../static/filedetail.json",
6875
}
6976
)
77+
#jsonp的回调函数key名称，http://xxx?callback=jsonp_123
78+
Vue.ajax.config.jsonp="callback"
7079
#全局配置发送socket未开启时数据延迟毫秒
7180
Vue.socket.config.reconnectTimeout=30
7281
#全局配置发送socket的url前缀路径
@@ -123,15 +132,16 @@ this.$ajax.send(option)
123132
|type |类型 |`get` `post` `delete` `put`|
124133
|url |请求地址 | 必填 |
125134
|baseUrl |请求地址的前缀 | `boolean` `string` 设置为`false`时，不使用全局配置url：Vue.ajax.config.baseUrl；设置为字符串时，优先级高于全局配置 |
126-
|~~async~~ |~~是否异步请求~~ | ~~默认`true`~~ |
135+
|~~async~~ |~~是否异步请求~~ （无效配置，请忽略） | ~~默认`true`~~ |
127136
|headers |请求headers对象 | 例如`{"Content-type":"application/json;charset=UTF-8"}` |
128137
|timeout |超时时间毫秒 | 毫秒数 |
129138
|withCredentials |跨域响应设置cookie |默认`false` |
130139
|data |请求发送的数据 |Object/Array |
131-
|dataType |表明要发送的数据格式 |默认`"json"` `"xml"` `"form"` `"formData"`(使用formdata表单发送数据，通常用于文件上传)|
140+
|dataType |表明要发送的数据格式 |默认`"json"` `"xml"` `"form"` `"formData"`(使用formdata表单发送数据，通常用于文件上传) `"jsonp"`|
132141
|responseType|返回的数据类型|默认`""` `"json"` `"blob"` `"text"` `"arraybuffer"` `"document"`
133142
|transform |自定义格式化请求前数据的函数 | 参数为当前配置的data数据<br/> 例如`function(data){return JSON.stringify(data);}` |
134143
|mock|mock模拟数据请求|`true(需调用Vue.ajax.addMock(url,function)来拦截本次请求)` `function(data){//模拟请求，参数data为option的data}` `String请求的json文件地址` `{url:'/newurl',type:'get',data:{},complete:function(){},success:function(d){},error:function(err){}}`|
144+
|mockMode|严格使用指定的mock模式，不遵循全局配置策略或者局部配置策略1.2.0新增|`boolean` |
135145
|success|请求成功的回调|`function(data,req){}` |
136146
|error|请求失败的回调|`function(err,req){}` |
137147
|complete|请求完成的回调|`function(){}` |
@@ -141,6 +151,8 @@ this.$ajax.send(option)
141151
|onprogress |进度事件 |`function(d){}` |
142152
|onloadend |请求结束事件 |`function(d){}` |
143153
|cancel |取消请求函数，若要取消该请求时在函数内部调用cb()来执行取消 |`function(cb){if(someCondition){cb();}}` |
154+
|jsonp |jsonp使用的函数key |默认`callback` |
155+
|jsonpCallback |jsonp使用的函数名称 |默认`jsonp_{随机数}` |
144156
145157
#socket配置
146158
```javascript

‎latest/1.2.0/http.js

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎latest/1.2.0/http.js.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎latest/http.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎latest/index.html

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,8 @@
1919
}
2020
</style>
2121
<script src="./vue.js"></script>
22-
<script src="https://rexsheng.github.io/vue-http-rexsheng/latest/http.js"></script>
23-
22+
<!-- <script src="https://rexsheng.github.io/vue-http-rexsheng/latest/http.js"></script> -->
23+
<script src="./http.js"></script>
2424
</head>
2525

2626
<body>
@@ -67,23 +67,25 @@
6767
changeItems: function() {
6868
console.log(this.$ajax)
6969
Vue.ajax.send({
70-
url:"http://49.4.68.94:9030/web/prod/prodYard/LKCOMPANY000001",
70+
url:"http://1.3.149.81:9030/web/prod/prodYard/LKCOMPANY000001",
7171
success:function(d){
7272
console.log(d)
7373
},
7474
error:function(e){
7575
console.warn(e)
7676
},
77-
})
78-
this.$ajax.send({
79-
url:"http://49.4.68.94:9030/web/prod/prodYard/LKCOMPANY000001",
80-
success:function(d){
81-
console.warn(d)
82-
},
83-
error:function(e){
84-
console.warn(e)
85-
},
86-
})
77+
})
78+
this.$ajax.get("http://1.3.149.81:9030/web/prod/prodYard/LKCOMPANY000001")
79+
.then(console.log).catch(console.error)
80+
// this.$ajax.send({
81+
// url:"http://1.3.149.81:9030/web/prod/prodYard/LKCOMPANY000001",
82+
// success:function(d){
83+
// console.warn(d)
84+
// },
85+
// error:function(e){
86+
// console.warn(e)
87+
// },
88+
// })
8789
}
8890
}
8991
});

‎package.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "vue-http-rexsheng",
33
"description": "A Vue.js plugin for providing http request",
4-
"version": "1.1.13",
4+
"version": "1.2.0",
55
"author": "Rex Sheng <shengxupeng@126.com>",
66
"license": "MIT",
77
"private": false,
@@ -14,11 +14,12 @@
1414
"vue",
1515
"vuejs",
1616
"ajax",
17-
"http",
17+
"jsonp",
1818
"socket",
1919
"websocket",
2020
"vue-ajax",
2121
"vue-http",
22+
"vue-jsonp",
2223
"vue-socket",
2324
"vue-websocket"
2425
],

‎src/App.vue

Lines changed: 53 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,9 @@
3737
<li>
3838
<button @click="mockProxy()">mock代理</button>
3939
</li>
40+
<li>
41+
<button @click="jsonp()">jsonp</button>
42+
</li>
4043
</ul>
4144
<ul>
4245
<li>
@@ -83,7 +86,7 @@ export default {
8386
};
8487
},
8588
mounted() {
86-
this.mock()
89+
// this.mock()
8790
var pageInstance=this.$socket.listen({
8891
url:"/websocket",
8992
onmessage:function(e){
@@ -198,19 +201,30 @@ export default {
198201
});
199202
},
200203
getData() {
204+
// this.$ajax
205+
// .send({
206+
// // url:"datacenter/userxw/getCenterData",
207+
// url:"http://1.3.149.81:9030/web/prod/prodYard/LKCOMPANY000001",
208+
// type: "get" ,
209+
// data:{dateFlag:"2018-08-11姓名",size:null,index:32},
210+
// headers:{Lang:"zh;"},
211+
// cancel:function(cb){
212+
// console.log(new Date())
213+
// setTimeout(()=>{
214+
// cb()
215+
// },4000)
216+
// }
217+
// })
218+
// .then(d => {
219+
// console.log("success1", d, this.msg);
220+
// })
221+
// .catch(d => {
222+
// console.log("error1", d);
223+
// });
224+
console.log(this.$ajax)
201225
this.$ajax
202-
.send({
203-
// url:"datacenter/userxw/getCenterData",
204-
url:"datacenter/userxw/getCenterData?",
205-
type: "get" ,
206-
data:{dateFlag:"2018-08-11姓名",size:null},
207-
cancel:function(cb){
208-
console.log(new Date())
209-
setTimeout(()=>{
210-
cb()
211-
},4000)
212-
}
213-
})
226+
.get("http://1.3.149.81:9030/web/prod/prodYard/LKCOMPANY000001",
227+
{dateFlag:"2018-08-11姓名",size:null,index:32})
214228
.then(d => {
215229
console.log("success1", d, this.msg);
216230
})
@@ -222,8 +236,9 @@ export default {
222236
Vue.ajax
223237
.send({
224238
url:
225-
"http://xconsole.rrslj.com/datacenter/userxw/getCenterData2?dateFlag=2018-08-10",
226-
type: "get"
239+
"http://xconsole.rrslj.com/datacenter/userxw/getCenterData?dateFlag=2018-08-10",
240+
type: "get",
241+
mockMode:false,
227242
})
228243
.then(d => {
229244
console.log("success2", d, this.msg);
@@ -271,7 +286,7 @@ export default {
271286
var self = this;
272287
Vue.ajax
273288
.send({
274-
url: Vue.ajax.prefix+"/api/upload",
289+
url: "/file/api/upload",
275290
type: "post",
276291
dataType: "formdata",
277292
headers: { Authorization: "Basic c2hlbmd4cDoxMjM=" },
@@ -302,7 +317,7 @@ export default {
302317
this.downloadPro=0;
303318
Vue.ajax
304319
.send({
305-
url: Vue.ajax.prefix+"/api/download?file={file}",
320+
url: "/file/api/download?file={file}",
306321
type: "get",
307322
dataType: "formdata",
308323
headers: { Authorization: "Basic c2hlbmd4cDoxMjM=" },
@@ -367,7 +382,7 @@ export default {
367382
mockGlobal:function(){
368383
Vue.ajax
369384
.send({
370-
url: "/test/mock0012",
385+
url: "/test/mock001",
371386
data: { keyword: "管理",arr:["生",'12f'] },
372387
type:"post",
373388
success:function(d){
@@ -419,6 +434,8 @@ export default {
419434
error:function(d,req){
420435
console.log("error mockGlobal", d,req);
421436
}
437+
}).then((d)=>{
438+
console.log("su",d,this.msg);
422439
})
423440
Vue.ajax
424441
.send({
@@ -436,7 +453,24 @@ export default {
436453
error:function(d,req){
437454
console.log("error mockGlobal", d,req);
438455
}
439-
})
456+
},this)
457+
},
458+
jsonp:function(){
459+
// https://www.runoob.com/try/ajax/jsonp.php?jsoncallback=callbackFunction
460+
//http://xconsole.rrslj.com/datacenter/userxw/getCenterData2?dateFlag=2018-08-10
461+
Vue.ajax
462+
.send({
463+
url: "https://www.runoob.com/try/ajax/jsonp.php",
464+
dataType:"jsonp",
465+
jsonp:"jsoncallback",
466+
jsonpCallback:"callbackFunctionC",
467+
success:function(d){
468+
console.log("success jsonp", d, this.msg);
469+
},
470+
error:function(d,req){
471+
console.log("error jsonp", d,req);
472+
}
473+
},this)
440474
}
441475
}
442476
};

‎src/config.js

Lines changed: 24 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,29 @@
11
import Vue from 'vue'
22
import ajax from './lib/index'
33
Vue.use(ajax)
4-
// Vue.ajax.interceptors.setResponse(d=>{
5-
// console.warn("response",d);
6-
// return Promise.resolve(d.data);
7-
// // return rlt;
8-
// })
9-
// Vue.ajax.interceptors.setRequest(d=>{
10-
// console.warn("request",d,this);
11-
// return d;
12-
// })
13-
Vue.ajax.prefix="http://192.168.8.72:8700";
4+
Vue.ajax.interceptors.setResponse(d=>{
5+
console.warn("response",new Date(),d);
6+
return Promise.resolve(d);
7+
})
8+
Vue.ajax.interceptors.addResponse(d=>{
9+
return new Promise(res=>{
10+
setTimeout(()=>{
11+
console.warn("response2",new Date(),d);
12+
res(d);
13+
},0)
14+
15+
})
16+
17+
},2)
18+
Vue.ajax.interceptors.setRequest(d=>{
19+
console.warn("request",d,this);
20+
return d;
21+
})
22+
Vue.ajax.interceptors.addRequest(d=>{
23+
console.warn("request2",d,this);
24+
return Promise.resolve(d);
25+
},2)
26+
// Vue.ajax.prefix="http://192.168.8.72:8700";
1427
Vue.ajax.config.baseUrl="";
1528
Vue.ajax.config.mockMode=true
1629
Vue.ajax.config.timeout=500000
@@ -33,7 +46,7 @@ Vue.ajax.addMock({
3346
"/test/mockfile":"../src/assets/data/01.json",
3447
"@get:/test/aaa":()=>{return {"dd":1};},
3548
"@post:/test/aaa":()=>{return {"dd":"post"};},
36-
"@post:/test/mock001":()=>{return {"001":"post"};},
49+
"@post:/test/mock001":()=>{return Promise.resolve({"001":"post"});},
3750
"@get:datacenter/userxw/getCenterData":(d)=>{return{"ol":"ok","param":d}},
3851
});
3952
// Vue.ajax.config.successStatus=function(d){return d>300};

0 commit comments

Comments
 (0)