静态资源访问_静态资源访问接口-CSDN博客

本文链接：https://blog.csdn.net/weixin_49857754/article/details/129786741

demo/index.js

const box = document.querySelector('#box');
box.textContent = '测试'
const xml = new XMLHttpRequest();
xml.open('GET','/user')
xml.send()
xml.onreadystatechange = (res)=>{
  if(xml.readyState === 4 && xml.status === 200) {
    //{content: '这是测试数据，接口调取成功', name: 'hml'}
    console.log(JSON.parse(xml.responseText))
  }
}

demo/index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <div id="box">
  </div>
</body>
</html>
<link rel="stylesheet" href="index.css">
<script src="index.js" type="module">
</script>

demo/index.css

#box{
    width: 100px;
    height: 100px;
    background-color: purple;
}

node.js

const express = require('express')
const app = express();
// 静态资源访问 express.static();
app.use(express.static('./demo'))
// app.use(express.static('./demo1')) 多个访问会默认加载第一个的index文件
// app.use('/demo',express.static('./demo')) 前缀访问文件目录
app.get('/user',(req, res)=>{
  res.send({
    content:'这是测试数据，接口调取成功',
    name:'hml'
  })
})
app.listen('80',()=>{
  console.log('express server running at http:127.0.0.1')
})