如何在无服务器框架中使用jquery?

时间:2017-07-24 11:27:01

标签: javascript jquery lambda aws-lambda serverless-framework

我想在我的无服务器lambda项目中使用jquery延迟方法。然而,在要求jquery& jquery-ui作为依赖项,当我尝试使用jquery库时会发生以下错误?我是无服务器和lambda的新手,所以请看下面的handler.js函数。

import com.itextpdf.text.Document;
import com.itextpdf.text.Image;
import com.itextpdf.text.pdf.PdfWriter;

String dirpath;
public void layoutToImage(View view) {
    // get view group using reference  
    relativeLayout = (RelativeLayout) view.findViewById(R.id.print);
    // convert view group to bitmap
    relativeLayout.setDrawingCacheEnabled(true);
    relativeLayout.buildDrawingCache();
    Bitmap bm = relativeLayout.getDrawingCache();
    Intent share = new Intent(Intent.ACTION_SEND);
    share.setType("image/jpeg");
    ByteArrayOutputStream bytes = new ByteArrayOutputStream();
    bm.compress(Bitmap.CompressFormat.JPEG, 100, bytes);

    File f = new File(Environment.getExternalStorageDirectory() + File.separator + "image.jpg");
    try {
        f.createNewFile();
        FileOutputStream fo = new FileOutputStream(f);
        fo.write(bytes.toByteArray());
    } catch (IOException e) {
        e.printStackTrace();
    }

}
public void imageToPDF() throws FileNotFoundException {
    try {
        Document document = new Document();
        dirpath = android.os.Environment.getExternalStorageDirectory().toString();
        PdfWriter.getInstance(document, new FileOutputStream(dirpath + "/NewPDF.pdf")); //  Change pdf's name.
        document.open();
        Image img = Image.getInstance(Environment.getExternalStorageDirectory() + File.separator + "image.jpg");  
        float scaler = ((document.getPageSize().getWidth() - document.leftMargin()
                - document.rightMargin() - 0) / img.getWidth()) * 100; 
        img.scalePercent(scaler);
        img.setAlignment(Image.ALIGN_CENTER | Image.ALIGN_TOP);
        document.add(img);
        document.close();
        Toast.makeText(this, "PDF Generated successfully!..", Toast.LENGTH_SHORT).show();
    } catch (Exception e) {

    }
}

handler.js

TypeError: $.each is not a function
at /vagrant/project/node_modules/jquery-ui/ui/widget.js:690:3
at widgetUuid (/vagrant/project/node_modules/jquery-ui/ui/widget.js:24:3)
at Object.<anonymous> (/vagrant/project/node_modules/jquery-ui/ui/widget.js:26:2)
at Module._compile (module.js:569:30)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (module.js:503:32)
at tryModuleLoad (module.js:466:12)
at Function.Module._load (module.js:458:3)
at Module.require (module.js:513:17)
at require (internal/module.js:11:18)
at Object.<anonymous> (/vagrant/project/handler.js:4:19)
at Module._compile (module.js:569:30)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (module.js:503:32)
at tryModuleLoad (module.js:466:12)
at Function.Module._load (module.js:458:3)
at Module.require (module.js:513:17)
at require (internal/module.js:11:18)
at AwsInvokeLocal.invokeLocalNodeJs (/usr/local/lib/node_modules/serverless/lib/plugins/aws/invokeLocal/index.js:156:33)
at AwsInvokeLocal.invokeLocal (/usr/local/lib/node_modules/serverless/lib/plugins/aws/invokeLocal/index.js:114:19)
at AwsInvokeLocal.tryCatcher (/usr/local/lib/node_modules/serverless/node_modules/bluebird/js/release/util.js:16:23)
at Promise._settlePromiseFromHandler (/usr/local/lib/node_modules/serverless/node_modules/bluebird/js/release/promise.js:512:31)
at Promise._settlePromise (/usr/local/lib/node_modules/serverless/node_modules/bluebird/js/release/promise.js:569:18)
at Promise._settlePromise0 (/usr/local/lib/node_modules/serverless/node_modules/bluebird/js/release/promise.js:614:10)
at Promise._settlePromises (/usr/local/lib/node_modules/serverless/node_modules/bluebird/js/release/promise.js:693:18)
at Async._drainQueue (/usr/local/lib/node_modules/serverless/node_modules/bluebird/js/release/async.js:133:16)
at Async._drainQueues (/usr/local/lib/node_modules/serverless/node_modules/bluebird/js/release/async.js:143:10)
at Immediate.Async.drainQueues (/usr/local/lib/node_modules/serverless/node_modules/bluebird/js/release/async.js:17:14)
at runCallback (timers.js:800:20)
at tryOnImmediate (timers.js:762:5)
at processImmediate [as _immediateCallback] (timers.js:733:5)

model.js

'use strict';

global.jQuery = require('jquery');
global.jQueryUI = require('jquery-ui');

var Model = require('./resources/model');

module.exports.project =  function(event, context, callback) {
    Model.init();
};

的package.json

var JsonFile = require('jsonfile');
var $ = global.jQueryUI;

module.exports = {
    init : function() {
        var self = this;

        self.fetch_file().done(function(file){
             console.log(file);
        });
    },

    fetch_file : function(){
        var deferred = $.Deferred();
        JsonFile.readFile('path to file', function (err, file) {
            deferred.resolve(file);
        });

        return $.when(deferred).promise();
    }
};

在要求Jquery而不是JqueryUI后,我得到了这个异常:

{
"private": true,
  "dependencies": {
    "avro-js": "^1.8.2",
    "aws-sdk": "^2.88.0",
    "jquery": "^3.2.1",
    "jquery-ui": "^1.12.1",
    "jsonfile": "^3.0.1"
  },
  "name": "project",
  "version": "0.1.0"
}

2 个答案:

答案 0 :(得分:2)

当我特别需要jquery-deferred模块时问题已解决,可在此处找到:https://www.npmjs.com/package/jquery-deferred

答案 1 :(得分:0)

你把jQuery与jQuery UI搞混了。在你的model.js中,替换:

var $ = global.jQueryUI;

使用:

var $ = global.jQuery;

Deferred是一个jQuery方法,而不是jQuery UI功能。