创建局域网分享图片及html页面服务(简单讲下)

本文主要是介绍创建局域网分享图片及html页面服务(简单讲下),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

目录

1. 使用Python的SimpleHTTPServer(适用于Windows)

 打开其中的.html文件:

  打开其中的.png文件:

推荐第2种:

2. 使用Node.js和http-server(适用于所有平台)

安装http-server(如果你还没有安装的话):

 打开text文件:

打开图片:

打开网页:


要让前端自己创建的原生HTML网页在局域网内分享,最简单的方法是通过搭建一个简单的本地Web服务器。以下是具体的步骤:

1. 使用Python的SimpleHTTPServer(适用于Windows)

如果你的电脑上安装了Python,你可以使用Python内置模块http.server(在Python 2中是SimpleHTTPServer)来快速搭建一个Web服务器。

  1. 打开命令行工具(在Windows上是CMD或PowerShell,在macOS上是Terminal)。
  2. 导航到包含你的HTML文件的目录。例如,如果你的HTML文件在C:\Users\17164\Desktop\fff
这里是文件夹路径
cd C:\Users\17164\Desktop\fff

或者直接在文件夹里面找到你的文件

  1. 路径cmd打开
  2. 运行以下命令来启动Web服务器
  3. 注意端口占用问题

    python -m http.server 8080
    正在运行中,但是不会实时更新,每次进入页面就会执行一次请求(手动刷新)
  4. 在Python 2中,命令是:
    注意端口占用问题
    python -m SimpleHTTPServer 8080
    这将在端口8080上启动一个Web服务器。你可以通过访问http://localhost:8080来在本地浏览器中查看你的网页。

用这个打开text会乱码,编码不一致导致的,但是下面的第二种方法不会

 打开其中的.html文件:

  打开其中的.png文件:

 分享完成

推荐第2种:

2. 使用Node.js和http-server(适用于所有平台)

如果你已经安装了Node.js,你可以使用http-server这个npm包来快速搭建Web服务器

  1. 安装http-server(如果你还没有安装的话):

  2. npm install -g http-server

  1. 导航到包含你的HTML文件的目录。
  2. 运行以下命令来启动Web服务器:
    http-server
    这将在默认端口(通常是8080)上启动一个Web服务器。你可以通过访问http://localhost:8080来在本地浏览器中查看你的网页。

 或者用其他设备打开

 

比如 用手机打开:

可以正常下载文件和看网页之类

 电脑打开网页:

 打开text文件:

打开图片:

打开网页:

 打开表格:

需要确保你的网络是安全的,并且不要分享敏感或私人的网页。此外,一些网络环境(如公司或学校网络)可能限制了内部IP地址的访问,所以在这种情况下,你可能需要额外的配置或权限才能成功分享你的网页。

结束,简单的讲下,继续加班中。。。

这篇关于创建局域网分享图片及html页面服务(简单讲下)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/824585

相关文章

Vue3 的 shallowRef 和 shallowReactive:优化性能

大家对 Vue3 的 ref 和 reactive 都很熟悉,那么对 shallowRef 和 shallowReactive 是否了解呢? 在编程和数据结构中,“shallow”(浅层)通常指对数据结构的最外层进行操作,而不递归地处理其内部或嵌套的数据。这种处理方式关注的是数据结构的第一层属性或元素,而忽略更深层次的嵌套内容。 1. 浅层与深层的对比 1.1 浅层(Shallow) 定义

Ilya-AI分享的他在OpenAI学习到的15个提示工程技巧

Ilya(不是本人,claude AI)在社交媒体上分享了他在OpenAI学习到的15个Prompt撰写技巧。 以下是详细的内容: 提示精确化:在编写提示时,力求表达清晰准确。清楚地阐述任务需求和概念定义至关重要。例:不用"分析文本",而用"判断这段话的情感倾向:积极、消极还是中性"。 快速迭代:善于快速连续调整提示。熟练的提示工程师能够灵活地进行多轮优化。例:从"总结文章"到"用

