前端了解到框架-网络复习

呆呆在发呆.

于 2024-07-27 22:09:12 发布

阅读量1k

点赞数 14

文章标签： html css javascript 学习前端 maven jdk

本文链接：https://blog.csdn.net/2302_79128004/article/details/140578699

版权

前端

HTML

超文本标记语言画页面各种各样的标签组成页面进行展示桌面创建文本修改后缀即可

<!DOCTYPE html>: 声明文档类型和HTML版本。
<html>: 根标签，所有其他标签都包含在内。
<head>: 包含了文档的元数据，如字符编码、网页标题、对CSS样式表和JavaScript文件的引用等。
<title>: 定义文档的标题，显示在浏览器标签页上。
<meta>: 提供有关页面的元信息，如字符集编码、作者、视口设置等。
<body>: 包含了可见的网页内容，如文本、图片、链接、列表等。
<h1>到<h6>: 标题标签，<h1>是最高级别，用于主标题，<h6>是最低级别。
<p>: 段落标签，用于包裹文本内容。
<a>: 链接标签，用于创建指向其他页面或页面内部的链接。
<img>: 图像标签，用于在页面上显示图片。
<ul>, <ol>, <li>: 分别用于无序列表、有序列表和列表项。
<table>, <tr>, <td>: 分别用于创建表格、表格行和表格单元格。
<div>: 用于组织内容的容器，通常与CSS一起使用来布局页面。
<span>: 用于对文本的小块进行分组和应用样式，不会导致文本换行。
<form>: 用于创建表单，收集用户输入。
<input>: 输入字段，可以是文本框、复选框、单选按钮等。
<button>: 按钮标签，用户可以点击执行操作。

CSS

层叠式样式表修饰HTML页面但是静态

可以和html文件外联改变展示的外观

选择器：选择器用来指定哪些HTML元素应该应用某些样式。例如，h1选择器会选中所有<h1>元素。
属性和值：样式由属性和值组成。属性指定要改变的样式类型（如color），值指定要使用的样式（如red）。
如何引入CSS：
- 内联样式：直接在HTML元素中使用style属性定义样式。
- 内部样式表：在HTML文档的<head>部分使用<style>标签定义样式。
- 外部样式表：使用<link>标签引入外部的CSS文件。
基本样式属性：
- 颜色：color属性用于文字颜色，background-color用于背景色。
- 字体：font-family用于定义字体，font-size用于定义字体大小。
- 边距和填充：margin用于定义元素外部的空间，padding用于定义元素内部的空间。
- 布局：display属性用于定义元素的显示类型（如块级或内联），position用于定义元素的定位方式。
层叠和继承：
- 层叠：当多个样式应用于同一个元素时，CSS会根据特定的规则（如优先级）来决定哪个样式最终会被应用。
- 继承：某些CSS属性（如文字颜色）可以从父元素继承到子元素。
盒模型：每个HTML元素都可以看作一个盒子，它包括内容（content）、内边距（padding）、边框（border）和外边距（margin）。
响应式设计：使用媒体查询（@media规则）可以根据不同的屏幕尺寸应用不同的样式

JS

（JS）是一种轻量级的编程语言，主要用于网页和服务器的开发。它允许你实现复杂的功能，从而在网页上创建动态和交互式的内容。可以跟HTML文件关联动态效果

变量：变量用于存储数据值。
数据类型：包括Number、String、Boolean、Object、Array、null、undefined、Symbol（ES6新增）和BigInt（大整数）。
控制结构：JavaScript使用条件语句和循环语句（来控制程序。
函数：用于封装可重复使用的代码块。函数可以接受参数并返回值。
事件处理：JavaScript能够响应用户操作（如点击、键盘输入等），通过添加事件监听器来处理这些事件。
DOM操作：JavaScript可以通过文档对象模型（DOM）来访问和修改网页内容。DOM提供了丰富的方法和属性，用于操作HTML元素和CSS样式。
异步编程：JavaScript支持异步编程模式，Promise和async/await是处理异步操作的常用工具。
JSON：JavaScript对象表示法（JSON）是一种轻量级的数据交换格式，易于人阅读和编写，也易于机器解析和生成。
模块：ES6引入了模块的概念，允许JavaScript文件导入和导出函数、变量等，有助于组织和维护大型代码库。

