需求对话

提问

我在本地web能够使用ws协议去链接websocket,但是小程序不能使用。

回答

由于小程序使用的是SSL加密协议,所以需要使用wss。这里wss与ws的关系就相当于https于http的关系。

提问

我用的是宝塔Linux,SSL好申请,但是wss我就不会配置了。

回答

对的宝塔Linux申请SSL很简单,一键申请,相对https实现就很简单了。那我们开始做配置吧。但前提你需要保证以下的几个必备条件。

前提必备:

  1. 需要先为你的websocket域名申请SSL
  2. 宝塔Linux(非宝塔其实一样能用,但是我这里的教程主要针对宝塔Linux做的)

Nginx代理WSS

这一步主要用来实现wss转ws(即转到http)

打开管理后台,点开“网站”->“相应的域名”->“配置文件”(我糊的地方只是我的域名和ip信息,不是重要信息,不用在意)

搜索#SSL-END,在这串注释后面加上以下代码,图上我已经加上了,所以和你的肯定不一样

    #wss协议转发 小程序里面要访问的链接
# 访问:wss://xxxx.com/wss
location /wss {
proxy_pass http://host:8080;#代理到上面的地址去,
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
}

关于以上的配置我必须要说清楚,proxy_pass http://host:8080后面的地址加端口是你websocket的地址,这里必须加上端口,例如:http://baidu.com:8080,这里需要手动改的就是这一个地方。

先别关闭这个窗口,接下来还有

接下来把鼠标移到最顶端,也就是server上面添加以下代码,一样的道理,我这里已经添加了,所以和你的不一样,以你的为准

map $http_upgrade $connection_upgrade {
default upgrade;
'' close;
}
upstream websocket {
server ip:8080; #这里可以是多个服务端IP(分多行),设置权重就可以实现负载均衡了
}

这里需要手动设置一下,就是在upstream websocket里面有一个ip:8080。这个ip请替换成你的IP,IP在什么地方可以看到呢,看你宝塔linux左上角就有了,对就是那个。例如:server 114.114.114.114:8080

至此Nginx代理wss就算全部ok。请注意我用的socket端口是8080,如果你的端口被占用,请你更改,当然如果改了请把一系列的都改了

小程序websocket使用

官方文档:https://developers.weixin.qq....

我这里只是做连接测试。只是一个Demo

  miniWebsocket:function(){
wx.connectSocket({
url: 'wss://host/wss',
//这里只需要填写你开始配置的域名就好,但是请在域名后面添加一个/wss。例如:wss://baidu.com/wss
})
wx.onSocketOpen(function(res){
console.log(res)
console.log('打开成功')
})
wx.onSocketMessage(function(res){
console.log('收到服务器信息'+JSON.stringify(res))
})
wx.onSocketOpen(function (res) {
console.log('WebSocket连接已打开!')
console.log('数据发送')
wx.sendSocketMessage({
data: 'ekeylee'
})
})
}

上图就是我已经配置好小程序的返回信息,如果有什么地方写的不是很清楚,请文末留言,感谢

本文转载于:猿2048→https://www.mk2048.com/blog/blog.php?id=hicch2kjaab

