curl 访问不到html_嵌入式工程师入门前后端系列1:访问一个网页

c787bcdc36b2e7809eed9ee78ce48573.png

做为嵌入式行业的从业者,最近经常听到PAAS,SAAS等和”云”相关的概念,被整的一头雾水。很多时候咱们的物联网硬件设备都会有一个云平台,用于设备管理或者UI应用展示等功能,这通常是由专门的前后端工程师配合美工一起完成。作为一个门外汉,我计划简单学一下这方面的基础知识,以后也好和别人瞎侃,免得出现插不上话的尴尬。

先简单说说什么是前端和后端,以我们每天使用的百度为例,你在浏览器输入www.baidu.com/,就显示了如下呈现在你眼前的界面,这就是前端

66f77d355f62a3411c99b2b5fe1ee567.png

比如你在搜索框里输入黑洞,然后点击百度一下,真的出现了一个黑洞,

92386289344e14963178e7e383b84629.png

是不是很炫,这就是前端干的事。前端指的是用户可见的界面,网站前端页面也就是网页的页面开发,比如网页上的特效、布局、图片、视频,音频等内容。前端的工作内容就是将美工设计的效果图的设计成浏览器可以运行的网页,并配合后端做网页的数据显示和交互等可视方面的工作内容。

当然要实现这效果,也不是单单前端自己就完成了,背后离不开后端的支持,你百度的那一下,后端是做了很多工作的。后端是指用户看不见的东西,通常是与前端工程师进行数据交互及网站数据的保存和读取,相对来说后端涉及到的逻辑代码比前端要多的多,后端考虑的是底层业务逻辑的实现,平台的稳定性与性能等。

那么前端、后端一般用什么编译语言呢?

前端开发用到的语言主要是html、css、javascript,其他相关的还包括jquery、Bootstrap、ReactJs,VueJs等技术。

后端开发,用的编程语言包括java,python,go,还有c++,不同的语言都有自己的主流框架,比如java的框架有spring boot。java最多相关组件最完善,python最快最轻,go最新。大公司一般用Java。新上手可以用python快速上手,门槛最低。

刚听到上面一堆名词,我也是云里雾里,不过没关系,咱们先入门,慢慢学。

我们先实现一个简单的功能,在浏览器里输入一个地址,显示一个最简单的网页,网页里的内容是Hello World。

第一步,我们先新建一个hello.html,用Nodepad++或者Vscode里编辑

8ff6e69290d1096c26a0da49ebe1606c.png
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第一个html例子</title>
</head>
<body>Hello World!
</body>
</html>

其中:

<!DOCTYPE html> 声明为 HTML5 文档

<html> 元素是 HTML 页面的根元素

<head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。

<title> 元素描述了文档的标题

<body> 元素包含了可见的页面内容

https://www.runoob.com/html/html-tutorial.html 大家可以到菜鸟教程里学习html,里面介绍的非常详细。

之后你用浏览器就可以直接打开了,HTML称为超文本标记语言,是不需要编译的,HTML 运行在浏览器上,由浏览器来解析

96722a89ffce6901aea404dfd7b56e7e.png

在浏览器的页面上使用键盘上的 F12 按键开启调试模式,就可以看到背后的实现。

ceea8f567f3593a5818ec8062098c7d7.png

下一步我们实现通过浏览器输入本机的IP地址来访问,

先把Python装起来,https://www.python.org/downloads/release/python-2717/

输入:

python -m SimpleHTTPServer 8083

快速搭建一个http服务。这是python自带的功能。

7ec2bd38b1ca17034bd5a58aedf8f9f6.png

如果提示python找不到,修改下环境变量,添加上python的安装路径即可。

然后浏览器输入IP加端口即可访问,

80e733730f28917fcd1d4cc46d48b44f.png

把hello.html改为index.html,就可以直接显示出来了,

b0ec8e147f7e70ffa666599d1ba5e259.png

如果你有阿里云服务器,同样的做法,就可以远程访问部署在阿里云上的网页。这样在任何一台可以上网的电脑上都可以远程访问该页面。

刚开始我的阿里云一直访问不上,后来找到原因是安全规则设置的问题,登录阿里云配置一下,就可以了。

75c8d910f0280aed0db60d4c4a1315ba.png

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

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

相关文章

java:8最小镜像_Java:本地最小语言

