7. Cordova文件操作和IO

最新推荐文章于 2022-02-21 15:58:22 发布

世外大帝

最新推荐文章于 2022-02-21 15:58:22 发布

阅读量1.8k

点赞数 2

分类专栏： -----Android----- -----前端----- Cordova开发文章标签： java html cordova web android

本文链接：https://blog.csdn.net/lftaoyuan/article/details/72733745

版权

-----Android----- 同时被 3 个专栏收录

91 篇文章 6 订阅

订阅专栏

-----前端-----

39 篇文章 1 订阅

订阅专栏

Cordova开发

10 篇文章 1 订阅

订阅专栏

前言

这里学完了基本就告一段落了,文件操作按照原生来说，是需要一定权限的，这里就直接在root目录进行操作，存储位置位于内置app包名目录下。

这里代码已经写好了，今天要转java去写后台了，估计没时间写文档了，直接贴代码吧

构建

安装插件
cordova plugin add cordova-plugin-file

HTML代码

<!doctype html>
<html>
<head>
    <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
    <meta name="format-detection" content="telephone=no">
    <meta charset="utf-8" />
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
    <link rel="stylesheet" type="text/css" href="css/index.css">
</head>
<body>

<div class="app">
<h1>文件操作</h1>
    <div id="deviceready" class="blink">
        <p class="event listening">Connecting to Device</p>
        <p class="event received">Device is Ready</p>
    </div>
<button id = "createFile">建</button>
<button id = "writeFile">写</button>
<button id = "readFile">读</button>
<button id = "removeFile">删</button>
<button id="nextPage">NEXT PAGE</button>
<textarea id = "textarea"></textarea>
</div>


<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/file_manager.js"></script>
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>

</body>
</html>

JS代码

var app = {

    initialize: function () {
        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
    },

    // deviceready Event Handler
    //
    // Bind any cordova events here. Common events are:
    // 'pause', 'resume', etc.
    onDeviceReady: function () {
        var datas=null;
        var filePath = "";
        var fileName = "";

        this.receivedEvent('deviceready');

        document.getElementById("createFile").addEventListener("click", createFile);
        document.getElementById("writeFile").addEventListener("click", writeFile);
        document.getElementById("readFile").addEventListener("click", readFile);
        document.getElementById("removeFile").addEventListener("click", removeFile);
        document.getElementById("nextPage").addEventListener("click", nextPage);

        function createFile() {
            //设置类型 [TEMPORARY , PERSISTENT]
            var type = window.TEMPORARY;
            //设置大小
            var size = 5 * 1024 * 1024;
            //请求文件系统 ,参数直接看下面
            window.requestFileSystem(type, size, successCallback, errorCallback)
            //创建一个hello.txt文件,存到到根目录
            function successCallback(fs) {
                fs.root.getFile('hello.txt', {create: true, exclusive: true}, function (fileEntry) {
                    console.log('successfull!')
                }, errorCallback);
            }

            function errorCallback(error) {
                alert("未创建成功:" + error)
            }

        }


        function writeFile() {
            var type = window.TEMPORARY;
            var size = 5 * 1024 * 1024;

            window.requestFileSystem(type, size, successCallback, errorCallback)

            function successCallback(fs) {

                fs.root.getFile('hello.txt', {create: true}, function (fileEntry) {
                    //在本FileEntry中创建一个和文件关联的FileWriter方法
                    fileEntry.createWriter(function (fileWriter) {
                        fileWriter.onwriteend = function (e) {
                            alert("写入成功！");
                        };

                        fileWriter.onerror = function (e) {
                            alert("写入失败：" + e.toString());
                        };
                        //获取文本框中的值
                        var blob = new Blob([$(document).ready(function () {
                            $("#textarea").val();
                        })], {type: 'text/plain'});
                        //想文件中写数据
                        fileWriter.write(blob);
                    }, errorCallback);

                }, errorCallback);

            }

            function errorCallback(error) {
                alert("ERROR: " + error.code)
            }

        }

        function readFile() {
            var type = window.TEMPORARY;
            var size = 5 * 1024 * 1024;

            window.requestFileSystem(type, size, successCallback, errorCallback)

            function successCallback(fs) {

                fs.root.getFile('hello.txt', {}, function (fileEntry) {

                    fileEntry.file(function (file) {
                        //创建文件输入流
                        var reader = new FileReader();
                        //读完数据赋值给文本域
                        reader.onloadend = function (e) {
                            var txtArea = document.getElementById('textarea');
                            txtArea.value = this.result;
                        };
                        //从关联文件中读数据
                        reader.readAsText(file);

                    }, errorCallback);

                }, errorCallback);
            }

            function errorCallback(error) {
                alert("ERROR: " + error.code)
            }

        }

        function removeFile() {
            var type = window.TEMPORARY;
            var size = 5 * 1024 * 1024;

            window.requestFileSystem(type, size, successCallback, errorCallback)

            function successCallback(fs) {
                fs.root.getFile('hello.txt', {create: false}, function (fileEntry) {

                    fileEntry.remove(function () {
                        alert('File removed.');
                    }, errorCallback);

                }, errorCallback);
            }

            function errorCallback(error) {
                alert("ERROR: " + error.code)
            }

        }

        function nextPage() {
            location.href = "callActivity.html";
        }

    },


    // Update DOM on a Received Event
    receivedEvent: function (id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    }

};

app.initialize();

JS代码的另一种简单模式，点击下一页之后的js代码



    // Wait for device API libraries to load
    //
    function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
    }

    // device APIs are available
    //
    function onDeviceReady() {
        // Now safe to use device APIs
        alert("设备准备就绪，给你看个空页面！");
    }