Maven

设置好本地仓库和镜像阿里云仓库

下载配置好旗舰版的idea

特点

依赖管理：自动处理项目依赖，包括库的下载、版本管理和依赖冲突解决。
项目构建：编译源代码、打包二进制文件（如JAR、WAR）和生成项目文档。
项目信息管理：通过pom.xml文件管理项目的构建、报告和文档。
标准化构建过程：提供一套标准化的构建生命周期和插件体系，使得项目构建过程更加一致和可预测。
项目模板：通过Archetypes提供项目模板，快速开始新项目。
持续集成：易于与持续集成工具（如Jenkins）集成，自动化构建和测试过程。

操作

主代码放main的java里

源文件放resources里

测试代码放test里

<dependencies>后面引入所需要的包

先在本地仓库找，然后去国内镜像仓库找

框架

重复代码封装，增加便捷性。增加额外功能，是一个半成品。更好用，开发周期更短，但是更多的学习成本。

spring

方便解耦,简化开发；AOP切面编程；声明式事务；整合各种优秀的框架；

基础

创建maven文件

导入spring5.23

<dependencies>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-context</artifactId>
            <version>5.3.23</version>
        </dependency>
    </dependencies>

然后创建一个类

接着在resourses创建xml文件

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
       https://www.springframework.org/schema/beans/spring-beans.xsd">

    <!-- id:bean的名称   class:类型全限定路径 -->
    <bean id="b" class="pojo.book"></bean>

</beans>

测试一下

public class test {
    public static void main(String[] args) {
        //创建类
        ApplicationContext  context = new ClassPathXmlApplicationContext("applicationcontext.xml");
        book bo = (book)context.getBean("b");
        System.out.println(bo.getName() + "---" + bo.getId());
    }
}

属性注入

也就是给对象里面的值赋值

1.property 设值注入

会自动去找变量的set定义

<bean id="b" class="pojo.book">
        <property name="id" value="1"></property>
        <property name="name" value="huangj"></property>
    </bean>

2.constructor-arg 构造注入

这个不调用空构造器，调用有参构造器

<bean id="b2" class="pojo.book">
        <constructor-arg name="id" value="2"></constructor-arg>
        <constructor-arg name="name" value="spring"></constructor-arg>
    </bean>

3.ref 如果有类套类的话（有自定义数据类型）

使用两个bean

<bean id="boy" class="pojo.boy">
        <constructor-arg name="age" value="22"></constructor-arg>
        <constructor-arg name="name" value="autumn"></constructor-arg>
    </bean>
    <bean id="girl" class="pojo.girl">
        <constructor-arg name="age" value="25"></constructor-arg>
        <constructor-arg name="name" value="spring"></constructor-arg>
        <constructor-arg name="boyfriend" ref="boy"></constructor-arg>
    </bean>

spring注解

ioC/DI相关

@Component：

标记一个类为Spring管理的组件。Spring会自动检测并注册该类为bean。
默认名字为首字母小写
在类前面添加即可
自动放到spring容器里面

- @Autowired：
  - 自动装配bean。可以用于构造函数、字段、setter方法或其他任意方法上。
- @Qualifier：
  - 与@Autowired一起使用，用于指定注入的具体bean。
- @Resource：
  - JSR-250注解，类似于@Autowired，但可以通过名称或类型进行注入。
- @Inject：
  - JSR-330注解，类似于@Autowired，但不支持required属性。
- @Component：
  - 标记一个类为Spring管理的组件。Spring会自动检测并注册该类为bean。
- @Service：
  - 特殊的@Component，用于标记服务层的类。
- @Repository：
  - 特殊的@Component，用于标记数据访问层的类。
- @Controller：
  - 特殊的@Component，用于标记Spring MVC控制器。
- @Configuration：
  - 标记一个类为Spring配置类，类似于XML配置文件。
- @Bean：
  - 用于方法上，定义一个bean。

例子

