JS写文件的几种方法(浏览器内)


手机浏览器内核版本:chrome/79.0.3945.116 mobile)。
js运行在浏览器环境中时,就属于前端语言,浏览器出于安全限制,没有开放对应的主动写文件的接口,不然你上个网站,电脑里的文件都给人家删没了。

方法1、点击链接(不支持手机)

原理:模拟点击一个特殊链接(例如:http://www.w3.org/1999/xhtml),然后弹出下载框。
在这里插入图片描述

function doSave(value, type, name) {

  var blob;

  if (typeof window.Blob == "function") {

    blob = new Blob([value], {

      type: type

    });

  } else {

    var BlobBuilder = window.BlobBuilder || window.MozBlobBuilder || window.WebKitBlobBuilder || window.MSBlobBuilder;

    var bb = new BlobBuilder();

    bb.append(value);

    blob = bb.getBlob(type);

  }

  var URL = window.URL || window.webkitURL;

  var bloburl = URL.createObjectURL(blob);

  var anchor = document.createElement("a");

  if ('download' in anchor) {

    anchor.style.visibility = "hidden";

    anchor.href = bloburl;

    anchor.download = name;

    document.body.appendChild(anchor);

    var evt = document.createEvent("MouseEvents");

    evt.initEvent("click", true, true);

    anchor.dispatchEvent(evt);

    document.body.removeChild(anchor);

  } else if (navigator.msSaveBlob) {

    navigator.msSaveBlob(blob, name);

  } else {

    location.href = bloburl;

  }

}

var test = {

  a: [1, 2],

  b: [3, 4]

}

doSave(test, "text/latex", "hello.txt");

方法2 调用requestFileSystem()方法(不支持手机)

目前只支持chrome浏览器。
手机端:因为requestFileSystem()方法未定义,所以没法用;
电脑端:执行时会遇到SecurityError错误,解决:**–allow-file-access-from-files **
在这里插入图片描述

具体见 https://github.com/scscms/FileSystem

      //兼容老版本chrome
      window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
      var fileSystemObj = {
        fs: null,//文件系统对象
        size: 428800,//申请50M临时空间 50*1024*1024
        errorHandler: function (e) {
          //处理各种错误
          console.log(e.name);
        },
        initialize: function () {
          console.log("初始化");
          //初始化
          window.requestFileSystem(window.PERSISTENT, this.size, function (fs) {
            fileSystemObj.fs = fs;
            creatfile();
          }, fileSystemObj.errorHandler)
        }
      };
      if (window.requestFileSystem) {
        navigator.webkitTemporaryStorage.queryUsageAndQuota(function (usage, quota) {
          //usage已经使用的空间,quota申请的总空间
          console.log(usage,quota);
          if (!quota) {
            //还没有申请过空间
            navigator.webkitTemporaryStorage.requestQuota(fileSystemObj.size, function (grantedBytes) {
              fileSystemObj.initialize();
            }, fileSystemObj.errorHandler);
          } else {
            fileSystemObj.initialize();
          }
        });
      }
      function creatfile() {
        fileSystemObj.fs.root.getFile('log6.xlsx', { create: true, exclusive: true }, function (fileEntry) {
          console.log(fileEntry);//留意它的几个属性
          console.log(fileEntry.toURL());

          // 生成FileWriter对象
          fileEntry.createWriter(function (fileWriter) {
            fileWriter.onwriteend = function (e) {
              console.log('写入完成');
            };
            fileWriter.onerror = function (e) {
              console.log('写入失败: ' + e.toString());
            };
            //可以创建ArrayBuffer、Blob等对象写入文件,但不建议使用BlobBuilder弃用方法
            fileWriter.write(new Blob(["something"], { type: "text/plain" }));
          }, fileSystemObj.errorHandler);
        }, fileSystemObj.errorHandler);
      }

方法3、ActiveXObject(仅支持IE浏览器)

var fso;
try { 
fso=new ActiveXObject("Scripting.FileSystemObject"); 
} catch (e) { 
alert("当前浏览器不支持");
return;
} 
var f1 = fso.createtextfile("C:\\1.txt",true);
  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值