[教程]via主页获取IP代码

简单记录下,代码如下,很简单,会简单的前端就可以写出来

修改路径:via浏览器→设置→定制→Logo→HTML 代码,贴进去就行

<style>
#info p {
  font-family: sans-serif;
  font-size: 0.5em;
  color: #ffffff;
  text-shadow: 1px 1px 0 #ffcccc, -1px -1px 0 #ffcccc, 1px -1px 0 #ffcccc, -1px 1px 0 #ffcccc;
 letter-spacing: 0.1em;
}

</style>
<div id="info">
        <p>IP Information</p>
        <p id="ip">IP: Loading...</p>
        <p id="city">城市: Loading...</p>
        <p id="region">地区: Loading...</p>
        <p id="country">国家: Loading...</p>
        <!--<p id="zip">zip: Loading...</p>-->
        <p id="coord">坐标: Loading...</p>
    </div>
<script>
        // Function to fetch IP information
        async function fetchIPInfo() {
            try {
                const response = await fetch('http://ip-api.com/json');
                if (!response.ok) {
                    throw new Error('Network response was not ok');
                }
                const data = await response.json();
                
                // Update the page with the fetched information
                document.getElementById('ip').textContent = `IP: ${data.query}`;
                document.getElementById('city').textContent = `城市: ${data.city}`;
                document.getElementById('region').textContent = `区域: ${data.regionName}`;
                document.getElementById('country').textContent = `国家: ${data.country}`;
                //document.getElementById('zip').textContent = `ZIP: ${data.zip}`;
                document.getElementById('coord').textContent = `坐标: ${data.lon} , ${data.lat}`;
            } catch (error) {
                console.error('Error fetching IP information:', error);
                // Handle errors gracefully
                document.getElementById('info').innerHTML = '<p>Failed to fetch IP information. Please try again later.</p>';
            }
        }

        // Fetch IP information when the page loads
        window.onload = fetchIPInfo;
    </script>

效果如下:


标签: 代码 教程 via

发表评论

路人甲 表情
看不清楚?点图切换 Ctrl+Enter快速提交

网友评论(0)

sitemap