@Component
public class girl {
    @Value("18")
    private int age;
    @Value("张黎")
    private  String name;
    @Autowired
    private boy boyfriend;

web

区别	java	web
	主要用于开发桌面应用程序、命令行工具、后台服务等。	主要用于开发基于Web的应用程序，如网站、Web服务和Web应用
	主要使用Java语言编写。	通常包括前端（HTML、CSS、JavaScript）和后端（Java、Python、PHP等）代码。
	通常生成可执行的JAR文件或WAR文件。	需要Web服务器（如Tomcat、Jetty）来运行。

idea右上角要添加tomcat服务器，并且把相应的web文件添加进去（maven内部也集成了tomcat）

springboot

快速启动

自动配置：Spring Boot 提供了大量的自动配置，减少了手动配置的工作量。只需添加依赖，Spring Boot 会自动配置相关的组件。
内嵌服务器：Spring Boot 内置了Tomcat、Jetty和Undertow等服务器，开发者无需单独配置和管理服务器。

2. 依赖管理

Starter POMs：Spring Boot 提供了一系列的Starter POMs，简化了依赖管理。只需添加一个Starter依赖，就可以引入一组相关的依赖。

3. 生产

管理：Spring Boot 提供了Actuator模块，可以轻松地监控和管理应用程序的健康状况和性能。
配置：支持通过外部配置文件（进行配置，方便在不同环境中部署。

启动

@SpringBootApplication
public class testspringbootapplication {
    public static void main(String[] args) {
        SpringApplication.run(testspringbootapplication.class,args);
    }
}

复习基础

网络原理

让两个主机可以进行通信

通过socket api

一般家用路由器，5个网口，1wan + 4lan，lan是把设备连接到局域网的，wan是连接到上级的。交换机就是拓展路由器的端口。

广域网就是把局域网连接到一起，构成的网络更加庞大。

IP地址

设备在网络上的地址，一般为4个0-255之间的十进制数字，并且使用三个点进行分隔。

端口号

区分一个主机上的不同的应用程序。是一个两个字节的整数，不同程序关联不同的端口号。一个端口号只能被一个程序绑定，但一个程序可以绑定多个端口号。1-1023一般系统有特殊用途，是知名端口号，留给常见服务器程序使用。端口号和ip往往是‘一对’。

协议

一种约定，约定了双方通信的方式。

协议分层

osi七层网络模型（只出现在教科书中） tcp/ip五层网络模型

5.应用层（程序员需要关注的一层）

上层协议能够调用下层协议，层层打包，加上分别的报头，到物理层就转换成0 1序列。

应用层根据端口号交给程序，按照程序员自定义的应用层协议展开。

协议特性

传输层提供的协议主要是tcp和udp

连接的本质是通信双方各自保存对方的意思，tcp想要通信，需要先建立连接，保存对方消息。udp要通信，直接发送数据即可，但是调用socket api要把对方位置传过去。

网络上通信，并不是百分百传达的，tcp可以知道是不是发送成功（内置了可靠传输机制），udp不可以，但是传输效率更高。

tcp以字节为单位，udp按照数据报，有严格格式。

全双工的意思的可以双向通信

网络编程

udp

服务器端口号手动指定，客户端自动分配，服务器掌控在程序员手里，是可控的。客户端不可控，所以分给系统分配更合理。

服务器端

public class server {
    private DatagramSocket socket = null;
    public server(int port) throws SocketException{
        socket = new DatagramSocket(port);//里面有就是手动指定
    }

    public void start() throws IOException {
        System.out.println("服务器启动");
        while (true){ // 服务器要长期运行
            // 读取请求并且解析
            DatagramPacket requestp = new DatagramPacket(new byte[4096], 4096);//搞一个内存保存网卡接收的数据
            socket.receive(requestp);// 读取数据，填充对象里，如果客户端没请求，就会一直receive
            // 当前完成receive，数据是二进制的形式，要转成字符串
            String request = new String(requestp.getData(),0,requestp.getLength());// 这个区间内的字节构造成string
            // 根据请求计算响应 此处返回请求即可
            String response = process(request);
            // 写回客户端 先搞一个响应对象 要指定数据内容和要发给谁
            DatagramPacket requestq = new DatagramPacket(response.getBytes(),
                    response.getBytes().length,requestp.getSocketAddress());// 前两个参数代表数据是啥 不直接用getlength怕有中文
            socket.send(requestq);
            System.out.printf("[%s:%d] rep=%s, resp=%s\n",requestp.getAddress().toString(), requestp.getPort(), request, response);// 打印日志

        }
    }
    public String process(String request){
        return request;
    }

