@deppon/deppon-request 2.2.1 → 2.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/README.md +268 -268
- package/es/composable.d.ts +28 -28
- package/es/composable.js +26 -26
- package/es/index.d.ts +4 -4
- package/es/request/adapterAjax.d.ts +1 -1
- package/es/request/cancel.d.ts +1 -1
- package/es/request/headers.d.ts +15 -15
- package/es/request/headers.js +17 -17
- package/es/request/index.d.ts +2 -2
- package/es/request/instance.d.ts +1 -1
- package/es/request/reqInterceptor.d.ts +2 -2
- package/es/request/request.d.ts +2 -2
- package/es/request/request.js +6 -6
- package/es/request/resInterceptor.d.ts +2 -2
- package/es/vue.d.ts +10 -10
- package/es/vue.js +3 -3
- package/package.json +4 -4
package/LICENSE
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2022 xingxing
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2022 xingxing
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,268 +1,268 @@
|
|
|
1
|
-
# `@deppon/deppon-request`
|
|
2
|
-
|
|
3
|
-
前端 http 请求封装包
|
|
4
|
-
|
|
5
|
-
## 安装
|
|
6
|
-
|
|
7
|
-
```bash
|
|
8
|
-
npm install @deppon/deppon-request
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
## 基础使用
|
|
12
|
-
|
|
13
|
-
### JavaScript/TypeScript 项目
|
|
14
|
-
|
|
15
|
-
```javascript
|
|
16
|
-
import request from '@deppon/deppon-request';
|
|
17
|
-
|
|
18
|
-
// 发送 GET 请求
|
|
19
|
-
request({
|
|
20
|
-
url: '/api/data',
|
|
21
|
-
method: 'get',
|
|
22
|
-
params: {
|
|
23
|
-
id: 1,
|
|
24
|
-
},
|
|
25
|
-
})
|
|
26
|
-
.then(res => {
|
|
27
|
-
console.log(res);
|
|
28
|
-
})
|
|
29
|
-
.catch(err => {
|
|
30
|
-
console.error(err);
|
|
31
|
-
});
|
|
32
|
-
|
|
33
|
-
// 发送 POST 请求
|
|
34
|
-
request({
|
|
35
|
-
url: '/api/data',
|
|
36
|
-
method: 'post',
|
|
37
|
-
data: {
|
|
38
|
-
name: 'test',
|
|
39
|
-
},
|
|
40
|
-
})
|
|
41
|
-
.then(res => {
|
|
42
|
-
console.log(res);
|
|
43
|
-
})
|
|
44
|
-
.catch(err => {
|
|
45
|
-
console.error(err);
|
|
46
|
-
});
|
|
47
|
-
```
|
|
48
|
-
|
|
49
|
-
## Vue 3 使用
|
|
50
|
-
|
|
51
|
-
### 1. 安装插件
|
|
52
|
-
|
|
53
|
-
在 Vue 应用中安装插件:
|
|
54
|
-
|
|
55
|
-
```javascript
|
|
56
|
-
import { createApp } from 'vue';
|
|
57
|
-
import { VuePlugin } from '@deppon/deppon-request';
|
|
58
|
-
|
|
59
|
-
const app = createApp(App);
|
|
60
|
-
|
|
61
|
-
// 安装插件
|
|
62
|
-
app.use(VuePlugin);
|
|
63
|
-
|
|
64
|
-
app.mount('#app');
|
|
65
|
-
```
|
|
66
|
-
|
|
67
|
-
### 2. 在 Composition API 中使用
|
|
68
|
-
|
|
69
|
-
```vue
|
|
70
|
-
<script setup>
|
|
71
|
-
import { useRequest } from '@deppon/deppon-request';
|
|
72
|
-
import { ref } from 'vue';
|
|
73
|
-
|
|
74
|
-
const request = useRequest();
|
|
75
|
-
const data = ref(null);
|
|
76
|
-
const loading = ref(false);
|
|
77
|
-
|
|
78
|
-
const fetchData = async () => {
|
|
79
|
-
loading.value = true;
|
|
80
|
-
try {
|
|
81
|
-
const res = await request({
|
|
82
|
-
url: '/api/data',
|
|
83
|
-
method: 'get',
|
|
84
|
-
params: {
|
|
85
|
-
id: 1,
|
|
86
|
-
},
|
|
87
|
-
});
|
|
88
|
-
data.value = res;
|
|
89
|
-
} catch (error) {
|
|
90
|
-
console.error(error);
|
|
91
|
-
} finally {
|
|
92
|
-
loading.value = false;
|
|
93
|
-
}
|
|
94
|
-
};
|
|
95
|
-
|
|
96
|
-
const submitData = async () => {
|
|
97
|
-
try {
|
|
98
|
-
const res = await request({
|
|
99
|
-
url: '/api/submit',
|
|
100
|
-
method: 'post',
|
|
101
|
-
data: {
|
|
102
|
-
name: 'test',
|
|
103
|
-
},
|
|
104
|
-
});
|
|
105
|
-
console.log(res);
|
|
106
|
-
} catch (error) {
|
|
107
|
-
console.error(error);
|
|
108
|
-
}
|
|
109
|
-
};
|
|
110
|
-
</script>
|
|
111
|
-
|
|
112
|
-
<template>
|
|
113
|
-
<div>
|
|
114
|
-
<button @click="fetchData" :disabled="loading">
|
|
115
|
-
{{ loading ? '加载中...' : '获取数据' }}
|
|
116
|
-
</button>
|
|
117
|
-
<button @click="submitData">提交数据</button>
|
|
118
|
-
</div>
|
|
119
|
-
</template>
|
|
120
|
-
```
|
|
121
|
-
|
|
122
|
-
### 3. 在 Options API 中使用
|
|
123
|
-
|
|
124
|
-
```vue
|
|
125
|
-
<script>
|
|
126
|
-
export default {
|
|
127
|
-
data() {
|
|
128
|
-
return {
|
|
129
|
-
loading: false,
|
|
130
|
-
data: null,
|
|
131
|
-
};
|
|
132
|
-
},
|
|
133
|
-
methods: {
|
|
134
|
-
async fetchData() {
|
|
135
|
-
this.loading = true;
|
|
136
|
-
try {
|
|
137
|
-
// 通过 this.$request 访问
|
|
138
|
-
const res = await this.$request({
|
|
139
|
-
url: '/api/data',
|
|
140
|
-
method: 'get',
|
|
141
|
-
params: {
|
|
142
|
-
id: 1,
|
|
143
|
-
},
|
|
144
|
-
});
|
|
145
|
-
this.data = res;
|
|
146
|
-
} catch (error) {
|
|
147
|
-
console.error(error);
|
|
148
|
-
} finally {
|
|
149
|
-
this.loading = false;
|
|
150
|
-
}
|
|
151
|
-
},
|
|
152
|
-
async submitData() {
|
|
153
|
-
try {
|
|
154
|
-
const res = await this.$request({
|
|
155
|
-
url: '/api/submit',
|
|
156
|
-
method: 'post',
|
|
157
|
-
data: {
|
|
158
|
-
name: 'test',
|
|
159
|
-
},
|
|
160
|
-
});
|
|
161
|
-
console.log(res);
|
|
162
|
-
} catch (error) {
|
|
163
|
-
console.error(error);
|
|
164
|
-
}
|
|
165
|
-
},
|
|
166
|
-
},
|
|
167
|
-
};
|
|
168
|
-
</script>
|
|
169
|
-
```
|
|
170
|
-
|
|
171
|
-
## API
|
|
172
|
-
|
|
173
|
-
### Composition API
|
|
174
|
-
|
|
175
|
-
- `useRequest()` - 获取 request 实例
|
|
176
|
-
|
|
177
|
-
### 请求方法
|
|
178
|
-
|
|
179
|
-
- `request(options)` - 发送 HTTP 请求
|
|
180
|
-
|
|
181
|
-
#### 请求参数
|
|
182
|
-
|
|
183
|
-
- `url` - 请求的地址(必填)
|
|
184
|
-
- `method` - 请求方法,默认为 `'get'`
|
|
185
|
-
- `data` - POST 请求的数据
|
|
186
|
-
- `params` - GET 请求的查询参数
|
|
187
|
-
- `headers` - 自定义请求头
|
|
188
|
-
- `once` - 控制接口只执行一次(可选)
|
|
189
|
-
|
|
190
|
-
#### 使用示例
|
|
191
|
-
|
|
192
|
-
```javascript
|
|
193
|
-
// GET 请求
|
|
194
|
-
request({
|
|
195
|
-
url: '/api/users',
|
|
196
|
-
method: 'get',
|
|
197
|
-
params: {
|
|
198
|
-
page: 1,
|
|
199
|
-
size: 10,
|
|
200
|
-
},
|
|
201
|
-
});
|
|
202
|
-
|
|
203
|
-
// POST 请求
|
|
204
|
-
request({
|
|
205
|
-
url: '/api/users',
|
|
206
|
-
method: 'post',
|
|
207
|
-
data: {
|
|
208
|
-
name: 'John',
|
|
209
|
-
age: 30,
|
|
210
|
-
},
|
|
211
|
-
});
|
|
212
|
-
|
|
213
|
-
// 只执行一次的请求
|
|
214
|
-
request({
|
|
215
|
-
url: '/api/submit',
|
|
216
|
-
method: 'post',
|
|
217
|
-
data: { name: 'test' },
|
|
218
|
-
once: true,
|
|
219
|
-
});
|
|
220
|
-
```
|
|
221
|
-
|
|
222
|
-
更多 API 请参考源码。
|
|
223
|
-
|
|
224
|
-
## Cookie 跨域处理
|
|
225
|
-
|
|
226
|
-
本包自动处理 Cookie 跨域设置,确保在跨域请求时能够正确携带 Cookie。
|
|
227
|
-
|
|
228
|
-
### 自动设置
|
|
229
|
-
|
|
230
|
-
1. **`withCredentials`**:默认设置为 `true`,允许跨域请求携带 Cookie
|
|
231
|
-
2. **`document.domain`**:自动调用 `@deppon/deppon-utils` 的 `setCookieDomain()` 方法设置:
|
|
232
|
-
|
|
233
|
-
- 如果 URL 包含 `deppontest.com`,自动设置 `document.domain = 'deppontest.com'`
|
|
234
|
-
- 如果 URL 包含 `deppon.com`,自动设置 `document.domain = 'deppon.com'`
|
|
235
|
-
|
|
236
|
-
注意:`setCookieDomain` 方法已从 `@deppon/deppon-utils` 导入,你也可以手动调用:
|
|
237
|
-
|
|
238
|
-
```javascript
|
|
239
|
-
import { setCookieDomain } from '@deppon/deppon-utils';
|
|
240
|
-
setCookieDomain();
|
|
241
|
-
```
|
|
242
|
-
|
|
243
|
-
### 使用场景
|
|
244
|
-
|
|
245
|
-
- 在 UAP 环境中,需要跨域请求时携带 Cookie(如登录凭证)
|
|
246
|
-
- 在子域名之间共享 Cookie
|
|
247
|
-
- 在 iframe 环境中进行跨域请求
|
|
248
|
-
|
|
249
|
-
### 注意事项
|
|
250
|
-
|
|
251
|
-
1. `document.domain` 只能在当前域或其父域上设置
|
|
252
|
-
- 例如:如果当前域是 `a.deppon.com`,可以设置为 `deppon.com`,但不能设置为其他域
|
|
253
|
-
2. 设置 `document.domain` 后,端口号会被忽略
|
|
254
|
-
3. 如果设置失败(例如跨域限制),会静默失败,不影响其他功能
|
|
255
|
-
4. `withCredentials` 需要服务端配合设置 `Access-Control-Allow-Credentials: true` 响应头
|
|
256
|
-
|
|
257
|
-
### 示例
|
|
258
|
-
|
|
259
|
-
```javascript
|
|
260
|
-
import request from '@deppon/deppon-request';
|
|
261
|
-
|
|
262
|
-
// 跨域请求会自动携带 Cookie
|
|
263
|
-
request({
|
|
264
|
-
url: 'https://api.deppon.com/user/info',
|
|
265
|
-
method: 'get',
|
|
266
|
-
// withCredentials: true 已自动设置
|
|
267
|
-
});
|
|
268
|
-
```
|
|
1
|
+
# `@deppon/deppon-request`
|
|
2
|
+
|
|
3
|
+
前端 http 请求封装包
|
|
4
|
+
|
|
5
|
+
## 安装
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @deppon/deppon-request
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## 基础使用
|
|
12
|
+
|
|
13
|
+
### JavaScript/TypeScript 项目
|
|
14
|
+
|
|
15
|
+
```javascript
|
|
16
|
+
import request from '@deppon/deppon-request';
|
|
17
|
+
|
|
18
|
+
// 发送 GET 请求
|
|
19
|
+
request({
|
|
20
|
+
url: '/api/data',
|
|
21
|
+
method: 'get',
|
|
22
|
+
params: {
|
|
23
|
+
id: 1,
|
|
24
|
+
},
|
|
25
|
+
})
|
|
26
|
+
.then(res => {
|
|
27
|
+
console.log(res);
|
|
28
|
+
})
|
|
29
|
+
.catch(err => {
|
|
30
|
+
console.error(err);
|
|
31
|
+
});
|
|
32
|
+
|
|
33
|
+
// 发送 POST 请求
|
|
34
|
+
request({
|
|
35
|
+
url: '/api/data',
|
|
36
|
+
method: 'post',
|
|
37
|
+
data: {
|
|
38
|
+
name: 'test',
|
|
39
|
+
},
|
|
40
|
+
})
|
|
41
|
+
.then(res => {
|
|
42
|
+
console.log(res);
|
|
43
|
+
})
|
|
44
|
+
.catch(err => {
|
|
45
|
+
console.error(err);
|
|
46
|
+
});
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
## Vue 3 使用
|
|
50
|
+
|
|
51
|
+
### 1. 安装插件
|
|
52
|
+
|
|
53
|
+
在 Vue 应用中安装插件:
|
|
54
|
+
|
|
55
|
+
```javascript
|
|
56
|
+
import { createApp } from 'vue';
|
|
57
|
+
import { VuePlugin } from '@deppon/deppon-request';
|
|
58
|
+
|
|
59
|
+
const app = createApp(App);
|
|
60
|
+
|
|
61
|
+
// 安装插件
|
|
62
|
+
app.use(VuePlugin);
|
|
63
|
+
|
|
64
|
+
app.mount('#app');
|
|
65
|
+
```
|
|
66
|
+
|
|
67
|
+
### 2. 在 Composition API 中使用
|
|
68
|
+
|
|
69
|
+
```vue
|
|
70
|
+
<script setup>
|
|
71
|
+
import { useRequest } from '@deppon/deppon-request';
|
|
72
|
+
import { ref } from 'vue';
|
|
73
|
+
|
|
74
|
+
const request = useRequest();
|
|
75
|
+
const data = ref(null);
|
|
76
|
+
const loading = ref(false);
|
|
77
|
+
|
|
78
|
+
const fetchData = async () => {
|
|
79
|
+
loading.value = true;
|
|
80
|
+
try {
|
|
81
|
+
const res = await request({
|
|
82
|
+
url: '/api/data',
|
|
83
|
+
method: 'get',
|
|
84
|
+
params: {
|
|
85
|
+
id: 1,
|
|
86
|
+
},
|
|
87
|
+
});
|
|
88
|
+
data.value = res;
|
|
89
|
+
} catch (error) {
|
|
90
|
+
console.error(error);
|
|
91
|
+
} finally {
|
|
92
|
+
loading.value = false;
|
|
93
|
+
}
|
|
94
|
+
};
|
|
95
|
+
|
|
96
|
+
const submitData = async () => {
|
|
97
|
+
try {
|
|
98
|
+
const res = await request({
|
|
99
|
+
url: '/api/submit',
|
|
100
|
+
method: 'post',
|
|
101
|
+
data: {
|
|
102
|
+
name: 'test',
|
|
103
|
+
},
|
|
104
|
+
});
|
|
105
|
+
console.log(res);
|
|
106
|
+
} catch (error) {
|
|
107
|
+
console.error(error);
|
|
108
|
+
}
|
|
109
|
+
};
|
|
110
|
+
</script>
|
|
111
|
+
|
|
112
|
+
<template>
|
|
113
|
+
<div>
|
|
114
|
+
<button @click="fetchData" :disabled="loading">
|
|
115
|
+
{{ loading ? '加载中...' : '获取数据' }}
|
|
116
|
+
</button>
|
|
117
|
+
<button @click="submitData">提交数据</button>
|
|
118
|
+
</div>
|
|
119
|
+
</template>
|
|
120
|
+
```
|
|
121
|
+
|
|
122
|
+
### 3. 在 Options API 中使用
|
|
123
|
+
|
|
124
|
+
```vue
|
|
125
|
+
<script>
|
|
126
|
+
export default {
|
|
127
|
+
data() {
|
|
128
|
+
return {
|
|
129
|
+
loading: false,
|
|
130
|
+
data: null,
|
|
131
|
+
};
|
|
132
|
+
},
|
|
133
|
+
methods: {
|
|
134
|
+
async fetchData() {
|
|
135
|
+
this.loading = true;
|
|
136
|
+
try {
|
|
137
|
+
// 通过 this.$request 访问
|
|
138
|
+
const res = await this.$request({
|
|
139
|
+
url: '/api/data',
|
|
140
|
+
method: 'get',
|
|
141
|
+
params: {
|
|
142
|
+
id: 1,
|
|
143
|
+
},
|
|
144
|
+
});
|
|
145
|
+
this.data = res;
|
|
146
|
+
} catch (error) {
|
|
147
|
+
console.error(error);
|
|
148
|
+
} finally {
|
|
149
|
+
this.loading = false;
|
|
150
|
+
}
|
|
151
|
+
},
|
|
152
|
+
async submitData() {
|
|
153
|
+
try {
|
|
154
|
+
const res = await this.$request({
|
|
155
|
+
url: '/api/submit',
|
|
156
|
+
method: 'post',
|
|
157
|
+
data: {
|
|
158
|
+
name: 'test',
|
|
159
|
+
},
|
|
160
|
+
});
|
|
161
|
+
console.log(res);
|
|
162
|
+
} catch (error) {
|
|
163
|
+
console.error(error);
|
|
164
|
+
}
|
|
165
|
+
},
|
|
166
|
+
},
|
|
167
|
+
};
|
|
168
|
+
</script>
|
|
169
|
+
```
|
|
170
|
+
|
|
171
|
+
## API
|
|
172
|
+
|
|
173
|
+
### Composition API
|
|
174
|
+
|
|
175
|
+
- `useRequest()` - 获取 request 实例
|
|
176
|
+
|
|
177
|
+
### 请求方法
|
|
178
|
+
|
|
179
|
+
- `request(options)` - 发送 HTTP 请求
|
|
180
|
+
|
|
181
|
+
#### 请求参数
|
|
182
|
+
|
|
183
|
+
- `url` - 请求的地址(必填)
|
|
184
|
+
- `method` - 请求方法,默认为 `'get'`
|
|
185
|
+
- `data` - POST 请求的数据
|
|
186
|
+
- `params` - GET 请求的查询参数
|
|
187
|
+
- `headers` - 自定义请求头
|
|
188
|
+
- `once` - 控制接口只执行一次(可选)
|
|
189
|
+
|
|
190
|
+
#### 使用示例
|
|
191
|
+
|
|
192
|
+
```javascript
|
|
193
|
+
// GET 请求
|
|
194
|
+
request({
|
|
195
|
+
url: '/api/users',
|
|
196
|
+
method: 'get',
|
|
197
|
+
params: {
|
|
198
|
+
page: 1,
|
|
199
|
+
size: 10,
|
|
200
|
+
},
|
|
201
|
+
});
|
|
202
|
+
|
|
203
|
+
// POST 请求
|
|
204
|
+
request({
|
|
205
|
+
url: '/api/users',
|
|
206
|
+
method: 'post',
|
|
207
|
+
data: {
|
|
208
|
+
name: 'John',
|
|
209
|
+
age: 30,
|
|
210
|
+
},
|
|
211
|
+
});
|
|
212
|
+
|
|
213
|
+
// 只执行一次的请求
|
|
214
|
+
request({
|
|
215
|
+
url: '/api/submit',
|
|
216
|
+
method: 'post',
|
|
217
|
+
data: { name: 'test' },
|
|
218
|
+
once: true,
|
|
219
|
+
});
|
|
220
|
+
```
|
|
221
|
+
|
|
222
|
+
更多 API 请参考源码。
|
|
223
|
+
|
|
224
|
+
## Cookie 跨域处理
|
|
225
|
+
|
|
226
|
+
本包自动处理 Cookie 跨域设置,确保在跨域请求时能够正确携带 Cookie。
|
|
227
|
+
|
|
228
|
+
### 自动设置
|
|
229
|
+
|
|
230
|
+
1. **`withCredentials`**:默认设置为 `true`,允许跨域请求携带 Cookie
|
|
231
|
+
2. **`document.domain`**:自动调用 `@deppon/deppon-utils` 的 `setCookieDomain()` 方法设置:
|
|
232
|
+
|
|
233
|
+
- 如果 URL 包含 `deppontest.com`,自动设置 `document.domain = 'deppontest.com'`
|
|
234
|
+
- 如果 URL 包含 `deppon.com`,自动设置 `document.domain = 'deppon.com'`
|
|
235
|
+
|
|
236
|
+
注意:`setCookieDomain` 方法已从 `@deppon/deppon-utils` 导入,你也可以手动调用:
|
|
237
|
+
|
|
238
|
+
```javascript
|
|
239
|
+
import { setCookieDomain } from '@deppon/deppon-utils';
|
|
240
|
+
setCookieDomain();
|
|
241
|
+
```
|
|
242
|
+
|
|
243
|
+
### 使用场景
|
|
244
|
+
|
|
245
|
+
- 在 UAP 环境中,需要跨域请求时携带 Cookie(如登录凭证)
|
|
246
|
+
- 在子域名之间共享 Cookie
|
|
247
|
+
- 在 iframe 环境中进行跨域请求
|
|
248
|
+
|
|
249
|
+
### 注意事项
|
|
250
|
+
|
|
251
|
+
1. `document.domain` 只能在当前域或其父域上设置
|
|
252
|
+
- 例如:如果当前域是 `a.deppon.com`,可以设置为 `deppon.com`,但不能设置为其他域
|
|
253
|
+
2. 设置 `document.domain` 后,端口号会被忽略
|
|
254
|
+
3. 如果设置失败(例如跨域限制),会静默失败,不影响其他功能
|
|
255
|
+
4. `withCredentials` 需要服务端配合设置 `Access-Control-Allow-Credentials: true` 响应头
|
|
256
|
+
|
|
257
|
+
### 示例
|
|
258
|
+
|
|
259
|
+
```javascript
|
|
260
|
+
import request from '@deppon/deppon-request';
|
|
261
|
+
|
|
262
|
+
// 跨域请求会自动携带 Cookie
|
|
263
|
+
request({
|
|
264
|
+
url: 'https://api.deppon.com/user/info',
|
|
265
|
+
method: 'get',
|
|
266
|
+
// withCredentials: true 已自动设置
|
|
267
|
+
});
|
|
268
|
+
```
|
package/es/composable.d.ts
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Composition API: useRequest
|
|
3
|
-
* 在 Vue 3 Composition API 中使用 request
|
|
4
|
-
*
|
|
5
|
-
* @example
|
|
6
|
-
* import { useRequest } from '@deppon/deppon-request/vue'
|
|
7
|
-
*
|
|
8
|
-
* export default {
|
|
9
|
-
* setup() {
|
|
10
|
-
* const request = useRequest()
|
|
11
|
-
*
|
|
12
|
-
* const fetchData = async () => {
|
|
13
|
-
* try {
|
|
14
|
-
* const res = await request({
|
|
15
|
-
* url: '/api/data',
|
|
16
|
-
* method: 'get'
|
|
17
|
-
* })
|
|
18
|
-
* console.log(res)
|
|
19
|
-
* } catch (error) {
|
|
20
|
-
* console.error(error)
|
|
21
|
-
* }
|
|
22
|
-
* }
|
|
23
|
-
*
|
|
24
|
-
* return { fetchData }
|
|
25
|
-
* }
|
|
26
|
-
* }
|
|
27
|
-
*/
|
|
28
|
-
export function useRequest(): any;
|
|
1
|
+
/**
|
|
2
|
+
* Composition API: useRequest
|
|
3
|
+
* 在 Vue 3 Composition API 中使用 request
|
|
4
|
+
*
|
|
5
|
+
* @example
|
|
6
|
+
* import { useRequest } from '@deppon/deppon-request/vue'
|
|
7
|
+
*
|
|
8
|
+
* export default {
|
|
9
|
+
* setup() {
|
|
10
|
+
* const request = useRequest()
|
|
11
|
+
*
|
|
12
|
+
* const fetchData = async () => {
|
|
13
|
+
* try {
|
|
14
|
+
* const res = await request({
|
|
15
|
+
* url: '/api/data',
|
|
16
|
+
* method: 'get'
|
|
17
|
+
* })
|
|
18
|
+
* console.log(res)
|
|
19
|
+
* } catch (error) {
|
|
20
|
+
* console.error(error)
|
|
21
|
+
* }
|
|
22
|
+
* }
|
|
23
|
+
*
|
|
24
|
+
* return { fetchData }
|
|
25
|
+
* }
|
|
26
|
+
* }
|
|
27
|
+
*/
|
|
28
|
+
export function useRequest(): any;
|
package/es/composable.js
CHANGED
|
@@ -2,32 +2,32 @@ import './_virtual/_rollup-plugin-inject-process-env.js';
|
|
|
2
2
|
import { inject, getCurrentInstance } from 'vue';
|
|
3
3
|
import DepponRquest from './request/request.js';
|
|
4
4
|
|
|
5
|
-
/**
|
|
6
|
-
* Composition API: useRequest
|
|
7
|
-
* 在 Vue 3 Composition API 中使用 request
|
|
8
|
-
*
|
|
9
|
-
* @example
|
|
10
|
-
* import { useRequest } from '@deppon/deppon-request/vue'
|
|
11
|
-
*
|
|
12
|
-
* export default {
|
|
13
|
-
* setup() {
|
|
14
|
-
* const request = useRequest()
|
|
15
|
-
*
|
|
16
|
-
* const fetchData = async () => {
|
|
17
|
-
* try {
|
|
18
|
-
* const res = await request({
|
|
19
|
-
* url: '/api/data',
|
|
20
|
-
* method: 'get'
|
|
21
|
-
* })
|
|
22
|
-
* console.log(res)
|
|
23
|
-
* } catch (error) {
|
|
24
|
-
* console.error(error)
|
|
25
|
-
* }
|
|
26
|
-
* }
|
|
27
|
-
*
|
|
28
|
-
* return { fetchData }
|
|
29
|
-
* }
|
|
30
|
-
* }
|
|
5
|
+
/**
|
|
6
|
+
* Composition API: useRequest
|
|
7
|
+
* 在 Vue 3 Composition API 中使用 request
|
|
8
|
+
*
|
|
9
|
+
* @example
|
|
10
|
+
* import { useRequest } from '@deppon/deppon-request/vue'
|
|
11
|
+
*
|
|
12
|
+
* export default {
|
|
13
|
+
* setup() {
|
|
14
|
+
* const request = useRequest()
|
|
15
|
+
*
|
|
16
|
+
* const fetchData = async () => {
|
|
17
|
+
* try {
|
|
18
|
+
* const res = await request({
|
|
19
|
+
* url: '/api/data',
|
|
20
|
+
* method: 'get'
|
|
21
|
+
* })
|
|
22
|
+
* console.log(res)
|
|
23
|
+
* } catch (error) {
|
|
24
|
+
* console.error(error)
|
|
25
|
+
* }
|
|
26
|
+
* }
|
|
27
|
+
*
|
|
28
|
+
* return { fetchData }
|
|
29
|
+
* }
|
|
30
|
+
* }
|
|
31
31
|
*/
|
|
32
32
|
function useRequest() {
|
|
33
33
|
// 优先从 provide 获取
|
package/es/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export default request;
|
|
2
|
-
export { default as VuePlugin } from "./vue";
|
|
3
|
-
export { useRequest } from "./composable";
|
|
4
|
-
import request from "./request";
|
|
1
|
+
export default request;
|
|
2
|
+
export { default as VuePlugin } from "./vue";
|
|
3
|
+
export { useRequest } from "./composable";
|
|
4
|
+
import request from "./request";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export default function optionsAdapter(options: any, instance: any, resolveOptions: any): any;
|
|
1
|
+
export default function optionsAdapter(options: any, instance: any, resolveOptions: any): any;
|
package/es/request/cancel.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export default function _default(options: any): void;
|
|
1
|
+
export default function _default(options: any): void;
|
package/es/request/headers.d.ts
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
export default function setHeaders(options: any): void;
|
|
2
|
-
/**
|
|
3
|
-
* 获取head信息
|
|
4
|
-
* @param {string} name 要匹配的关键字
|
|
5
|
-
* @param {boolean} vague 是否模糊搜索
|
|
6
|
-
* @return object
|
|
7
|
-
*
|
|
8
|
-
**/
|
|
9
|
-
export function getHeaderItem(name: string, vague?: boolean): {};
|
|
10
|
-
/**
|
|
11
|
-
* 不重复随机数
|
|
12
|
-
* @params toString参数范围(2-36)
|
|
13
|
-
*
|
|
14
|
-
**/
|
|
15
|
-
export function random(): string;
|
|
1
|
+
export default function setHeaders(options: any): void;
|
|
2
|
+
/**
|
|
3
|
+
* 获取head信息
|
|
4
|
+
* @param {string} name 要匹配的关键字
|
|
5
|
+
* @param {boolean} vague 是否模糊搜索
|
|
6
|
+
* @return object
|
|
7
|
+
*
|
|
8
|
+
**/
|
|
9
|
+
export function getHeaderItem(name: string, vague?: boolean): {};
|
|
10
|
+
/**
|
|
11
|
+
* 不重复随机数
|
|
12
|
+
* @params toString参数范围(2-36)
|
|
13
|
+
*
|
|
14
|
+
**/
|
|
15
|
+
export function random(): string;
|
package/es/request/headers.js
CHANGED
|
@@ -57,12 +57,12 @@ function getEnvHeader() {
|
|
|
57
57
|
}
|
|
58
58
|
}
|
|
59
59
|
|
|
60
|
-
/**
|
|
61
|
-
* 获取head信息
|
|
62
|
-
* @param {string} name 要匹配的关键字
|
|
63
|
-
* @param {boolean} vague 是否模糊搜索
|
|
64
|
-
* @return object
|
|
65
|
-
*
|
|
60
|
+
/**
|
|
61
|
+
* 获取head信息
|
|
62
|
+
* @param {string} name 要匹配的关键字
|
|
63
|
+
* @param {boolean} vague 是否模糊搜索
|
|
64
|
+
* @return object
|
|
65
|
+
*
|
|
66
66
|
**/
|
|
67
67
|
function getHeaderItem(name) {
|
|
68
68
|
var vague = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
@@ -89,13 +89,13 @@ function getHeaderItem(name) {
|
|
|
89
89
|
return list;
|
|
90
90
|
}
|
|
91
91
|
|
|
92
|
-
/**
|
|
93
|
-
* 加密逻辑
|
|
94
|
-
* 随机数:rm 平台号:mstatic 时间戳:time 密钥:key
|
|
95
|
-
* x-app-nonce: 随机字符串
|
|
96
|
-
* x-app-timestamp: 时间戳
|
|
97
|
-
* DEV、PRE:(@vs9jV]ykdnbjE7M) pro:(pro:8Wfy(kX7Gj$uhEUT)
|
|
98
|
-
* x-app-encrypt-text: 随机字符串 + 时间戳 + mstatic + md5
|
|
92
|
+
/**
|
|
93
|
+
* 加密逻辑
|
|
94
|
+
* 随机数:rm 平台号:mstatic 时间戳:time 密钥:key
|
|
95
|
+
* x-app-nonce: 随机字符串
|
|
96
|
+
* x-app-timestamp: 时间戳
|
|
97
|
+
* DEV、PRE:(@vs9jV]ykdnbjE7M) pro:(pro:8Wfy(kX7Gj$uhEUT)
|
|
98
|
+
* x-app-encrypt-text: 随机字符串 + 时间戳 + mstatic + md5
|
|
99
99
|
*/
|
|
100
100
|
function getEncryptHeader() {
|
|
101
101
|
var devpre = '@vs9jV]ykdnbjE7M';
|
|
@@ -119,10 +119,10 @@ function getEncryptHeader() {
|
|
|
119
119
|
}, headers);
|
|
120
120
|
}
|
|
121
121
|
|
|
122
|
-
/**
|
|
123
|
-
* 不重复随机数
|
|
124
|
-
* @params toString参数范围(2-36)
|
|
125
|
-
*
|
|
122
|
+
/**
|
|
123
|
+
* 不重复随机数
|
|
124
|
+
* @params toString参数范围(2-36)
|
|
125
|
+
*
|
|
126
126
|
**/
|
|
127
127
|
function random() {
|
|
128
128
|
return (Math.random() * 10000000).toString(16).substr(0, 4) + new Date().getTime() + Math.random().toString().substr(2, 5);
|
package/es/request/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export default request;
|
|
2
|
-
import request from "./request";
|
|
1
|
+
export default request;
|
|
2
|
+
import request from "./request";
|
package/es/request/instance.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export default function appInstance(options: any):
|
|
1
|
+
export default function appInstance(options: any): import("axios").AxiosPromise<any>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export function req(config: any, options: any): any;
|
|
2
|
-
export function reqErr(e: any): any;
|
|
1
|
+
export function req(config: any, options: any): any;
|
|
2
|
+
export function reqErr(e: any): any;
|
package/es/request/request.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export default DepponRquest;
|
|
2
|
-
declare function DepponRquest(options: any): any;
|
|
1
|
+
export default DepponRquest;
|
|
2
|
+
declare function DepponRquest(options: any): any;
|
package/es/request/request.js
CHANGED
|
@@ -7,12 +7,12 @@ import cancelApi from './cancel.js';
|
|
|
7
7
|
|
|
8
8
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
9
9
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
10
|
-
/**
|
|
11
|
-
* deppon-request说明
|
|
12
|
-
* @params options.url 请求的地址
|
|
13
|
-
* @params options.data 请求数据
|
|
14
|
-
* @params options.async 是否同步(废弃)
|
|
15
|
-
* @params options.headers 自定义请求头
|
|
10
|
+
/**
|
|
11
|
+
* deppon-request说明
|
|
12
|
+
* @params options.url 请求的地址
|
|
13
|
+
* @params options.data 请求数据
|
|
14
|
+
* @params options.async 是否同步(废弃)
|
|
15
|
+
* @params options.headers 自定义请求头
|
|
16
16
|
*/
|
|
17
17
|
if (!window.onceList) {
|
|
18
18
|
window.onceList = [];
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export function res(res: any, options: any): Promise<any>;
|
|
2
|
-
export function resErr(res: any, options: any): Promise<never>;
|
|
1
|
+
export function res(res: any, options: any): Promise<any>;
|
|
2
|
+
export function resErr(res: any, options: any): Promise<never>;
|
package/es/vue.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
declare namespace _default {
|
|
2
|
-
export { install };
|
|
3
|
-
}
|
|
4
|
-
export default _default;
|
|
5
|
-
export { useRequest } from "./composable";
|
|
6
|
-
/**
|
|
7
|
-
* Vue 插件安装函数
|
|
8
|
-
* @param {Object} app - Vue 应用实例
|
|
9
|
-
*/
|
|
10
|
-
declare function install(app: Object): void;
|
|
1
|
+
declare namespace _default {
|
|
2
|
+
export { install };
|
|
3
|
+
}
|
|
4
|
+
export default _default;
|
|
5
|
+
export { useRequest } from "./composable";
|
|
6
|
+
/**
|
|
7
|
+
* Vue 插件安装函数
|
|
8
|
+
* @param {Object} app - Vue 应用实例
|
|
9
|
+
*/
|
|
10
|
+
declare function install(app: Object): void;
|
package/es/vue.js
CHANGED
|
@@ -2,9 +2,9 @@ import './_virtual/_rollup-plugin-inject-process-env.js';
|
|
|
2
2
|
import { setCookieDomain } from '@deppon/deppon-utils';
|
|
3
3
|
import DepponRquest from './request/request.js';
|
|
4
4
|
|
|
5
|
-
/**
|
|
6
|
-
* Vue 插件安装函数
|
|
7
|
-
* @param {Object} app - Vue 应用实例
|
|
5
|
+
/**
|
|
6
|
+
* Vue 插件安装函数
|
|
7
|
+
* @param {Object} app - Vue 应用实例
|
|
8
8
|
*/
|
|
9
9
|
function install(app) {
|
|
10
10
|
// 设置 document.domain 以支持 cookie 跨域
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@deppon/deppon-request",
|
|
3
|
-
"version": "2.2.
|
|
3
|
+
"version": "2.2.3",
|
|
4
4
|
"description": "Frontend HTTP request package",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"homepage": "",
|
|
@@ -35,9 +35,9 @@
|
|
|
35
35
|
},
|
|
36
36
|
"dependencies": {
|
|
37
37
|
"@babel/runtime": "^7.17.7",
|
|
38
|
-
"@deppon/deppon-bridge": "2.2.
|
|
39
|
-
"@deppon/deppon-ui": "2.2.
|
|
40
|
-
"@deppon/deppon-utils": "2.2.
|
|
38
|
+
"@deppon/deppon-bridge": "2.2.3",
|
|
39
|
+
"@deppon/deppon-ui": "2.2.3",
|
|
40
|
+
"@deppon/deppon-utils": "2.2.3",
|
|
41
41
|
"axios": "^0.26.0",
|
|
42
42
|
"md5": "^2.3.0",
|
|
43
43
|
"qs": "^6.10.3"
|