Open Closed

Static JavaScript API Client Proxies #10199


User avatar
0
toan.nguyen2 created

I’m using the latest paid version of ABP to generate a microservice solution with MVC Razor Pages. In my JS file, I use this command to call the service:

var bangGiaVeNgayService = window.webCMS.kSVR.services.bangGiaVeNgays.bangGiaVeNgays;

but it doesn’t work.

With the older version of ABP, it still worked normally. Please help me resolve this issue. Does the latest ABP version still support calling services the old way like before?


24 Answer(s)
  • User Avatar
    0
    AI-Bot created
    Support Team ABP Agent
    1. Solution In recent ABP versions, the static JavaScript API proxy global namespace and loading flow have changed. The old pattern like: var bangGiaVeNgayService = window.webCMS.kSVR.services.bangGiaVeNgays.bangGiaVeNgays; will no longer work unless your solution defines the same global namespace and generates the proxies into it.

    Do this to make it work reliably in MVC Razor Pages:

    • Ensure static JS proxies are enabled and generated

      • In your Web project, add the Static JavaScript Proxy tag helper to your layout (once, typically in _Layout.cshtml, near the end of body): @await Html.PartialAsync("_AbpScripts")
      • Configure the proxy generation file abp-generate-proxy.json in the Web project (created by the template). Make sure:
        • target is set to jQuery
        • output folder is wwwroot/libs/proxy or your desired location
        • moduleName and remoteServiceName match your app service module and remote service. Example: { "type": "javascript", "module": "MyCompany.MyApp", "namespace": "myCompany.myApp", "source": { "type": "remote", "url": "https://localhost:44322", "remoteServiceName": "Default" }, "target": { "type": "jquery", "moduleName": "myCompany.myApp" }, "output": "wwwroot/libs/proxy" }
      • Run the proxy generation: abp generate-proxy or from VS Task Runner/ABP Suite if configured.
    • Use the new global namespace when calling APIs

      • The generated proxies are exposed under window.[namespace].[remoteServiceName].[service-alias].[method]
      • The default namespace is based on your configured "namespace" or "moduleName". For example, if you set namespace to myCompany.myApp and remoteServiceName to default (or your microservice name), you can call: // Example: app service BangGiaVeNgays in module MyCompany.MyApp, remoteServiceName: default var service = window.myCompany.myApp.default.bangGiaVeNgays.bangGiaVeNgays; service.getList({ /* params */ }) .then(res => console.log(res));
    • Verify the actual namespace at runtime

      • Open the browser console and type window to inspect the nested objects. Start from window.myCompany or your configured namespace to see what is actually generated (e.g., window.myCompany.myApp.default...).
      • If your older code expects window.webCMS.kSVR..., you must either:
        • Update your JS calls to the new path (recommended), or
        • Set "namespace" and "moduleName" in abp-generate-proxy.json to produce the same path structure you used before (e.g., namespace: webCMS.kSVR). Then regenerate the proxies.
    • Common pitfalls to check

      • The remote service host must be running when generating proxies from a remote source.
      • Make sure _AbpScripts partial is included once and after jQuery/abp.js are loaded.
      • Clear browser cache or use a cache-busting query string when testing (the template already appends _v=...).
      • For microservice solutions, you will have multiple remoteServiceName roots (e.g., identityService, cmsKit, default). Ensure you reference the correct one in the path: window.myCompany.myApp.identityService.... If it’s missing, either you didn’t generate the proxy for that microservice or the remoteServiceName differs from what you’re using in JS.
      • If you used dynamic proxies before, ensure you are not mixing dynamic and static references on the same page; pick one approach. When using dynamic proxies, use abp.services.app.* style, when static proxies, use the generated window.[namespace] path.
    • Minimal working example // 1) After correct proxy generation and layout setup: // window.myCompany.myApp.default.bangGiaVeNgays.bangGiaVeNgays.create({ ... }) window.myCompany.myApp.default.bangGiaVeNgays.bangGiaVeNgays .getList({ skipCount: 0, maxResultCount: 10 }) .then(result => console.log(result)) .catch(err => console.error(err));

    Does the latest ABP still support calling services like before?

    • Yes, ABP still supports Static JavaScript API Client Proxies for MVC/Razor Pages. However, the generated object path under window depends on your configuration (namespace/moduleName/remoteServiceName). If you align those settings with your previous namespace, your old-style code can continue to work. Otherwise, update your JS to the new generated path as shown above.
    1. Sources
    • Static JavaScript Proxies (MVC/Razor Pages):
      • https://abp.io/docs/latest/framework/ui/mvc-razor-pages/static-javascript-proxies
    • Dynamic JavaScript Proxies (for comparison and migration):
      • https://abp.io/docs/latest/framework/ui/mvc-razor-pages/dynamic-javascript-proxies

    This response was generated by AI. If it didn’t solve your problem, feel free to post a new answer — our support team will jump in to help you soon.

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi toan.nguyen2

    Have you created the static proxy files?

    What is the response of /abp/serviceproxyscript endpoint?

    Thanks.

  • User Avatar
    0
    toan.nguyen2 created

    !

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    Have you created the static proxy files?

    See https://abp.io/docs/latest/guides/add-module-to-microservice#using-the-static-proxy https://abp.io/docs/latest/framework/api-development/static-csharp-clients#code-generation

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: hi

    Have you created the static proxy files?

    See https://abp.io/docs/latest/guides/add-module-to-microservice#using-the-static-proxy https://abp.io/docs/latest/framework/api-development/static-csharp-clients#code-generation

    I can’t find the HttpApiClientModule. My ABP version is the latest one, and its structure does not contain any of the files described in the documentation.

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    You can run the abp generate-proxy command in your web project(localhost:44325)

    abp generate-proxy --type csharp --module YourWebCMSKSVRModuleName --url https://YourWebCMSKSVRModuleName-website-url --without-contracts

    Thanks.

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: hi

    You can run the abp generate-proxy command in your web project(localhost:44325)

    abp generate-proxy --type csharp --module YourWebCMSKSVRModuleName --url https://YourWebCMSKSVRModuleName-website-url --without-contracts

    Thanks.

    I tried it, but it didn’t work.

    Url WebCMS.Web: http://localhost:44325/ Url WebCMS.KSVR (microservice) : http://localhost:44303/

    From WebCMS.Web, I’m calling a service in WebCMS.KSVR.

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: hi

    You can run the abp generate-proxy command in your web project(localhost:44325)

    abp generate-proxy --type csharp --module YourWebCMSKSVRModuleName --url https://YourWebCMSKSVRModuleName-website-url --without-contracts

    Thanks.

    help me please!

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    : Module name: webCMSwebModule is invalid

    You can check all modules at http://localhost:44303/api/abp/api-definition

    Then generate a proxy again

    abp generate-proxy --type csharp --module NewModuleName --url http://localhost:44303 --without-contracts

    Thanks

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: hi

    : Module name: webCMSwebModule is invalid

    You can check all modules at http://localhost:44303/api/abp/api-definition

    Then generate a proxy again

    abp generate-proxy --type csharp --module NewModuleName --url http://localhost:44303 --without-contracts

    Thanks

    this is data in http://localhost:44303/api/abp/api-definition

    Please help me write the correct command.

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    abp generate-proxy --type csharp --module ksvr --url http://localhost:44303 --without-contracts

    After that, run the WebCMS.Web: http://localhost:44325/ and check abp/serviceproxyscript endpoint

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: hi

    abp generate-proxy --type csharp --module ksvr --url http://localhost:44303 --without-contracts

    After that, run the WebCMS.Web: http://localhost:44325/ and check abp/serviceproxyscript endpoint

    ok nice ! Thank you very much

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    : )

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: : )

    :v I mistakenly thought the Module Name was the name of the .cs file. :((

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    ok, you can continue to test it.

    Thanks.

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: ok, you can continue to test it.

    Thanks.

    I continued running the application and was able to call var bangGiaVeNgayService = window.webCMS.kSVR.services.bangGiaVeNgays.bangGiaVeNgays; but now I’m getting this error. Please help me with this.

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    Please zip your static proxy files and appsettings.json of WebGateway to liming.ma@volosoft.com

    Thanks.

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: hi

    Please zip your static proxy files and appsettings.json of WebGateway to liming.ma@volosoft.com

    Thanks.

    I found the cause. Thank you. :D

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    Great

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    Same command, it will maintain the proxy files.

    abp generate-proxy --type csharp --module ksvr --url http://localhost:44303 --without-contracts

    Thanks.

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: Great

    Hi Maliming, Every time I make changes to the KSVR service, I have to run the command abp generate-proxy --type csharp --module ksvr --url http://localhost:44303 --without-contracts to regenerate the Client Proxies. Is there any way to generate them automatically whenever changes are made, or is it mandatory to run the command manually?

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    Currently, you need to generate them manually if your API has changed.

    Thanks.

  • User Avatar
    0
    toan.nguyen2 created

    [maliming] said: hi

    Currently, you need to generate them manually if your API has changed.

    Thanks.

    ok Thanks.

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    : )

Boost Your Development
ABP Live Training
Packages
See Trainings
Mastering ABP Framework Book
The Official Guide
Mastering
ABP Framework
Learn More
Mastering ABP Framework Book
Made with ❤️ on ABP v10.1.0-preview. Updated on December 10, 2025, 12:02
1
ABP Assistant
🔐 You need to be logged in to use the chatbot. Please log in first.