java:8最小镜像在1996年至2002年之间&#xff0c;我用Java编写了成千上万行代码。我用Java 1.0到Java 1.4编写了Web框架&#xff0c;电子表格以及更多内容。 与90年代中期&#xff08;预模板&#xff09;的C 相比&#xff0c;Java是一种完全令人惊奇的语言。 JVM是所有计算机语…

seaborn无法import_无法导入seaborn

我在进口seaborn时有问题。我最近在我的电脑上安装了“Python”&#xff0c;并尝试使用seaborn pacjesge。我更新了scipy和{}。实际上&#xff0c;在更新scipy之前&#xff0c;python看不到{}。问题是什么&#xff1f;请帮帮我Python 2.7.10 |Anaconda 2.3.0 (64-bit)| (defaul…

project子项目之间任务关联_project项目任务类型,就这么简单

任务是Project中最重要的概念之一&#xff0c;它是组成项目的基本元素。在Project项目管理软件中&#xff0c;任务的类型被分为三类&#xff0c;它们分别是固定单位任务&#xff0c;固定工期任务和固定工时任务。对这些任务类型的认识和了解&#xff0c;项目团队可以充分的协调…

邪恶的Java技巧使JVM忘记检查异常

我长期以来一直批评Java中的编译器检查异常机制。 无论您是爱还是恨&#xff0c;都可以肯定一件事&#xff1a;在某些情况下&#xff0c;您不想与他们打交道。 Java中的解决方案是将一个检查过的异常包装在new RuntimeException(e)但这可以提供较长的堆栈跟踪&#xff0c;而无需…

盲僧一键r闪用什么设置_美加狮R.A.T. PRO X3至尊版带你畅玩模拟飞行

很多模拟飞行或者皇牌空战的玩家们都追求在游戏过程中的真实驾驶体验&#xff0c;渴望通过游戏来实现自己的飞行梦。但普通鼠标的左右键及滚轮并不能带给玩家逼真的体验&#xff0c;美加狮全新发布的鼠标R.A.T. PRO X3至尊版却可以做到。美加狮R.A.T. PRO X3至尊版是美加狮全新…

input标签的值只能两位小数_Day51 HTML表格表单标签、flask框架

目录表格标签表单标签action标签input标签select标签textarea标签form表单提交文件需要注意flask框架1、表格标签<!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>表格标签</title><meta name…

maven检测依赖_检测Maven依赖中介

maven检测依赖从Maven 2.0.9开始&#xff0c;已向Maven添加了一个称为依赖中介的新功能。 依赖关系中介是Maven在特定情况下在依赖关系树中多次出现依赖关系时用来解决项目依赖关系的技术。 通常&#xff0c;这发生在通过项目的依赖关系链接的传递依赖关系上。 在这些情况下&am…

webservice 参数太大_手把手系列:常用数据交换方案Web Service接口处理法

手把手系列&#xff1a;常用数据交换方案之Web Service接口处理法Web Service是一个SOA(面向服务的编程)的架构&#xff0c;是一个平台独立的&#xff0c;低耦合的&#xff0c;基于可编程的web的应用程序&#xff0c;可使用开放的XML标准来描述、发布、发现、协调和配置这些应用…

在事务外自动保存托管JPA实体

Spring中的存储库和事务并存。 Spring中的所有数据库访问都应在事务内运行&#xff0c;并且通常在某个地方使用Transactional来强制执行此操作。 但是&#xff0c;这并非总是必要的。 例如&#xff0c;当使用Spring Data时&#xff0c;您的存储库使用SimpleJPARepository来实现…

点击事件为什么会失效_Spring事务原理?事务在方法间如何传播?为什么会失效?...

推荐学习疯狂膜拜&#xff01;阿里出品Spring Security王者晋级文档肝了十天半月&#xff0c;献上纯手绘“Spring/Cloud/Boot/MVC”全家桶脑图前言事务我们都知道是什么&#xff0c;而Spring事务就是在数据库之上利用AOP提供声明式事务和编程式事务帮助我们简化开发&#xff0c…

wcdma系统随机接入过程的流程图_招聘电信协优初中级优化工程师、联通系统高级...

点击上方“通信人才网” 订阅&#xff01;招聘岗位招聘职位&#xff1a; 电信协优初中级优化工程师岗位类型&#xff1a;5G无线网络优化,4G-LTE无线网络优化,无线网优项目负责人,DT/CQT测试与分析,2G/3G无线网络优化工作地点&#xff1a; 西宁市,果洛藏族自治州,海南藏族自治州…