    public static void main(String[] args) throws IOException {// 启动服务器
        server ser = new server(9090);
        ser.start();
    }
}

客户端

public class client {
    private DatagramSocket socket = null;
    private String severip = "";
    private int serverport = 0;
    public client(String ip, int port) throws SocketException {
        socket = new DatagramSocket();//自动分配端口
        // udp自身不会有对端的消息，所以要把对端的消息记录下来
        // 主要记录了ip和端口
        severip = ip;
        serverport = port;

    }

    public void start() throws IOException {
        System.out.println("客户端启动！");
        Scanner scanner = new Scanner(System.in);
        while (true){
            System.out.println("->");
            String request = scanner.next();
            // 把请求构造成对象
            DatagramPacket requestpacket = new DatagramPacket(request.getBytes(),// 指定字节缓冲区 指定inetaddress对象，包含了ip和端口
                    request.getBytes().length, InetAddress.getByName(severip),
                    serverport);
            socket.send(requestpacket);
            // 尝试读取服务器反应
            DatagramPacket responsepacket = new DatagramPacket(new byte[4096],4096);
            socket.receive(requestpacket);// 这个是读取的反应
            // 照旧转换字符串
            String response = new String(responsepacket.getData(),
                    responsepacket.getLength());
            System.out.println(response);
        }
    }
    public static void main(String[] args) throws IOException {
        client cli = new client("127.0.0.1",9090);
        cli.start();
    }
}

但是现在的服务器，只有局域网能访问，别人访问不了，所以我们就需要云服务器了。

tcp

服务器端

import java.io.*;
import java.net.*;

public class TCPServer {
    private ServerSocket serverSocket;

    public TCPServer(int port) throws IOException {
        serverSocket = new ServerSocket(port);
    }

    public void start() {
        System.out.println("服务器启动");
        while (true) {
            try {
                // 等待客户端连接
                Socket clientSocket = serverSocket.accept();
                System.out.println("客户端连接：" + clientSocket.getInetAddress() + ":" + clientSocket.getPort());

                // 处理客户端请求
                handleClient(clientSocket);
            } catch (IOException e) {
                e.printStackTrace();
            }
        }
    }

    private void handleClient(Socket clientSocket) {
        try (
            BufferedReader in = new BufferedReader(new InputStreamReader(clientSocket.getInputStream()));
            PrintWriter out = new PrintWriter(clientSocket.getOutputStream(), true)
        ) {
            String request;
            while ((request = in.readLine()) != null) {
                System.out.println("收到请求：" + request);
                String response = process(request);
                out.println(response);
                System.out.println("发送响应：" + response);
            }
        } catch (IOException e) {
            e.printStackTrace();
        } finally {
            try {
                clientSocket.close();
            } catch (IOException e) {
                e.printStackTrace();
            }
        }
    }

    public String process(String request) {
        return request;
    }

    public static void main(String[] args) throws IOException {
        TCPServer server = new TCPServer(9090);
        server.start();
    }
}

客户端

import java.io.*;
import java.net.*;
import java.util.Scanner;

public class TCPClient {
    private String serverIp;
    private int serverPort;

    public TCPClient(String ip, int port) {
        serverIp = ip;
        serverPort = port;
    }

    public void start() {
        System.out.println("客户端启动！");
        try (
            Socket socket = new Socket(serverIp, serverPort);
            BufferedReader in = new BufferedReader(new InputStreamReader(socket.getInputStream()));
            PrintWriter out = new PrintWriter(socket.getOutputStream(), true);
            Scanner scanner = new Scanner(System.in)
        ) {
            while (true) {
                System.out.print("-> ");
                String request = scanner.nextLine();
                out.println(request);
                String response = in.readLine();
                System.out.println("服务器响应：" + response);
            }
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    public static void main(String[] args) {
        TCPClient client = new TCPClient("127.0.0.1", 9090);
        client.start();
    }
}

呆呆在发呆.

关注

14
点赞
踩
15

收藏

觉得还不错? 一键收藏
0
评论
前端了解到框架-网络复习

超文本标记语言画页面各种各样的标签组成页面进行展示桌面创建文本修改后缀即可<html><head><title><meta><body><h1><h6><h1><h6><p><a><img><ul><ol><li><table><tr><td><div><span><form><input><button>
复制链接

扫一扫