header是在电路中一般表示插针连接器,如果Header后直接跟数字x ,则表示该连接器有x列插针,如果Header后不仅有数字x还有数字2 ,则表示该连接器为双排x列插针。
1. 创建httpWebRequest对象HttpWebRequest不能直接通过new来创建,只能通过WebRequest.Create(url)的方式来获得。
WebRequest是获得一些列应用层协议对象的一个统一的入口(工厂模式),它根据参数的协议来确定最终创建的对象类型。所以我们的程序里面有一个对返回对象的类型进行测试的过程。
2. 初始化HttpWebRequest对象
这个过程提供一些http请求常用的属性:agentstring,contenttype等其中agentstring比较有意思,它是用来识别你用的浏览器名字的,通过设置这个属性你可以欺骗服务器你是一个IE,firefox甚至是mac里面的safari。很多认真设计的网站都会根据这个值来返回对用户浏览器特别优化过的代码。
3. 附加要POST给服务器的数据到HttpWebRequest对象
附加POST数据的过程比较特殊,它并没有提供一个属性给用户存取,需要写入HttpWebRequest对象提供的一个stream里面。
4. 读取服务器的返回信息
读取服务器返回的时候,要注意返回数据的encoding。如果我们提供的解码类型不对会造成乱码。比较常见的是utf-8和gb2312之间的混淆,据我测试,国内的主机一般都是gb2312编码的。一般设计良好的网站会把它编码的方式放在返回的http header里面,但是也有不少网站根本没有,我们只能通过一个对返回二进制值的统计方法来确定它的编码方式。
vuewebupload怎么添加请求头部内容,最近接手了一个重构前端页面的项目, 后台只提供api接口, 需要使用前端的vue框架中的Upload进行上传文件, 并携带两个参数, 同时还需要在请求头中设置userId查找了很多资料, 使用原生的上传也是可以的 , 只是之前没有注意到userId这事, 导致发送请求时总是报错500(internal server error)
在这里插入图片描述
接下来看一下如何使用Upload标签实现点击/拖拽上传
如何携带参数, 如何设置headers
<template>
<div>
<Row>
<Col>
<Upload
multiple
type="drag"
:data="submitData"
:headers="upHeaders"
action="/api/cs-dzjf-soa/api/v1/file/upload"
>
<div style="padding: 20px 0">
<Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
<p>点击或拖拽到此处上传</p>
</div>
</Upload>
</Col>
</Row>
</div>
</template>
<script>
import axios from "axios"
export default {
components: {},
name: "first",
data() {
return {
submitData: { // 这里是需要携带的数据
srcLanguage: "en",
tgtLanguage: "zh"
},
upHeaders: { // 这里设置的是请求头中的userId, 用于鉴权的
"userId": "fffffffffffffffffffffffffff"
}
}
},
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
效果图如下
在这里插入图片描述
Upload标签中配置的:data就是用于携带参数的, :headers是用于携带头信息的, 请求的url地址中开头位置的api是用于解决跨域的, 具体如何在前端解决跨域参考 前端解决跨域
**这里在headers中不需要配置Content-Type: multipart/form-data, 多此一举
后期补充的问题:
Upload中默认上传时的格式是
file: (binary)
1
1
这里现在使用的后台接口中, 用于接收上传文件的字段是是data, 那么这时候就需要在前台修改一下Upload默认的键名, 百度一番之后, 无果, 决定找一下源码看看, 源码也没找到有用的信息, 在一个github项目上找到了点信息
github地址
在这里插入图片描述
看到这句话 是不是觉得好像有点对症呢???没错, 就是这里可以设置
在这里插入图片描述
在这配置上name属性之后, 我们重新上传一下文件试试
现在已经成功的修改了
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)