随笔分类

前端(1)

随笔档案

2022年3月(1)

阅读排行榜

1. ajax学习(47)

ajax学习

一：创建项目（ajax_demo01）
二：创建两个文件
server.js:用于编写服务端代码；
ajax_demo01.html:用于编写前端页面代码。
三：引入express框架（注：Express 是一个简洁而灵活的 node.js Web应用框架, 提供一系列强大特性帮助你创建各种Web应用）
E:\ajax\ajax_demo01>npm i express

四：编写服务端代码

[// 1.引入express
const { response } = require('express');
const express = require('express');
// 2.创建应用对象
const app = express();
// 3.创建路由规则
app.get('/server', (request, response) => {
// 设置相应头，设置为允许跨域
response.setHeader('Access-Control-Allow-Origin', '*');
//设置响应
response.send('HelloWorld!');
})
// 4.监听端口启动服务
app.listen(9000, () => {
console.log('服务已启动，端口为9000');
})]
五：加载nodemon工具（用于服务端修改保存时自动重启服务器）
E:\ajax\express\ajax> npm install -g nodemon
六：编写页面代码：
[

<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ajax技术</title> <style> #result { width: 300px; height: 200px; border: 1px solid red; } </style> </head> <body> <button>这是一个按钮</button> <div id="result"></div> ]

七：启动服务器
nodemon ./server.js