关于小程序websocket全套解决方案,Nginx代理wss的更多相关文章

  1. 微信小程序 WebSocket 使用非 443 端口连接

    前言 微信小程序支持使用 WebSocket 连接到服务器,准确地说是带 SSL 的 WebSocket,而微信小程序中不允许使用带端口的 wss 连接,只能使用 443 端口.想使用其他端口就需要在 ...

  2. 微信小程序websocket

    微信小程序websocket 微信小程序带有websocket可以提供使用,但是官方文档写的东西很少,而且小程序后台能力弱这一点也是十分的坑爹,这就导致了socket长连接一切后台就会出现断开的情况, ...

  3. 微信小程序-WebSocket

    wx.connectSocket(OBJECT) 创建一个 WebSocket 连接:一个微信小程序同时只能有一个 WebSocket 连接,如果当前已存在一个 WebSocket 连接,会自动关闭该 ...

  4. 微信小程序 bug及解决方案

    1.小程序遮罩滚动穿透问题 解决方案: <view class="mask" wx:if="{{showVipRights}}" catchtap='hi ...

  5. 微信小程序-WebSocket应用

    为何有 HTTP 协议还需要 WebSocket ? Http协议 有个缺陷:通信只能由客户端发起.举例来说,我们想了解今天的天气,只能是客户端向服务器发出请求,服务器返回查询结果.HTTP 协议做不 ...

  6. 小程序websocket心跳库——websocket-heartbeat-miniprogram

    前言 在16年的时候因为项目接触到websocket,而后对心跳重连做了一次总结,写了篇博客,而后18年对之前github上的demo代码进行了再次开发和开源,最终封装成库.如下: 博客:https: ...

  7. 快速上手微信小程序webSocket

    WebSocket是一种在单个TCP连接上进行全双工通信的协议.WebSocket通信协议于2011年被IETF定为标准RFC 6455,并由RFC7936补充规范.WebSocket API也被W3 ...

  8. uniapp小程序webSocket封装使用

    目录 1,前言 2,代码实现 3,使用 3.1,初始化 3.2,发送消息 3.3,接收消息 1,前言 最近在做IOT的项目,里面有个小程序要用到webSocket,借这个机会,封装了一个uniapp小 ...

  9. 微信小程序 textarea 简易解决方案

    微信小程序中textarea没有bindchange事件,所以无法在输入时给变量赋值. 虽然可以使用bindblur事件,但是绑定bindblur事件,如果再点击按钮,则先执行完按钮事件后,再去执行b ...

随机推荐

  1. 基于SqlSugar的数据库访问处理的封装,支持多数据库并使之适应于实际业务开发中

    在我的各种开发框架中,数据访问有的基于微软企业库,有的基于EFCore的实体框架,两者各有其应用场景,不过多的去比较.最近在使用SqlSugar的时候,觉得这个数据访问处理的组件确实很灵活,据说性能也 ...

  2. JZ-046-圆圈中最后剩下的数

    圆圈中最后剩下的数 题目描述 每年六一儿童节,牛客都会准备一些小礼物去看望孤儿院的小朋友,今年亦是如此.HF作为牛客的资深元老,自然也准备了一些小游戏. 其中,有个游戏是这样的:首先,让小朋友们围成一 ...

  3. php 23种设计模型 - 状态模式

    状态模式 状态模式当一个对象的内在状态改变时允许改变其行为,这个对象看起来像是改变了其类.状态模式主要解决的是当控制一个对象状态的条件表达式过于复杂时的情况.把状态的判断逻辑转移到表示不同状态的一系列 ...

  4. CF802O题解

    太厉害啦,出题人究竟是怎么想到的. 首先这题很显然可以使用费用流:对于 \(i \leq j\),连接一条边 \((i,j+n)\),流量为 \(1\),费用为 \(a_i+b_j\).最后连接 \( ...

  5. 解析ansible远程管理客户端【win终端为例】

    一.前提: 1.1.windows机器开启winrm服务,并设置成允许远程连接状态 具体操作命令如下 set-executionpolicy remotesigned winrm quickconfi ...

  6. WPF之转换器

    IValueConverter的用法1. COnvert方法object Convert( object value, Type targetType, object parameter, Cultu ...

  7. For循环案例练习一基础版

    输出1-10之间的数据 1 public class LX1 { 2 public static void main(String[] args) { 3 for (int x=1;x<=10; ...

  8. Java 程序性能问题

    ● 1. 尽量在合适的场合使用单例 使用单例可以减轻加载的负担,缩短加载的时间,提高加载的效率,但并不是所有地方都适用于单例,简单来说,单例主要适用于以下三个方面: 第一,控制资源的使用,通过线程同步 ...

  9. JSON.parse()和JSON.stringfy()区别

    JSON.parse() 用于从一个json格式字符串解析出json类型的数据,如: 注意事项:json格式字符串必须是写在一排的,且括号外面用单引号,里面的每一个字符串用双引号 JSON.strin ...

  10. 前端知识之html基础

    前端知识之html内容 web服务本质 浏览器发送请求-->http协议-->服务端接收请求-->服务端返回响应-->服务端把html文件内容发给浏览器-->浏览器渲染页 ...