一个比较简单的获取ip信息微信小程序

index.wxml:

<view class="container">
   <view class="main">
       <text class="ip">您的手机IP：{
          
   {
          
   motto.query}}
       </text>
       <text class="location">IP位置：{
          
   {
          
   motto.city}},{
          
   {
          
   motto.regionName}},{
          
   {
          
   motto.country}} 
       </text>
       <text class="timezone">时区：{
          
   {
          
   motto.timezone}}
       </text>
       <text class="lat">纬度：{
          
   {
          
   motto.lat}}
       </text>
       <text class="lon">经度：{
          
   {
          
   motto.lon}}
       </text>
   </view>
</view>

index.wxss:

.container{
          
   
  width: 100%;
  height:100%;
  overflow:hidden;
  position:fixed;
  background-size: 100% 100%;
  background-image: url(http://image-shenlihong.test.upcdn.net/ip.jpg);
}
.main{
          
   
  width: 90%;
  float: left;
  height: 800rpx;
  margin-top: 10%;
  background: white;
  opacity: 0.7;
  border-radius: 20rpx;
}
.ip{
          
   
  width: 100%;
  height: 10%;
  float: left;
  text-align: center;
  margin-top: 10%;
  color: #6FFFFF;
}
.location{
          
   
  width: 100%;
  height: 10%;
  float: left;
  text-align: center;
  margin-top: 10%;
  color: #6FFFFF;
}
.timezone{
          
   
  width: 100%;
  height: 10%;
  float: left;
  text-align: center;
  margin-top: 10%;
  color: #6FFFFF;
}
.lat{
          
   
  width: 100%;
  height: 10%;
  float: left;
  text-align: center;
  margin-top: 10%;
  color: #6FFFFF;
}
.lon{
          
   
  width: 100%;
  height: 10%;
  float: left;
  text-align: center;
  margin-top: 10%;
  color: #6FFFFF;
}

index.js:

var app = getApp()
Page({
          
   
  data: {
          
   
    motto:   // IP地址
  },
  onLoad: function (e) {
          
     // 获取参数
    var that = this;
    wx.request({
          
     // 获取ip
      url: http://ip-api.com/json,
      success: function (e) {
          
   
        that.setData({
          
   
          motto: e.data
        })
        console.log(e.data)
      }
    })
  },
  onPullDownRefresh: function () {
          
   
    console.log(onPullDownRefresh)
    // 3秒模拟数据加载
    // 不加这个方法真机下拉会一直处于刷新状态，无法复位
    setTimeout(function() {
          
   
      wx.stopPullDownRefresh()
      wx.showToast({
          
   
        title: 数据获取成功！, // 标题
        icon: success,  // 图标类型，默认success
        duration: 1500  // 提示窗停留时间，默认1500ms
      })
    }.bind(this),2200);

  }
})