为什么一个项目在idea中的配置文件设置端口号为8000，在vue中设置端口号为8080，项目可以运行成功?

        在学习一个前后端分离开发的项目中，突然发现该项目在idea的配置文件中，设置的端口号为8000

application.properties：

server.port=8000

而在vue的配置文件中，设置的项目端口号为8080：

devServer: {
    port: 8080,
    client: {
      // 当出现错误时是否在浏览器中显示全屏覆盖。默认值为true
      overlay: false
    }
  },

看到这里，我蒙蔽了，心里在想，端口号不一致项目还能运行成功？？？

赶紧问AI，安慰幼小的心灵。

---

回来了，愚蠢的问题解决啦！！！

1.两个端口号设置的不一样，只是代表着有两个不同的服务或应用程序在运行(看到这里我恍然大悟----要是前后端的端口号一样那不坏事了吗)

2.后端服务（可能是Spring Boot、Node.js等）：这个服务运行在IDEA（如IntelliJ IDEA）中，并且它的端口号在项目的配置文件（如application.properties、application.yml、server.js等）中被设置为8000。这个服务可能是REST API的提供者，负责处理数据请求和与数据库交互。

注：REST API是一种软件架构设计风格，用于创建网络数据服务。REST API 是一种基于 HTTP 协议、使用 URI（统一资源标识符）对网络资源进行标识和访问的接口规范。REST API 通常用于 Web 服务和客户端之间的通信，允许客户端从服务器请求数据或向服务器发送数据。

3.前端Vue应用: 这个Vue应用是一个单页应用程序(SPA)，它通常通过vue CLl或其他构建工具来构建和启动。它的开发服务器端口号在Vue的配置文件(如 vue.config.js）或启动命令中设置为8080。这个Vue应用负责向用户展示界面，并通过API请求与后端服务通信。

        这两个服务可以独立运行，并且它们通常在不同的端口上运行，以便它们可以同时监听请求而不会发生冲突。这是非常常见的配置，特别是当你在本地开发环境中工作时。

        当你运行这两个服务时，后端服务将监听8000端口以响应来自Vue应用的API请求，而Vue应用将监听8080端口以响应来自浏览器的HTTP请求。这允许你通过浏览器访问Vue应用(8080)（通常是http://localhost:8080），而Vue应用可以发送AJAX请求到http://localhost:8000/api/some-endpoint以获取数据。

        因此，即使你在两个不同的地方设置了不同的端口号，这并不会影响项目的成功运行，因为这两个服务是相互独立的，并且它们各自监听不同的端口。只要你的Vue应用正确地配置了API请求的URL（即使用正确的端口号），并且后端服务正在运行并监听正确的端口，那么你的项目就应该能够成功运行。

---

说真的，在查询这个问题前，我以为它很难，结果是我太蠢，基础不好，吓死银！！！！

补充：

1. 监听请求

        "监听请求" 通常指的是某个服务或应用程序正在等待并接收来自客户端的请求(也可以是前端应用来监听后端服务器来响应来自浏览器的http请求)。在网络编程中，这通常涉及到服务器套接字（sockets）的创建和绑定，以及在这些套接字上监听传入的连接或数据包。

对于REST API来说，这通常涉及以下步骤：

1. 选择端口：选择一个服务将监听的端口号。通常，HTTP服务使用80端口（对于HTTP）或443端口（对于HTTPS），但你也可以选择其他任何未被占用的端口。

2. 创建服务器：使用编程语言或框架提供的工具来创建服务器实例。例如，在Node.js中，你可能会使用http或https模块来创建一个HTTP或HTTPS服务器。

3. 绑定地址和端口：将服务器绑定到特定的IP地址和端口上。这告诉操作系统你的服务将在哪个地址和端口上监听传入的连接。

4. 监听请求：调用服务器实例的监听方法，并传入一个回调函数来处理传入的请求。这个回调函数将接收一个请求对象（包含有关请求的信息，如URL、请求头、请求体等）和一个响应对象（用于发送响应回客户端）。

5. 处理请求：在回调函数中编写代码来处理传入的请求。这可能包括解析请求头、读取请求体、查询数据库、执行计算等。

6. 发送响应：一旦请求被处理，就使用响应对象来发送一个响应回客户端。响应可以包含状态码、响应头和响应体。

        下面是一个使用Node.js和Express框架创建REST API的简单示例，该API监听3000端口上的请求：

const express = require('express');  
const app = express();  
const PORT = 3000;  
  
// 定义一个路由处理函数  
app.get('/', (req, res) => {  
  res.send('Hello, World!');  
});  
  
// 启动服务器并监听指定端口  
app.listen(PORT, () => {  
  console.log(`Server is running on port ${PORT}.`);  
});

        在这个示例中，Express框架用于简化HTTP服务器的创建和请求的处理。当服务器启动时，它会开始监听3000端口上的请求。当接收到根路径（/）的GET请求时，它会发送一个简单的文本响应回客户端。

2. REST API

REST API 的主要特点包括：

1. 基于 HTTP： REST API 使用 HTTP 协议作为客户端和服务器之间的通信协议。HTTP 提供了丰富的方法和状态码，使得 REST API 能够清晰地表达资源的状态和操作。

2. 无状态：REST API 是无状态的，即每个请求都需要包含所有必要的信息，以便服务器能够理解和处理该请求。服务器不会在多个请求之间保存任何状态信息。

3. 客户端-服务器模型：REST API 遵循客户端-服务器模型，其中客户端发送请求，服务器处理请求并返回响应。这种模型允许客户端和服务器之间的解耦，使得它们可以独立地扩展和改进。

4. 分层系统：REST API 支持分层系统，即客户端可以与中间层（如代理、网关等）进行通信，这些中间层可以隐藏系统的复杂性并增加额外的功能（如缓存、安全性等）。

5. 统一接口：REST API 遵循统一接口原则，即使用一组预定义的动词（HTTP 方法，如 GET、POST、PUT、DELETE 等）对资源进行操作。这些动词具有明确的语义，使得 API 的使用更加直观和易于理解。

6. 资源标识：REST API 使用 URI 来标识资源。URI 通常是层次化的，并遵循一定的命名约定，以便客户端能够轻松地识别和访问资源。

           REST API 的优势包括简单性、可伸缩性、可扩展性和灵活性。它们通常用于构建 Web 服务、移动应用后端、物联网（IoT）应用等场景。许多流行的 Web 服务和 API（如 GitHub API、Twitter API、Stripe API 等）都遵循 REST API 风格。