nodejs+express项目跨域问题及nodemon的安装( 记录一下问题)

1,456 阅读2分钟

我正在参加「掘金·启航计划」

1、遇到问题:当我使用本地前端项目访问本地启动的node服务时,报错404

此时的我怀疑是跨域,前端页面直接访问后端接口时,出现跨域问题;

🫢🫢🫢🫢🫢🫢🫢🫢🫢🫢🫢🫢🫢🫢

image.png

  • 解决问题: 最后我选择在在前端解决,代理地址,解决跨域!

具体实现: 在vue.config.js文件中

module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
      proxy: {
        '/api': {   // 此处的api指的是接口前缀
            target: 'http://localhost:3001',   //node.js服务器运行的地址
            ws: true,
            changeOrigin: true,
        },
    }
  })

重启项目,登录成功

image.png

2、遇到问题:在搭建express项目时,我发现当我在修改文件后,还需要重新启动项目,

在开发过程中,让我觉得觉得非常麻烦

于是在网上溜了半天发现一个非常方便的插件可以解决这个问题 nodemon 它可以实时监听文件中的变动并且重新启动。  接下来是安装指南,记录一下

1、全局安装

npm install -g nodemon

全局安装需要配置环境,使我们可以在其他文件里使用它

  • (1) 在设置里找到编辑系统环境变量

image.png

  • (2) 在弹窗中点击环境变量

image.png

  • (3) 在新弹窗里的系统变量里找到变量名为 path的这一行,双击进入

image.png

  • (4) 找到你的nodemon安装地址 bin文件夹,把文件地址复制下来

image.png

  • (5) 新建环境变量,点击弹窗内的新建按钮 image.png

  • (6) 将刚才复制的文件地址复制到这里就大功告成啦! image.png

现在我们来验证一下

nodemon -v

image.png 。。。。报错了 有被笑到.gif

  • 解决问题 : 我们可以打开PowerShell(记得要以管理员身份运行)

image.png

输入

set-ExecutionPolicy RemoteSigned

再选择'Y'

Y

最后输入

get-ExecutionPolicy

image.png

现在我们再来验证一下,非常方便!!!

image.png

问题解决!!

Suggestion.gif