我可以在为服务器提供 API 的同时提供静态文件吗？

Question

所以我对 Web 开发还很陌生，现在我和我的更多面向 Web 的朋友开始了一个项目，他把各种框架都扔给了我。我们正在做 Vuejs、jade、stylus 和 jeet。对于新手来说，这当然很混乱，因为没有 Vuejs 示例使用 jade，没有 jade 示例使用 vuejs 等。

但是，对于这个项目，我们需要一个后端来处理对谷歌地图的 api 调用、保存东西等。我们都没有这样做的经验，我尝试在 Rust 中构建它并让它与 api 部分一起工作，但我不能无法提供文件，导致我们尝试使用 http 服务器提供文件，然后从客户端对 Rust 后端进行 api 调用。这导致了一些问题，因为我们必须执行 CORS 请求（？），而我没有开始工作。

抱歉，背景很长，这一切都归结为一个问题：如何在提供静态文件的同时可以对 Google 地图进行 api 调用并将内容存储在数据库中？我发现的所有示例似乎都假设您正在使用模板来生成提供给最终用户的文件？

我如何解决这个问题？我的朋友已经完成了大部分前端工作，只需使用 npm 包“http-server”即可

Answer 1

重要部分在 app.js 文件中，确保您的服务器路由在顶部定义，然后客户端构建静态文件，如下所示。

var express = require('express');
var bodyParser = require('body-parser');
const path = require('path');

// put server express routes at the beginning //
var app = express();
var router = require('./routes')(); 
app.use('/api', router);
// put server express routes at the beginning //

//Serve the static files from the React app
app.use(express.static(path.join(__dirname, '/../build')));
// Handles any requests that don't match the ones above
app.get('*', (req,res) =>{
    console.log(res);
    res.sendFile(path.join(__dirname+'/../build/index.html'));
});

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

var port = process.env.port || 3300

app.listen(port, () => {
    console.log("Hi This port is running");
});

app.get('/', function(req, res){
    if(req.session){
        console.log(req.session);
    }
    console.log('ok');

});

同样在 package.json 文件中，

添加代理以路由它

"proxy": "http://localhost:3300",