I am building an app in Ionic and can not find any examples let alone documentation that allows me to use DreamFactory with an Ionic app, Every time I follow the quick snip here, https://github.com/dreamfactorysoftware/angular-dreamfactory it just makes my app display blank as soon as I start with just the first step.
1 Like
Use your console to determine the error that is thrown when the display is blank. E.g., if you are seeing a 404, then you’re not properly including the content. Either way, post back with the actual error messages and let’s go from there.
when trying to inject it into my app.js file it cause my app to stop functioning.
var App = angular.module(‘App’, [‘ionic’, ‘ngResource’, ‘ngDreamFactory’])
I just can’t get past this.
If an error is not coming back to you from the DSP or in the browser console, it would seem the error’s not being thrown by the DSP.
I am successfully using DF in my ionic app, although it took a while.
Have you defined the constants:
angular.module('starter', ['ionic', 'ngDreamFactory'])
.constant('DSP_URL', 'https://your-df-url.com')
.constant('DSP_API_KEY', 'your-app-API-name')
Also, i had problems with DF not being ready. So I had to do this in the controller:
.controller('AppCtrl', ['$scope', '$sce', 'DreamFactory', function($scope, $sce, DreamFactory) {
$scope.init = function () {
if (DreamFactory.isReady()) {
$scope.$broadcast('doDF');
}
};
$scope.$on('api:ready', function (e) {
$scope.$broadcast('doDF');
});
// GET content from Dream factory now
$scope.$on('doDF', function () {
DreamFactory.api.your-service-API-name.your-service(
//success function
function(result) {
console.log(result);
},
//error function
function(error) {
}
);
Obviously you need to have it set up correctly in DF as well. It took some fiddling for me but got it eventually and its so easy once its set up!!
Where can i find the ngDreamFactory?
I found the script here:
https://github.com/milo-hyben/angular-dreamfactory
There’s some useful info there as well. But the main thing to do is put the angular-dreamfactory.js in your files and link to it in your index.html:
<script src="lib/angular-dreamfactory/angular-dreamfactory.js"></script>
Hope that helps.
“.constant(‘DSP_API_KEY’, ‘your-app-API-name’)”
Do I put the name of my API here or the API key? I am rather confused
In Dream Factory, under Apps, its the value in the ‘API Name’ column.
What I have done is create a role called ‘Admin’ and given it access to all my services with all verbs, and then ticked the checkbox next to my dream factory app under the ‘Apps’ tab. You can then assign a user to this role and then when you log in as that user from your ionic app, you should have access. I was allowing guest users as well (in the config area) to test without having to log in, You can set up the guest role to allow all services etc as well.
Also as a side note, have you got CORS open (lots of *s) because that could stop you connecting.
Does that make sense? Hope so, good luck!
Ok, I’m sorry to bombard you with images of my config but I think it’s in order.
Role (1)
Role (2)
App
Cors
Hey guys. I don’t know anything about Ionic, but if this is for DreamFactory 2.x you need to be sending the API Key, not the App Name.
And the header is X-DreamFactory-API-Key, not the older X-DreamFactory-Application-Name.
Should DSP_URL be “http://serverloc.com/api/v2”
And should it be http or https or does that even matter?
No sure about the DSP_URL. It looks like you’re using code that was designed for DF 1.x
If it helps, in DF 2.x all calls follow the format http[s]://{dreamfactory_site_url}/api/v2/{service name}/{resourece}/{component}
htttp vs https is irrelevant as far as DreamFactory is concerned. It’s all about how your web server is set up. If you’re using one of the Bitnami images/packages, those default to being configured for http only.
1 Like
I know you aren’t familiar with Ionic but should this tutorial work for Ionic?
I can’t think of any reasons why it wouldn’t but I said I would ask first.
Sorry to be so ignorant – Does Ionic use Angular?
If yes, it makes sense to me that would work. We did write that blog after all =)
Yeah it does, ok I’m going to try implement it there now. I will let you know if it works out for me. Cheers for the responses!
1 Like
Ok it works!
If I have time over the weekend I’ll put together a little guide for anybody else that gets stuck with this.
1 Like
awesome. Thanks for investing in the community!
Needs a code review but here it is.
I wasn’t sure how to only allow users who are logged in and have a session token to access my REST API?
At the moment, it only requires the API key to access it.
1 Like