使用 Svelte 连接数据库

Posted 2023-02-22

【中文标题】使用 Svelte 连接数据库

【英文标题】：Connecting Database with Svelte

【发布时间】：2020-06-28 19:28:41

【问题描述】：

我是使用 Svelte 的新手，想使用 Svelte 创建一个订购网站。我知道我需要一个数据库来跟踪订单、客户名称、价格等。我以前使用过 mysql，但我还没有学会如何将数据库连接到网站。

如果您使用 Svelte，是否有可以使用的特定数据库？ 或者有没有办法将 MySQL 连接到 Svelte？

我在 Youtube 和 Google 上搜索过这个，但我不确定如果你使用 Svelte 是否会有所不同，所以我想确定一下。

注意：我还没有开始这个项目，所以我没有任何代码可以显示我只是想知道如果你使用 Svelte，如何连接数据库。

【问题讨论】：

你试过用谷歌搜索“Svelte db”吗？

@rleir 是的，但是我找不到任何教程或任何可以告诉我如何将数据库连接到网站的内容。

这是一个很好的视频，介绍了如何使用 firebase - firestore：youtube.com/watch?v=043h4ugAj4c 或阅读此处的教程：fireship.io/lessons/svelte-v3-overview-firebase

【参考方案1】：

您可以使用 pouchdb，它可以让您在浏览器中直接访问 indexedDB。不需要后端。

client-pouchdb 然后可以与远程 couchdb 复制/同步。这一切都可以在客户端的 svelte-app 中完成。

很容易设置。

var db = new PouchDB('dbname');

db.put(
  _id: '[e-mail]',
  name: 'David',
  age: 69
);

db.changes().on('change', function() 
  console.log('Ch-Ch-Changes');
);

db.replicate.to('http://example.com/mydb');

更多关于pouchdb.com

客户端也可以先离线保存数据，然后再连接到远程数据库。

【参考方案2】：

Svelte 是一个在浏览器上运行的前端 javascript 框架。

传统上，为了在 svelte 等前端项目（仅包含 html、css 和 js）中使用 mysql 等数据库，您必须使用单独的后端项目来执行此操作。然后，您可以在 REST api 的帮助下沟通苗条的应用程序和后端项目。这同样适用于其他前端库/框架，如 react、angular vue 等。

还有很多方法可以达到结果。由于您专注于 Svelte，因此这里的选项很少

1 Sapper

Sapper 是一个由 svelte 提供支持的应用程序框架。您还可以使用express 或polka 编写后端代码，以便连接到您选择的数据库（mysql / mongodb）

2 用户服务器少数据库

如果您希望您的应用程序简单并且只专注于苗条的应用程序，您可以使用基于云的数据库，例如 firebase。 Svelte 可以通过他们的 javascript SDK 直接与他们对话。

3 单体架构

要在后端连接 mysql，您需要使用一种服务器端应用程序编程语言，例如 nodejs (express) php 或 python 或任何您熟悉的语言。然后使用可以嵌入 svelte 应用或使用 api 将数据传递给 svelte 应用。

【参考方案3】：

因为我得到的问题主要是与后端的连接，而不是数据库。很可惜，但是苗条的应用模板无法“in box”连接后端。

那我呢，我在汇总服务器前使用 express 中间件。在这种情况下，您可以将一些请求代理到后端服务器。检查下面的代码

const proxy = require('express-http-proxy');
const app = require('express')();

app.use('/data/', proxy(
    'http://backend/data',
    
        proxyReqPathResolver: req => 
                return '/data'+ req.url;
            
        
    )
);

app.use('/', proxy('http://127.0.0.1:5000')); 
app.listen(5001);

此脚本打开了5001 端口，您将/data/ url 代理到后端服务器。并且 5000 端口仍可从汇总服务器获得。所以在http://localhost:5001/你有苗条的实例，连接到后端vi /data/ url，在这里你可以发送从数据库中获取一些数据的请求。

【参考方案4】：

我可以用 mongodb 做一个例子

你必须安装库

npm install mongodb

或添加 package.json

然后你必须创建一个连接文件，每次你需要使用 db 时都必须调用它

const mongo = require("mongodb");

let client = null;
let db = null;

export async function init() 
  if(!client) 
    client = await mongo.MongoClient.connect("mongodb://localhost");
    db = client.db("name-of-your-db");
  
  return  client, db 

有关插入的完整示例，您可以观看此视频

https://www.youtube.com/watch?v=Mey2KZDog_A