asafdav/ng-s3upload

targetFilename parameter evaluation

Opened this issue · 3 comments

Hi @asafdav ,

I'm using your module for a project at work and I've stumbled on a couple of issues regarding the targetFilename parameter.

First, when I try to use this parameter, I get some sort of an eval error; here is an example with '42.jpg':

<div
  s3-upload bucket="'MY_BUCKET'" ng-model="driver.thumbnail"
  s3-upload-options="{getOptionsUri: '/api/s3/credentials', folder: 'driver_faces/', targetFilename: '42.jpg' }">
</div>

// =>
Error: [$parse:syntax] Syntax Error: Token 'jpg' is an unexpected token at column 4 of the expression [42.jpg] starting at [jpg].

When I try a variable instead (let's say driver_id + '.jpg'), the error happens on the value of this id:

Syntax Error: Token 'd8c4a9c98445ea1ffd8f2d.jpg' is an unexpected token ...

I had a look at the code and it seems that you are actually evaluating the targetFilename parameter line 75 (scope.$eval(opts.targetFilename)); I think the error comes from there and I don't understand the need for an eval here; I think that what you get in this field has already been evaluated beforehand, and you get the right value straight Line 29 already evals what's in attrs.s3UploadOptions.

Moreover, there seems to be an issue with the folder parameter when used with targetFilename: even when present, this parameter is silently ignored. You can indeed see where the issue comes from at the same line as previously 75:

var key = opts.targetFilename ? scope.$eval(opts.targetFilename) : opts.folder + (new Date()) ...

At this line, the folder param is only used whenever no targetFilename is provided (the default case).

If these two are actual bugs, and if you are interested in a PR, I can create one.

At last, your README says npm install ng-s3upload is a way to get the library, but the module does not seem available on npm.

Best regards,

Alex

NB: I'm not an angular developer.

I too have this issue but with the bucket attribute inside the uploadFile function

scope.$eval(attrs.bucket) produces 0 no matter what. However attrs.bucket works fine

@alexjab that's crazy but you have to use "'42.jpg'", you can do this:
Your Controller:

... 
$scope.filename = "'42.jpg'";
...

Your HTML:

<div
  s3-upload bucket="'MY_BUCKET'" ng-model="driver.thumbnail"
  s3-upload-options="{getOptionsUri: '/api/s3/credentials', folder: 'driver_faces/', targetFilename: filename }">
</div>

Because ng-s3upload are using $eval in this property and $eval('42.jpg') => undefined, but $eval("'42.jpg'") => '42.jpg'.

I have this issue as well!

It's doing an eval TWICE, once when it reads the opts, then again when doing the targetFilename read which causes the error

options input using variable

Controller
    $scope.thumbnailVideoUploadOptions = {
      getOptionsUri: '/s3_access_token',
      targetFilename: "ecards/video-thumbs/#{$scope.ecard.productId}.png"
    }
HTML
<div s3-upload bucket="s3Bucket" ng-model="ecard.remoteLinkVideo"
                             s3-upload-options="thumbnailVideoUploadOptions" accept="image/png"></div>
First Eval
var opts = angular.extend({}, scope.$eval(attrs.s3UploadOptions || attrs.options));
Second Eval
var key = opts.targetFilename ? scope.$eval(opts.targetFilename) : opts.folder + (new Date()).getTime() + '-' + S3Uploader.randomString(16) + "." + ext;