angular-nuxeo : attach a blob through uploader ? - [SOLVED]

Hi,

I try to use angular-nuxeo to attach a blob, but I get excute exception.

Here is my code :

documentUploader(uid: string, file : File): IPromise<Object> { 
    let defer = this.$q.defer(); 
    let options : any = {}; 
    options.operationId = 'Blob.Attach'; 
    options.client = this.nuxeo; 
    let myUploader : any; 
    myUploader = this.nuxeoClient.uploader.execute(options)
        .params({ 
            document: uid, 
            save : true, 
            xpath: "file:content" 
        }); 
    myUploader.uploadFile(file)
    .then((resp) => {
         defer.resolve(resp); 
    }, 
    (error) => { 
        defer.reject(error); 
    } ); 
    return defer.promise;
}

How to instanciate the Uploader and then attached the blob?

Thanks for help

0 votes

8 answers

2326 views

ANSWER



If you are in an Angular (1.x) application, you should register the client as an Angular service:

...
.service('nuxeo', function() {
  return new Nuxeo({
    baseURL: 'http://localhost:8080/nuxeo/',
    auth: {
      method: 'basic',
      username: 'Administrator',
      password: 'Administrator'
    }
  });
})

And then, you can inject nuxeo in your controllers to use the client, such as other Angular services you may already use.

1 votes



Hi Thomas,

Do you have something for me about “put your application URL behind the Authentication filter” for using angular with nuxeo on jasig CAS nuxeo server?

A sample or example.

Thanks

0 votes



Hi Thomas,

I think I found a little bug for Nuxeo.auth. When instanciate like this, Nuxeo._auth is always undefined :

//Instanciation de l'Object Nuxeo de la librairie
    var nuxeoClient = new Nuxeo({
        baseURL: nuxeoUri,    
        apiPath: nuxeoApi,
            auth : {    
                 method: 'basic',    
                 username: nxUser,    
                 password: nxPwd
            },    
           //Activation du CORS    
          headers: defaultHeader
      });

So I force the Auth like this and then nuxeoClient.connect(), fetch documents successfuly ;

/*Bug authentification ??
A voir Avec ToRoger de chez Nuxeo 
*/
function forcerLAuth() {
    nuxeoClient._auth =  authentication;
}
0 votes



Registering a "nuxeo service" as below works correctly, and I can do fetch requests:

.service(&apos;nuxeo&apos;, function($q) {
    Nuxeo.promiseLibrary($q);
    return new Nuxeo({
      baseURL: &apos;http://localhost:8080/nuxeo/&apos;,
      auth: {
        method: &apos;basic&apos;,
        username: &apos;Administrator&apos;,
        password: &apos;Administrator&apos;
      }
    });
03/24/2017

So, it's not possible to use a variable directly for 'auth' ? it works fine for 'baseURL', 'apiPath' and 'headers'.
03/24/2017

Could you share your full code in a gist or something? I don't understand what you want to achieve. If nxUser and nxPwd are defined after the client being created, yes it won't work.
03/24/2017

Here is a sample of my code :

       function nuxeoService($q, cktlCommonConfig) {
        ...
       //Path API, URL et chemin du Workspace Nuxeo
        var nuxeoApi = &apos;/api/v1&apos;;
        var nuxeoPath = cktlCommonConfig.nuxeoPATH;
        var nuxeoUri = cktlCommonConfig.nuxeoURI;

          //User/pwd
          var nxUser = cktlCommonConfig.nuxeoUSER;
           var nxPwd = cktlCommonConfig.nuxeoPWD;
             //Ici no définit le header d&apos;appel de l&apos;API
             var defaultHeader = {
                    &apos;Access-Control-Allow-Origin&apos;: &apos;*&apos;,
                   &apos; Access-Control-Allow-Methods&apos;: &apos;PUT,DELETE,POST,GET,OPTIONS&apos;,
                  &apos;X-NXRepository&apos;: &apos;default&apos;,
                   &apos;X-NXenrichers.document&apos;: &apos;thumbnail&apos;,
                   &apos;X-NXDocumentProperties&apos;: &apos;*&apos;
                };

               var authentication = {
                    method: &apos;basic&apos;,
                   username: nxUser,
                   password: nxPwd
                };

                   //Instanciation de l&apos;Object Nuxeo de la librairie
                  var nuxeoClient = new Nuxeo({
                         baseURL: nuxeoUri,
                         apiPath: nuxeoApi,
                         auth : authentication,
                         //Activation du CORS
                         headers: defaultHeader
                    });
           ...
          }
03/24/2017


Hi Thomas, it works fine but I have a little problem.

When I want to fetch documents, the nuxeo server requires automation user/pwd even if I use client.connect() in my code : here is an example :

//Ici on liste tous les documents du WS DOEJ
function ListerLesDocumentsNuxeo() { 
   var defer = $q.defer();    
   //On force la connection ??    
   nuxeoClientConnect().then(function (resp) {
        console.log('Connection ok ', resp.connected);        
       nuxeoClient.operation('Document.GetChildren')            
        .input(nuxeoPath)            
        .execute()            
    .then(function (docs) {                
         defer.resolve(docs);            
     }).catch(function (error) {                
         defer.reject(error);                
         throw error;            
     });    
   });    
return defer.promise;
}

We use CAS on the nuxeo server so on client.connect(), we have this exception : Fetch API cannot load http://nuxeo.server/nuxeo/json/cmis. The request was redirected to 'https://cas.server/cas/login?service=http%3A%2F%2Fnuxeo.server%2Fnuxeo%2Fnxstartup.faces', which is disallowed for cross-origin requests that require preflight. Thanks for Help

0 votes



You should deploy your Angular application on the Nuxeo Server, and put your application URL behind the Authentication filter so that the user will need to log in through CAS before accessing the app.

You won't need any authentication on the Nuxeo Client as it will use the browser cookie.

03/24/2017

"put your application URL behind the Authentication filter", Can I have an example? Thanks
03/24/2017

You could have a look at those projects https://github.com/nuxeo-sandbox/nuxeo-angular-sample and https://github.com/nuxeo/reactjs-sample-ui/.

It's mainly about deploying your app in the nuxeo.war folder of the Nuxeo Server, and then put it behind the authentication filter, see files here: https://github.com/nuxeo-sandbox/nuxeo-angular-sample/tree/master/nuxeo-angular-sample-front/src/main/resources/OSGI-INF

03/29/2017

Hi Thomas,

Excellent.

Thx

03/29/2017


Hi,

I though that there was a module in the nuxeo js library, to declare in the main app.js and use it globaly in the angular app.

I go to follow your recommandation and create and simple .js service file and not a .ts file.

Thanks a lot for your quick reply

0 votes



Hi Thomas,

In the readMe you say :

When added to your page, `Nuxeo` is available as a global variable.
var nuxeo = new Nuxeo({ ... });

What do you mean by added to your page , I don't see ? referencing it in app.js ? I saw that there is no angular.module in the new library.

Thanks for help

0 votes



Hi,

After done 'bower install nuxeo –save' , I tried to declare 'Nuxeo' as module in app.js but got error :

Error: [$injector:nomod] Module 'Nuxeo' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

I declared in index.html ==>

nuxeo/dist/nuxeo.js

Thanks for help

0 votes



Hi,

First, you should use the last version of nuxeo-js-client that works within an Angular application, angular-nuxeo is not needed anymore. See the Angular Applications section.

Then, see the BatchUpload section, that contains a sample of exactly what you want to do “Attach an uploaded blob to a document”.

0 votes