小程序测试后台服务的方法(ngrok)

所属分类: 网络编程 / JavaScript 阅读数: 371
收藏 0 赞 0 分享

什么是ngrok?

官方解释是这样说的:

ngrok 是一个反向代理,通过在公共的端点和本地运行的 Web 服务器之间建立一个安全的通道。

这段话是什么意思?

运行ngrok服务以后,本地运行的Web服务会被ngrok代理。当你访问它给你提供的域名时候,它会经过公共的端点解析到本地,这样本地的服务就可以通过外网访问了。(看不懂也没关系,会用就行了)

如何使用?

这里告诉大家一个国内搭建的 Ngrok国内免费服务器-小米球,使用起来更方便灵活。

服务成功启动以后长这样,表示把这个域名映射到本地,支持httphttps哦:

启动本地的服务

服务的业务逻辑很简单,就是返回一个json对象:

@SpringBootApplication
@RestController
public class DockerApplication {
  public static void main(String[] args) {
    SpringApplication.run(DockerApplication.class, args);
  }
  @RequestMapping("/hello")
  public Object index() {
    Map data=new HashMap();
    data.put("code",200);
    data.put("msg","ngrok搭建成功");
    return data;
  }
}

然后通过浏览器访问这个域名,返回下面这串信息就说明ngrok搭建成功了。

{"msg":"ngrok搭建成功","code":200}

接下来我们要

在小程序里使用我们的后台服务

(搞这么一堆,终于可以使用啦)。

index.wxml写上这一段代码:

<view>
<button bindtap="clickMe">点我</button>
</view>
<view>状态码:{{data.code}}</view>
<view>信息:{{data.msg}}</view>

点击按钮绑定了一个clickMe函数,如果函数执行成功返回的值就会在下面渲染出。

index.js实现这个函数:

 clickMe : function(){
  var that = this;
  wx.request({
   url: 'https://video01.ngrok.xiaomiqiu.cn/hello',  
   success(res) {
    var data = res.data;
    that.setData({
     data: data
    });
   }
  })
 }

记得在详情里比这个勾上,

终于可以测试了

点击前:

点击后:

说明我们的后台成功被小程序访问到了!!!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

更多精彩内容其他人还在看

JavaScript省市区三级联动菜单效果

这篇文章主要为大家详细介绍了JavaScript省市区三级联动菜单效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
收藏 0 赞 0 分享

javascript函数中的3个高级技巧

这篇文章主要为大家详细介绍了javascript函数中的3个高级技巧,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
收藏 0 赞 0 分享

D3.js实现雷达图的方法详解

大家应该都知道基本图表一共有六种,分别是柱状图、折线图、散点图、气泡图、饼图和雷达图。前面五种图形都已经介绍过如何实现了,今天我们一起来看看最后的雷达图。有需要的朋友们可以参考学习下。
收藏 0 赞 0 分享

vuejs在解析时出现闪烁的原因及防止闪烁的方法

这篇文章主要介绍了vuejs在解析时出现闪烁的原因及防止闪烁的方法,本文介绍的非常详细,具有参考借鉴价值,感兴趣的朋友一起看看吧
收藏 0 赞 0 分享

JS遍历ul下的li点击弹出li的索引的实现方法

这篇文章主要介绍了JS遍历ul下的li点击弹出li的索引的方法,非常不错,具有参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

javascript this详细介绍

这篇文章主要介绍了javascript this详细介绍的相关资料,需要的朋友可以参考下
收藏 0 赞 0 分享

HTML5 实现的一个俄罗斯方块实例代码

这篇文章主要介绍了HTML5 实现的一个俄罗斯方块实例代码的相关资料,需要的朋友可以参考下
收藏 0 赞 0 分享

BootStrap入门教程(三)之响应式原理

这篇文章主要介绍了BootStrap入门教程(三)之响应式原理的相关资料,非常不错,具有参考借鉴价值,感兴趣的朋友一起看看吧
收藏 0 赞 0 分享

javascript实现图片左右滚动效果【可自动滚动,有左右按钮】

这篇文章主要介绍了javascript实现图片左右滚动效果,可实现自动滚动,带有左右按钮功能,基于插件scrollPic.js实现,附带了相应的demo源码供读者下载参考,需要的朋友可以参考下
收藏 0 赞 0 分享

javascript实现的左右无缝滚动效果

这篇文章主要介绍了javascript实现的左右无缝滚动效果,可实现左右平滑无缝滚动的效果,并且可响应鼠标滑过而停止滚动,非常简便实用,需要的朋友可以参考下
收藏 0 赞 0 分享
查看更多