这15个Vue指令,让你的项目开发爽到爆

1. V-Hotkey 仓库地址: github.com/Dafrok/v-ho… Demo: 戳这里 https://dafrok.github.io/v-hotkey 安装: npm install --save v-hotkey 这个指令可以给组件绑定一个或多个快捷键。你想要通过按下 Escape 键后隐藏某个组件,按住 Control 和回车键再显示它吗?小菜一碟: <template

【 html+css 绚丽Loading 】000046 三才归元阵

前言:哈喽,大家好,今天给大家分享html+css 绚丽Loading!并提供具体代码帮助大家深入理解,彻底掌握!创作不易,如果能帮助到大家或者给大家一些灵感和启发,欢迎收藏+关注哦 💕 目录 📚一、效果📚二、信息💡1.简介:💡2.外观描述:💡3.使用方式:💡4.战斗方式:💡5.提升:💡6.传说: 📚三、源代码,上代码,可以直接复制使用🎥效果🗂️目录✍️

【前端学习】AntV G6-08 深入图形与图形分组、自定义节点、节点动画(下)

【课程链接】 AntV G6:深入图形与图形分组、自定义节点、节点动画(下)_哔哩哔哩_bilibili 本章十吾老师讲解了一个复杂的自定义节点中,应该怎样去计算和绘制图形,如何给一个图形制作不间断的动画,以及在鼠标事件之后产生动画。(有点难,需要好好理解) <!DOCTYPE html><html><head><meta charset="UTF-8"><title>06

使用opencv优化图片(画面变清晰)

文章目录 需求影响照片清晰度的因素 实现降噪测试代码 锐化空间锐化Unsharp Masking频率域锐化对比测试 对比度增强常用算法对比测试 需求 对图像进行优化,使其看起来更清晰,同时保持尺寸不变,通常涉及到图像处理技术如锐化、降噪、对比度增强等 影响照片清晰度的因素 影响照片清晰度的因素有很多,主要可以从以下几个方面来分析 1. 拍摄设备 相机传感器:相机传

csu 1446 Problem J Modified LCS (扩展欧几里得算法的简单应用)

这是一道扩展欧几里得算法的简单应用题,这题是在湖南多校训练赛中队友ac的一道题,在比赛之后请教了队友,然后自己把它a掉 这也是自己独自做扩展欧几里得算法的题目 题意:把题意转变下就变成了:求d1*x - d2*y = f2 - f1的解,很明显用exgcd来解 下面介绍一下exgcd的一些知识点:求ax + by = c的解 一、首先求ax + by = gcd(a,b)的解 这个

hdu2289(简单二分)

虽说是简单二分,但是我还是wa死了  题意:已知圆台的体积,求高度 首先要知道圆台体积怎么求:设上下底的半径分别为r1,r2,高为h,V = PI*(r1*r1+r1*r2+r2*r2)*h/3 然后以h进行二分 代码如下: #include<iostream>#include<algorithm>#include<cstring>#include<stack>#includ

【专题】2024飞行汽车技术全景报告合集PDF分享(附原数据表)

原文链接: https://tecdat.cn/?p=37628 6月16日,小鹏汇天旅航者X2在北京大兴国际机场临空经济区完成首飞,这也是小鹏汇天的产品在京津冀地区进行的首次飞行。小鹏汇天方面还表示,公司准备量产,并计划今年四季度开启预售小鹏汇天分体式飞行汽车,探索分体式飞行汽车城际通勤。阅读原文,获取专题报告合集全文,解锁文末271份飞行汽车相关行业研究报告。 据悉,业内人士对飞行汽车行业

如何在页面调用utility bar并传递参数至lwc组件

1.在app的utility item中添加lwc组件: 2.调用utility bar api的方式有两种: 方法一,通过lwc调用: import {LightningElement,api ,wire } from 'lwc';import { publish, MessageContext } from 'lightning/messageService';import Ca