vue项目打包部署后请求地址及请求问题

1   首先 vue中 是用的axios 发请求,  axios 支持Promise 非常好用,  可以在请求后的.then()中拿到请求回来的数据,像这样

2    请求方式有很多, 如get post put    get 又称为 queryParams 所以携带参数后看发的请求是拼串的,像这样

        写的时候你可以采取拼串的写法 像   'page = ' + page + '&size=‘size 这种写法,但这种写法过于死板, 当后台要求你穿的参数 是有值时就传 没值时不传 这样就不可以了 因为就算做收集的表单没有数据,也会传一个key过去,这样到后台 后台就会收到一个空值 , 这时候你可以用get请求的另一种方式   params, 这种写法相对灵活 写起来也比较简便 像这样

        但当你被要求没值时不传 你就要做一些处理了  比如 把所有要传得数据都放在一个对象中,在发请求前对象做一下处理 删掉没有值得那条属性 比如这样

3   还有就是 发请求的问题了   因为在开发的时候会有跨域问题,我们一般为了方便都会 配置一个代理proxyTable, 但是在打包部署后在服务器上会有问题   因为服务器上没有跨域 请求地址会错, 但是像我上篇帖子中说的那样  每一次打包前都 把请求地址改为服务器地址 那样又很麻烦, 所以我是这么做的，

我在config/dev.en.js中配置了一下 像这样

在config/prod.env.js中这样配置

在组件中发请求时这样写

我认为这样还是比较好用的   如果那里除了问题你需要在 调试工具的network中查看请求地址 看是不是正确 ，不正确改就行了

                这些都是比较基础的,但很实用,希望可以帮到你们

vue怎么同时调用两台不同服务器的接口

vue组件的数据传递应该是单向，永远是向下的，把父组件属性方法传递到子组件typescript值得学习吗，先学typescript还是javascript。

如果子组件要改变不同的颜色，是应该接受父组件传递进来的props，自己调用自己的方法，把props当个参数来判断来显示什么颜色，而不是让父元素调子组件的方法。

还有一种是vuex，组件本身跟store的某个值绑定，外部组件修改store的值，来影响该组件的颜色。

web前端怎么调用api接口

1、首先需要确定第三方的接口的基本信息：地址、请求方式，参数、返回值，接口模式这里第三方的接口是restful风格的，采用get请求。

2、确定好接口的相关模式之后，这里编写http的请求，用参数、请求模式构造请求。

3、这里最重要的构造http的请求，这里采用CloseableHttpClient，设置相关的header，采用HttpResponse接受用户的返回值。

4、在业务类中只需要封装相关的请求，把参数传入给接口中即可，这里返回jsonObject方便解析使用。

5、调用api接口还有其他的模式，如图通过MultiValueMap，封装参数，构造HttpEntity对象，RestTemplate发送请求即可。

使用vue的ajax-post请求调用接口

。

一般来说post请求应该传递对象，而不是直接传递数组，直接传递数组后端可能无法获取到你传过去的参数，个人建议要么吧你传过去的参数序列化，要么把这个数组JSON.stringify()转换成json字符串传递过去。

前端调用后端的接口有几种方式了

一般不存在前端给后端接口的情况，几乎都是后端给前端接口，所谓接口就是可以通过服务端部署的机器提供出来的URL地址进行动态的数据交互。

通常的工作流是后端跟前端协商定义数据接口格式（一般就是JSON格式）形成文档，后端实现接口，前端做静态的mock（可以是直接在页面的JS拼假数据或者通过JSONserver按照真实调用服务的方式集成），后端实现服务接口，两边都完成后集成联调。

现在有swagger或者apiairy等工具可以更简化这个过程。

WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在 WebSocket API 中， 浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输 。

在 WebSocket API 中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

现在，很多网站为了实现推送技术，所用的技术都是 Ajax 轮询。轮询是在特定的的时间间隔（如每 1 秒），由浏览器对服务器发出 HTTP 请求，然后由服务器返回最新的数据给客户端的浏览器。这种传统的模式带来很明显的缺点，即浏览器需要不断的向服务器发出请求，然而 HTTP 请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然这样会浪费很多的带宽等资源。

HTML5 定义的 WebSocket 协议，能更好的节省服务器资源和带宽，并且能够更实时地进行通讯。

浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求，连接建立以后， 客户端和服务器端就可以通过 TCP 连接直接交换数据 。

当你获取 Web Socket 连接后，你可以通过 send() 方法来向服务器发送数据，并通过 onmessage 事件来接收服务器返回的数据。

为了建立一个 WebSocket 连接，客户端浏览器首先要向服务器发起一个 HTTP 请求，这个请求和通常的 HTTP 请求不同，包含了一些附加头信息，其中附加头信息"Upgrade: WebSocket"表明这是一个申请协议升级的 HTTP 请求，服务器端解析这些附加的头信息然后产生应答信息返回给客户端，客户端和服务器端的 WebSocket 连接就建立起来了，双方就可以通过这个连接通道自由的传递信息，并且这个连接会持续存在直到客户端或者服务器端的某一方主动的关闭连接

socket.io 是一个类库，内部封装了 WebSocket，可以在浏览器与服务器之间建立实时通信。

如果某些旧版本的浏览器不支持 WebSocket，socket.io 会使用轮询代替。另外它还具有可发送二进制消息、多路复用、创建房间等特性，因此相比直接使用原生 WebSocket，socket.io 是更好的选择。

开发一个实时应用主要分两部分：服务端和客户端，socket.io 分别提供了相应的 npm 包供我们方便地调用。

接下来就通过一个生动形象且有趣的栗子分别介绍这两大块。

现在假设李白张三，李四，王五 5 个人加入了一个叫 棋牌室 的房间，在文章结束时我们将拥有一个麻雀虽小五脏俱全的峡谷英雄在线聊天室。

客户端的功能到这基本上也开发完了。核心 api 就是 on 和 emit 用于收发消息，既简单又优雅。

---