vue中獲取本地ip

1、目的

獲取當前訪問的ip地址

2、思路

經過使用搜狐的api獲取訪問ip

3、操做步驟

一、在index.html中添加

<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>

二、新建一個組件Admin.vue，調用方法

<template>
     <div>
         <h1>username:{{user.username}}</h1>
         <h1>age:{{user.age}}</h1>
         <h1>ip:{{user.ip}}</h1>
     </div>
 </template>
 
 <script>
 export default {
    data(){
        return{
            user:{
                'username':'sj',
                'age':18,
                'ip':''
            }
        }
    },
    mounted(){
        this.ready()
    },
    methods:{
        ready:function(){
                //獲取本地IP地址
                //js 引入 <!-- 獲取本機ip  -->
                //<script src="http://pv.sohu.com/cityjson?ie=utf-8">
            var cip = returnCitySN["cip"];
                //給vuedata對象裏的字段賦值
            this.user.ip = cip
        }
    }
    
 }
 </script>　

3、結果展現

一、搜狐網站訪問結果

 

二、運行結果