基于wincc的虚拟电梯设计_一文带你了解西门子整个虚拟调试与仿真软硬件体系...

写在面前大家好&#xff0c;我是小智&#xff0c;智能制造之家号主~经常有朋友关注到PLCSIM、SIMIT、Amesim、NX MCD、 Process Simulate、Plant Simulation等&#xff0c;但都不知道它们到底做啥的~因此今天对西门子仿真与虚拟调试进行整体介绍&#xff0c;力求让小白也能熟悉…

jedis使用 api_通过Jedis API使用排序集

jedis使用 api在上一篇文章中&#xff0c;我们开始研究Jedis API和Java Redis Client。 在这篇文章中&#xff0c;我们将研究Sorted Set&#xff08;zsets&#xff09;。 Sorted Set的工作方式类似于Set&#xff0c;它不允许重复的值。 最大的区别是&#xff0c;在“排序集”中…

三星ml1660拆机图解_炫龙DD2拆机,高性能的背后是怎样的面容?

双内存插槽 如标题所说&#xff0c;今天为大家带来炫龙DD2的图解拆机&#xff0c;废话少说&#xff0c;直接进入主题吧&#xff01;笔者对炫龙毁灭者DD2进行了简单拆解&#xff0c;拆解方式为打开D壳&#xff0c;查看散热模组和各部分硬件。炫龙毁灭者DD2延续了品牌一贯传统&am…

jwt-cli:一个用于解码JSON Web令牌(JWT令牌)的Shell库

当我开始经常需要解码JSON Web令牌时&#xff0c;我感到迫切需要编写允许我快速进行操作的程序。 有很多不错的选项&#xff0c;例如jwt.io &#xff0c;但是一旦您需要执行此操作&#xff0c;它通常就会变得笨拙。 而且&#xff0c;如果您需要处理多个令牌或进一步处理输出&am…

目录页码错误未定义书签怎么解决_目录页码对不齐应该怎么办?这2种方法,工作效率大增...

在制作文档目录时&#xff0c;你有没有遇到下图情况&#xff1a;右侧页码不对齐或者左侧文本不对齐&#xff0c;你一般是如何处理的&#xff0c;与大家分享相关的2种解决办法。工作效率大增&#xff01;1、目录页码不对齐该怎么办&#xff1f;遇到这种情况&#xff0c;一般是制…

三阶魔方大中小魔公式_三阶魔方的入门玩法教程|魔方玩法|魔方视频教程|魔方公式图解|--想成为魔方高手就来魔方乐园吧...

深圳魔方爱好者可以到实体店跟魔方老师学魔方了&#xff01;查询店铺地址在正式开始学习魔方还原前&#xff0c;请进入网站的首页&#xff0c;抽上10分钟的时间学习一些魔方的基础知识&#xff0c;这样会很有利于我们下面的学习&#xff0c;在还原的过程中有碰到疑问可以在线和…

初步了解Redis Streams以及如何在Java中使用它们

自今年年初以来&#xff0c;Redis Streams已进入Redis的unstable分支&#xff0c;并且第一个客户端始于采用Redis Streams API。 因此&#xff0c;这是一个绝佳的时机&#xff0c;可以从客户端角度看一下Redis Streams提供的功能以及如何使用它们。 免责声明&#xff1a;Redis…

权限丢失_不要让任何“账户权限”问题困扰你!

在Win10系统使用中时不时被“账户权限”问题困扰&#xff1f;别怕&#xff0c;有我呢~关闭更改系统相关设置时的通知不愿被安装软件、更改Windows设置时弹出的通知所打扰时&#xff0c;可以搜索【UAC】&#xff08;若没有搜索框&#xff0c;请使用【Win】【Q】快捷键调出&#…

python函数返回的元组_python – 从函数返回一个单独的元组元组

刚刚在Python中遇到了这样一些奇怪的事情&#xff0c;并且认为我会将其记录为一个问题&#xff0c;以防其他任何人试图用相同的无效搜索条件找到答案看起来像元组解包使得它不能返回长度为1的元组&#xff0c;如果您希望迭代返回值。虽然看起来似乎是欺骗。看到答案。>>&…