AJAX请求本地Express服务报CORS错误，求正确GET请求URL

• 修正接口路径匹配错误
  前端AJAX请求的URL为http://localhost:3000/api/groceries，但后端Express定义的GET接口路径为/api/grocery，前者单词结尾多了字母s，二者不匹配。将AJAX配置中的url参数修改为http://localhost:3000/api/grocery即可解决路径问题。
• 解决CORS跨域拦截问题
  你当前看到的CORS报错是因为前端页面运行在http://127.0.0.1:5501，后端服务运行在http://localhost:3000，域名、端口均不一致，属于跨域请求，被浏览器安全策略拦截。可在后端服务中添加跨域配置，操作如下：
  方案1：使用cors依赖包
  先执行安装命令：
  npm install cors
  然后修改服务端代码，在路由定义前引入并启用cors：

  const express = require('express')
  const cors = require('cors')
  const app = express()
  app.use(cors()) // 全局启用跨域配置
  // 后续原有路由、监听代码保持不变
  

  方案2：手动添加跨域响应头
  无需额外安装依赖，直接在服务端路由定义前添加如下中间件：

  app.use((req, res, next) => {
    // 测试环境可直接设置为*，生产环境建议替换为你的前端实际地址http://127.0.0.1:5501
    res.header('Access-Control-Allow-Origin', '*')
    res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
    res.header('Access-Control-Allow-Headers', 'Content-Type')
    if (req.method === 'OPTIONS') return res.sendStatus(200)
    next()
  })
  

完成以上两步修改后，GET请求即可正常拿到返回数据。

内容的提问来源于stack exchange，提问作者Letscode