@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
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?