Error when using GroupDocs Viewer API

@WeiKiatChua

I’ve managed to run the application you’ve attached, here is updated version of it web-api.zip (1.3 MB). After you run the app navigate to /view path and you should see the running app

What was changed:

  • ViewerApiController.cs routes has been updated
  • Angular App distribution files has been added resources\viewer\ folder
  • View.aspx has been updated to reference new files added to resources\viewer\ folder

Let us know if it works for you.

Dear vladimir,

Yes, my local project is working great now!
Thank you for your help.
The viewer looks good at our side and we shall work on the Editor now.

Regards,
WK

@WeiKiatChua

You’re welcome!

Let us know if you have any questions!

Dear vladimir,

May I know how can I update the reference in resources\viewer or \editor?

Regards,
WK

Dear vladimir,

Attached is my local projects ( added editor content ).
EditorDemoApp.zip (935.1 KB)

I am having error on the loadconfig and the GoogleAPI doesn’t load.

Regards,
WK

@WeiKiatChua

This issue has been moved to the Loadconfig and the GoogleAPI doesn’t load topic.

@WeiKiatChua

In case you need to update API endpoint you can do this either by:

  • searching for apiEndpoint= in the main.js file and updating the value there.
  • in the app.module.ts file see this comment for the complete example.
export function configServiceFactory() {
  let config = new ConfigService();
  config.apiEndpoint = "http://localhost:8080"; //Set your api endpoint here
  return config;  
}

Dear vladimir,

Sorry, I means how do I generate the file such as main.js, runtime.js and polyfills.js in the resources/viewer and resources/editor?

Regards,
WK

@WeiKiatChua

After you build Angular app you can generate distribution files. Please follow the steps in this comment to create and generate distribution files. After you execute npm run build -- --prod --output-path .\dist you’ll find main.js and other files in the dist folder.

Dear vladimir,

Thanks, I managed to build the main.js according to your comment.
Here is what I get.
building angular.PNG (13.8 KB)
resources_editor.PNG (19.0 KB)
edit_aspx.PNG (37.0 KB)

However, I still facing error when loading the edit.aspx page.
error when loading.PNG (41.2 KB)

Regards,
WK

It looks like the main reason is because fail to load the loadconfig.
loadconfig error 2.PNG (45.2 KB)

@WeiKiatChua

Please try adding [RoutePrefix("editor")] attribute to the EditorApiController class in the EditorApiController.cs file as following:

...
[RoutePrefix("editor")]
[EnableCors(origins: "*", headers: "*", methods: "*")]
public class EditorApiController : ApiController
...

This change will add all editor prefixes to all the routes in this controller.

@WeiKiatChua

Can you please clarify if you’re building Editor app?

Dear vladimir,

I still facing the same issue after adding the route prefix.loadconfig error 3.PNG (56.9 KB)
code prefix route.PNG (13.5 KB)

Yes, I am building the Editor app in the same project.

Regards,
WK

@WeiKiatChua

Please attach the sample app you have at the moment.

Dear vladimir,

Please see attached.
I remove the content in the node_modules and packages to reduce the size of the attachment.
Besides that, the editor angular file is located at client/edit/… while the client/…is referring to viewer angular file.

https://drive.google.com/file/d/19Z54vRm03knl0h78boLyvARSoubn5qGF/view?usp=sharing

Regards,
WK

@WeiKiatChua

Thank you for attaching your project file. We’ll take a look and update you.

@WeiKiatChua

The issue happens because API endpoint is set to config.apiEndpoint = "http://localhost:44324"; in app.module.ts of Editor App when the API is available over HTTPS, so to fix the issue update http://localhost:44324 to https://localhost:44324 and rebuild Angular app.

Dear vladimir,

I change the http to https and rebuild the angular by using npm run build – --prod --output-path .\dist
and copy the output to resources/editor but the error still exists.

Regards,
WK

@WeiKiatChua

May you please share the distribution files that you’ve got after rebuilding the app?