js根据ip自动获取地址(省市区)

HTML:

<html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><title>标题</title><script src="http://res.wx.qq.com/open/js/jweixin-1.1.0.js"></script><script src="http://at.alicdn.com/t/font_kfbh2nlnqrrudi.js"></script><script src="https://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js"></script></head><body><div id="app"></div><!-- built files will be auto injected --></body>
</html>

JS:

  mounted () {/* eslint-disable */this.city = remote_ip_info.city// console.log(remote_ip_info.province + '\n' + remote_ip_info.city)/* eslint-enable */},

如果你看懂了上面的代码,就不用往下看了

讲解:

我们远程引入全局的一个js文件(这里也可以局部引入)

https://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js

  这个文件返回的数据如下:

var remote_ip_info = {"ret":1,"start":-1,"end":-1,"country":"\u4e2d\u56fd","province":"\u5e7f\u4e1c","city":"\u5e7f\u5dde","district":"","isp":"","type":"","desc":""};

  参数讲解:

country:国家
province:省份
city:城市
isp:所用网络(例如电信)

好啦,你已经获取到你想要的省市区了。

转载于:https://www.cnblogs.com/cczlovexw/p/8257157.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/369946.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

流利的对象创建

关于此主题的文章很多&#xff08;绝大多数&#xff09;&#xff0c;但我只是想贡献我的两分钱&#xff0c;写一篇简短的文章&#xff0c;介绍如何使用Java中的Fluent Object Creation模式或对象构建器实例化Value Objects。 值对象是由其状态&#xff08;值&#xff09;而不是…

计算机等级考试试题4,计算机等级考试二级模拟试题4

计算机等级考试二级模拟试题计算机等级考试二级模拟试题4基础知识与FOXBASE程序设计(考试时间120分钟&#xff0c;满分100分)一、选择题((1)-(40)每个选项1分,(41)-(50)每个选项2分,共60分)下列各题A)、B)、C)、D)、四个有选项中,只有一个选项是正确的(1)通常所说的主机主要包括…

springboot怎么替代jsp_如何在SpringBoot中使用JSP ?

1. 在pom.xm中加入支持JSP的依赖org.apache.tomcat.embedtomcat-embed-jasperprovidedjavax.servlet.jsp.jstljstl-api1.22. 在src/main/resources/application.properties文件中配置JSP和传统Spring MVC中和view的关联# MVCspring.view.prefix/WEB-INF/views/spring.view.suff…

css选择器的综合使用

代码实现&#xff1a; 1 <!DOCTYPE html>2 <html lang"en">3 <head>4 <meta charset"utf-8">5 <title>css的综合使用</title>6 <style>7 div {8 colo…

启动tomcat时 一闪而过解决方法

【前文】 在实际开发中一般都是eclipsetomcat(也许还会用到tomcat的插件)&#xff0c;我们只需要在eclipse中单击servers上的按钮就可以成功启动tomcat了&#xff0c; 但是如果想在tomcat的安装目录下 双击startup.bat启动时却一闪而过了。这是为什么呢&#xff08;tomcat启动失…

Google Guava多集

继续这次番石榴之旅&#xff0c;我们到达了Multiset 。 我可能不像Multimaps或Bimaps那样使用它&#xff0c;但是它确实有它的用途。 那么什么是多重集&#xff1f; 也许您可以猜到它是一个可以容纳同一对象的多个实例的集合。 这不仅仅是列表吗&#xff1f; 在Java中&#x…

用javascript实现简单的用户登录验证

用javascript实现简单的用户登录验证 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>Document</title> </head> <body><script type"text/javascript">function c…

怎么把计算机改程序,怎样修改程序软件

大家好&#xff0c;我是时间财富网智能客服时间君&#xff0c;上述问题将由我为大家进行解答。修改程序软件的方法是&#xff1a;这个必须要会编程才行&#xff1b;不会编程的话那是不可能的&#xff1b;对它进行反编译&#xff1b;脱壳&#xff1b;反编译好再把它重新加壳。程…

HTML的display属性将行内元素、块状元素、行内块状元素互相转换以及三者的区别

1.行内元素 查看演示 (1)设置宽高无效 (2)对margin仅设置左右方向有效&#xff0c;上下无效&#xff1b;padding设置上下左右都有效&#xff0c;即会撑大空间 (3)不会自动进行换行 <html> <head> <meta charset"utf-8" /> <title>行内元…

linux里面三剑客的重要作用

在服务器日志fresh.log中&#xff0c;找到所有报错的日期 $ sed -n /Error/p | awk {print $1} fresh.log grep:查找sed:行编辑器awk:文本处理工具 正则表达式的应用场景查找所有包含xxx的行取出以abc开头的所有单词匹配两位数、密码、QQ号、身份证号等 查找、取出、匹配符合条…

i2c通信 msp430g2553_关于msp430G2553的I2C串行通信

这是msp430g2xx3_uscib0_i2c_09例程&#xff0c;i2c从机接收数据的程序&#xff0c;请高手指点一下&#xff0c;为什么读取UCB0RXBUF是在发送中断中&#xff1f;接收机是在什么时候进入发送中断的&#xff1f;#include unsigned char *PRxData; // Pointer to RX dataunsigned …

Google Guava BiMaps

接下来的番石榴之旅&#xff0c;是另一种有用的收藏类型BiMap 。 实际上&#xff0c;这非常简单&#xff0c;BiMap只是双向地图。 反转地图 普通的Java映射是一组键和值&#xff0c;您可以按键查找值&#xff0c;这非常有用&#xff0c;例如&#xff0c;说我想创建一个&#x…

老大写得一个非常高大上的Makefile,包括非常多语法:

一个非常高大上的Makefile&#xff0c;包括非常多语法&#xff1a; TARGET api-login INSTALL_PATH /huishoubao/cgiinclude ../../implements/log/Makefile.log include ../../implements/tools/Makefile.tools include ../../implements/db/Makefile.db include ../../impl…

计算机等级考试模拟题卷子,二级VB模拟试卷 1

一、选择题&#xff1a;35题&#xff0c;2分/题&#xff0c;共70分下列各题A)、B)、C)、D)四个选项中&#xff0c;只有一个选项是正确的&#xff0c;请将正确选项涂写在答题卡相应位置上&#xff0c;答在试卷上不得分。1.假定窗体有一个标签&#xff0c;名为Label1,为了使该标签…

bugly怎么读_腾讯Bugly巨坑:使用不当造成UI界面卡死

本文由CocoaChina网友gagaga投稿前言Bugly和dispatch_once使用不当&#xff0c;会造成UI界面卡死。笔者在前段时间碰见了这样的一个卡死的情况&#xff0c;特意记录下来。iOS开发者或多或少都听过或用过Bugly。它是腾讯开发的一个SDK&#xff0c;用来捕捉App中的crash。对于dis…

复习HTML CSS(5)

n <meta>标记 <meta>的主要作用&#xff0c;是提供网页的源信息。比如&#xff1a;指定网页的搜索关键字 <meta>标记有两个属性&#xff1a;http-equiv和name。 1、 http-equiv属性 功能&#xff1a;模拟http协议文件头信息&#xff0c;当信息从服务器端传…

『cs231n』卷积神经网络工程实践技巧_下

概述 计算加速 方法一&#xff1a; 由于计算机计算矩阵乘法速度非常快&#xff0c;所以这是一个虽然提高内存消耗但是计算速度显著上升的方法&#xff0c;把feature map中的感受野&#xff08;包含重叠的部分&#xff0c;所以会加大内存消耗&#xff09;和卷积核全部拉伸成为向…

Spring属性占位符配置器–一些不太明显的选项

Spring的PropertySourcesPlaceholderConfigurer用于从XML或Java Config中定义的Spring bean定义外部化属性。 PlaceholderConfigurer支持的一些选项在文档中并不明显&#xff0c;但是很有趣并且可能有用。 首先&#xff0c;以Spring文档中的示例为例&#xff0c;考虑一个属性文…

计算机扬天m400c联想,【联想扬天M参数】联想扬天M系列台式电脑参数-ZOL中关村在线...

CPU型号内存容量硬盘容量屏幕尺寸显卡类型 价格详细对比Intel 奔腾双核 E52002GB DDRII 667MHz250GB SATAII 7200转高速防震硬盘集成显卡对比Intel 奔腾4 631512MBGB 512MB DDRII53380GB 7200转集成显卡对比Intel Atom 2301GBGB DDRII160GB 7200转高速防震硬盘集成显卡对比Inte…

SqlServer知识点

在公司天天写Sql写,存储过程,但是公司工具模板把创建的语句都写好了,只负责写里面的逻辑,久而久之,创建语句都不会写了。还有一些知识点都很模糊,平常使用的时候都不清楚,稀里糊涂的就在用。在这里整理一下。巩固复习。 一.存储过程。 1.存储过程类似编程语言的里面的函数,方法…