Question

我使用ng-file-upload将图片上传到我的网络服务器。

一旦用户选择文件然后我们将它们显示在轮播中，用户就可以手动将它们上传到服务器（通过提交按钮）。

某些图像未显示在旋转木马中。所述图像仍然可以上传到服务器并显示在前端，也就是说，预览中未显示的图像正在上传并在图库中显示（可以看到图像）。

图像的ng-file-upload输出模型有所不同，预览中显示的图像成功包含了人们的期望：

 {
"$ngfBlobUrl": "blob:http%3A//localhost%3A4567/50df9cf5-1962-4903-8c82-02c847aadd16",
"$ngfWidth": 719,
"$ngfHeight": 837,
"$ngfDataUrl": "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAICAgICAQICAgIDAgIDAwYEAwMDAwcFBQQGCAcJCAgHCAgJCg0LCQoMCggICw8LDA0ODg8OCQsQERA...(the rest has been removed)
 }

未在预览中显示但仍能成功上传（并在下载后显示在前端）的图片有如下模型（从ng-file-upload提供）：

 {
    "$ngfName": "P9140214.jpg"
 }

因此，在预览HTML中使用＆＃39; $ ngfBlobUrl＆＃39;将这些内容预览为img标记是有意义的。作为图像的src属性。

如果我将提出问题的图片上传到常规输入类型=＆＃34; file＆＃34;并使用FileReader API预览它（将其转换为base64 ..）然后显示就好了。

有没有人遇到这样的事情？

如果我进入文件系统，有问题的图片有一些属性，其他图像＆＃39;不要，如：

＆＃39;设备制作＆＃39;，＆＃39;设备型号＆＃39;，＆＃39;颜色配置文件＆＃39;，＆＃39;焦距＆＃39;，＆＃39;红眼＆＃39;，＆＃39; F号＆＃39;，＆＃39;曝光计划＆＃39;，＆＃39;曝光时间＆＃39;

所以在Mac上，我已右键点击图片并选择了更多信息＆＃39;看到这些属性。

服务器如何获取此图像的图像数据？！

Answer 1

我最后要解决的问题是添加＆＃39; ngf-change＆＃39;调用ng-file-upload指令并检查＆＃39; ngfBlobUrl＆＃39;在场。

define([
    'cordova',
    'logs'
], function () {
    SQLiteDB = function () {
        var self = this;
        this.dbName = 'AppDb.s3db';
        this.db = null;

        /*
            Populate database
        */
        this.openDatabase = function (callback) {
            this.db = sqlitePlugin.openDatabase({
                name: this.dbName, location: 2, createFromLocation: 1
            });

            this.db.transaction(
                function (tx) {
                    tx.executeSql('CREATE TABLE IF NOT EXISTS myDB(pax_id integer primary key, user_token text)');

                    if (typeof callback == 'function') {
                        callback.call();
                    }
                },
                this.dbErrorHandler
            );
        },
        this.addLoginDetail = function (pax_id, user_token, successCallback) {
            var that = this;

            if (!this.db)
                this.openDatabase();

            that.db.transaction(
                function (tx) {  
                    tx.executeSql("INSERT INTO myDB (pax_id, user_token) VALUES (?,?)", [pax_id, user_token], function (tx, res) {
                        console.log("Save device config to local database");
                        Logs.logWrite("Save device config to local database");

                        if (typeof successCallback == 'function') {
                            var config_settings = null;
                            config_settings = JSON.parse(val.CONFIG_SETTINGS);
                            config_settings.LAST_UPDATE_TIME = lastUpdateTime;

                            if (!config_settings.APP_TYPE)
                                config_settings.APP_TYPE = 'D';

                            successCallback.call(config_settings);
                        }

                    });          
                },
                that.dbErrorHandler
            )
        }

        this.getLoginDetail = function (successCallback) {
            var that = this;
            console.log('call Login detail in local database');
            Logs.logWrite('call getEmployee in local database');

            if (!this.db)
                this.openDatabase();

            this.db.transaction(
                function (tx) {
                    tx.executeSql("SELECT pax_id, user_token from myDB;", [],
                        function (tx, res) {
                            if (typeof successCallback == 'function') {
                                var employee = null;
                                var config_settings = null;
                                if (res.rows.length > 0) {
                                    config_settings = JSON.parse(res.rows.item(0).config_settings);
                                    console.log("dbLogin =============>> " + JSON.stringify(config_settings));
                                    employee = res.rows.item(0);
                                }
                                successCallback.call(config_settings);
                            }
                        },
                        that.dbErrorHandler
                    )
                },
                that.dbErrorHandler
            );
        }
    }
    return SQLiteDB;
});

这个工作，图像现在在预览中呈现给我，并上传OK。

ng-file-upload输出模型只包含$ ngfBlobName，但文件上传很好

1 个答案: