NodeJS/ReactJS：為移動瀏覽器創建帶有字符串的可下載文件

Question

我想在前端創建一個 vCard 並使其可在 ReactJs 項目中下載（通過單擊按鈕）。 我使用了一個名為vcards-js模塊，它創建了一個包含所需 vCard (v3.0) 內容的字符串。 我正在努力解決的問題是使其可下載（as.vcf 文件）。 我試圖通過模塊react-file-download和file-saver來實現這一點，但它們都不能正常工作。 最后一個在桌面上運行良好，但無法從移動瀏覽器提供下載。 Chrome 手機打開了一個新標簽並永久加載，Safari 手機只是在新的點擊中打開了字符串，但沒有將其下載為 .vcf 文件。

有什么線索或經驗嗎？ 我需要創建 vCard 服務器端並提供下載鏈接嗎？ 對我來說似乎太迂回了。

如果有幫助，這是我的file-saver方法：

var FileSaver = require('file-saver');
    var blob = new Blob([card.getFormattedString()], {type: "text/x-vCard;charset=iso-8859-1"});
    FileSaver.saveAs(blob, 'card.vcf');

Answer 1

我正在查看 vcardjs https://github.com/enesser/vCards-js上的文檔

你必須在節點上的后端有一條路由來處理這個過程

它看起來很直觀 //save to file vCard.saveToFile('./eric-nesser.vcf');

Answer 2

通過使用以下代碼生成 vcf blob，我能夠使其在 vue.js 上工作

var vcfBlob = new Blob(vcfBytes.split('\n').map(function(x) { return x + '\n' }));

然后將該 blob 傳遞給文件保護程序

saveAs(vcfBlob, "hello world.vcf")

Answer 3

您可能想嘗試在后端使用 NodeJS / TS 包生成它： npm/ez-vcard ； GitHub/Maxim-Mazurok/ez-vcard

另外，請參閱自述文件和示例以了解用法。