Start a new topic

File streaming angular

How do get streaming to work for an uploaded image?



when I use the following to access an image I can see in the Kinvey console, I get a 404 error.



scope.streamFile = function(){

var promise = $kinvey.File.stream('image1');

promise.then(function(file) {

var url = file._downloadURL;

});

}


Is `image1` the `_id` of an actual image, or is it the filename? It should be the id, otherwise a 404 is returned.
It was the _id, I'm no longer getting 404 errors but I still dont see anything from the streaming.
If you want to display an image, you’d have to set the `` to the `file._downloadURL` returned from the request in your opening post.
how could I tie that to an existing column in a collection so that I can access it like that?
Take a look at the following link:

http://devcenter.kinvey.com/angular/guides/files#CreatingaKinveyFileReference



You can save a reference (similar to how you save relations with kinveyRef) to a file in a collection column. It will automatically resolve when fetching against the collection, and using the returned object you can grab and use the _downloadURL.
cool, last question hopefully but how can i set $kinvey.File.stream('image1'); to a variable instead of image1? everytime I try to use a variable I get a 404.
So here is where my code is currently, I am trying to get the file._download url to save to the collection under an existing place._id in the column img_url but it keeps creating a new row and saving it in the img_url column there instead.



$scope.streamFile = function(){

$scope.place._id;

$scope.url={};

var promise = $kinvey.File.stream($scope.place._id); // if i make this a simple name of id it

//streams but if i try this $scope it doesnt work.

promise.then(function(file) {

$scope.url = file._downloadURL;

$scope.place.img_url = $scope.url;

var iurl= {

img_url: {

_type : 'KinveyFile',

_id : $scope.place._id

}

};

var promise = $kinvey.DataStore.save('Collection', iurl);

});

}
To update, you’d have to set the `iurl._id`. Looking at your code, it seems like you want to add the url to the `$scope.place`? If so, something like the code below will do:



```

// Retrieve the file._downloadURL etc.

$scope.place.img_url = {

_type: 'KinveyFile',

_id: $scope.place._id

};

var promise = $kinvey.DataStore.save('Collection', $scope.place);

```
so I tried what you suggested:





$scope.streamFile = function(){

$scope.place._id;

var promise = $kinvey.File.stream($scope.place._id);

promise.then(function(file) {

$scope.murl= file._downloadURL;

$scope.place.img_url= $scope.url;

$scope.truck.img_url = {

_type : 'KinveyFile',

_id : $scope.place._id

};

var promise = $kinvey.DataStore.save('Collection', $scope.place._id);

});

}





however it doesn't work :( I get a 404 error.

The 404 indicates the `$kinvey.File.stream` fails. Have you actually uploaded the file with id `$scope.place._id`?
So after taking some time away from this, I am attempting to try again.

my issue is still that when I try and save, it creates an entirely new row in the collection. I found Update datastore in the kinvey references but cannot get it to work. http://devcenter.kinvey.com/angular/reference/api/Kinvey.DataStore.html

I now get ReferenceError: _id is not defined errors





var promise = $kinvey.File.upload(theFile, {

_filename : theFile.name,

public : true,

size : theFile.size,

mimeType : theFile.type



}).then(function(_fileData) { debugger;



// now it should save the file parent, and create the relationship

// using the file _id

//currently only creates a new row not appended to existing data

$scope.place._id = {

title: new Date() + " Saved Parent",

img_url: {

_type: 'KinveyFile',

_id: _fileData._id

}

};

return $kinvey.DataStore.update('Collection', $scope.place._id);
In order to update, the `$scope.place._id`, which appears to be an object, should have an `_id`. So: `$scope.place._id._id`. For example:



```

$scope.place._id = {

_id: 'foo',

title: new Date() + " Saved Parent",

img_url: {

_type: 'KinveyFile',

_id: _fileData._id

}

};

return $kinvey.DataStore.update('Collection', $scope.place._id);

```



The above would update the record with id "foo".
Thanks, unfortunately it wiped out all the other columns in Place. So I'm left with just the _id and the img_url
my collection is set up like so:

_id | img_url | name | geoloc | type

with each being $scope.place._id or $scope.place.geoloc and so on.

when I do what you suggested it blanks out the previously filled ones and only has the _id and img_url

for a simple work around I did the following,



$scope.place = {

_id: $scope.place._id,

name: $scope.place.name,

geoloc: $scope.place.geoloc,

//etc

title: new Date() + " Saved Parent",

img_url: {

_type: 'KinveyFile',

_id: _fileData._id

}

};

return $kinvey.DataStore.update('Collection', $scope.place);



but this is a really ineffective way of doing it since I will be adding other columns I am sure.

So if i could just update the img_url that would be best.



one other issue is that the uploaded image is showing as [object Object] and chrome spits out a 404 error
Login or Signup to post a comment