Open Closed

Problem generating proxies #3057


User avatar
0
jpietkiewicz_ created

Same issue as https://support.abp.io/QA/Questions/2824/An-error-occurred-while-generating-the-client-proxy-for-microserviceangular I have multiple microservice backends defined and I need to generate the proxies for the frontend.

  • ABP Framework version: v5.2.1
  • UI type: Angular
  • DB provider: EF Core
  • Tiered (MVC) or Identity Server Separated (Angular): angular

Question 1

Am I supposed to add the service names and urls to environment.ts before I run abp generate-proxy -t ng ? For example if I have two new services named "SecondService" and "ThirdService" do I make environment.ts look like this (look for my comments to indicate what I changed:

import { Environment } from '@abp/ng.core';

const baseUrl = 'http://localhost:4200';

const oAuthConfig = {
  issuer: 'https://localhost:44322',
  redirectUri: baseUrl,
  clientId: 'mvm_Angular',
  responseType: 'code',
  scope:
    'offline_access openid profile email phone AccountService IdentityService AdministrationService SaasService ProductService',
  requireHttps: true,
};

export const environment = {
  production: false,
  application: {
    baseUrl,
    name: 'mvm',
  },
  oAuthConfig,
  apis: {
    default: {
      url: 'https://localhost:44325',
      rootNamespace: 'mvm',
    },
    AbpAccountPublic: {
      url: oAuthConfig.issuer,
      rootNamespace: 'AbpAccountPublic',
    },
    ProductService: {
      url: 'https://localhost:44325',
      rootNamespace: 'mvm',
    },
 // ADDED SERVICES HERE
    SecondService: {
      url: 'https://localhost:44325',
      rootNamespace: 'mvm',
    },
    ThirdService: {
      url: 'https://localhost:44325',
      rootNamespace: 'mvm',
    },
// END OF CHANGES
  },
} as Environment;

The instructions for generating a microservice are not clear on this point.

Question 2

I am unclear what the steps are to generate proxies for multiple microservices.
I do not fully understand the steps in the support ticket I linked. Can you please walk me through the steps. I have the same problem as documented in the linked ticket. I need explicit instructions for what I need to do to generate proxies for my multiple microservices.


16 Answer(s)
  • User Avatar
    0
    gterdem created
    Support Team Senior .NET Developer

    You don't need to add extra services after ProductService. Even ProductService shouldn't be there since they are point to default service endpoint which is localhost:44325.

    To create static proxies, you can use the command like:

    abp generate-proxy -t ng -m productService -u https://localhost:44361
    

    -m indicates the microservice name and -u indicates the URL of the microservice is running at.

    This command was not working properly for angular applications, it has been fixed.

  • User Avatar
    0
    jpietkiewicz_ created

    The command still does not work:

    (base) PS C:\Users\Jpietkiewicz\repos\mvm\app\apps\angular [v1.0 ≡]
    > abp generate-proxy -t ng -m cetolresultService -u https://localhost:45011
    [14:37:39 INF] ABP CLI (https://abp.io)
    [14:37:39 INF] Version 5.2.1 (Stable)
    [14:37:40 WRN] Couldn't determinate version of "@abp/ng.schematics" package.
    [Invalid Module] Backend module "productService" does not exist in API definition.
    

    Why is it asking about productService?

    This is an urgent matter as our work is blocked.

  • User Avatar
    0
    enisn created
    Support Team .NET Developer

    Can you check /api/abp/api-definition URL and make sure your module name is included in the JSON from response. Maybe your module name is configured differently than productService.

    By the way, if you're using CLI version 5.2, -u parameter won't work. In that version it still uses environment to define URL to get api-configuration.

    You can try again after updating your CLI to 5.3.0-rc.1

    dotnet tool update -g Volo.Abp.Cli --version 5.3.0-rc.1
    

    Also Upgrage your @abp/ng.schematics package version to 5.3.0-rc.1

    //package.json
     "@abp/ng.schematics": "5.3.0-rc.1"
    
  • User Avatar
    0
    jpietkiewicz_ created

    Do you know if this issue is fixed in 5.2.2? I noticed that version is available now.

  • User Avatar
    0
    enisn created
    Support Team .NET Developer

    In the v5.2.2, you can use -u parameter but somehow -u became a required parameter. We'll fix this in 5.2.3.

    But short answer is yes you can use URL parameter in 5.2.2

  • User Avatar
    0
    jpietkiewicz_ created

    Update

    I updated to abp 5.2.2 and still have the same problem.

    abp generate-proxy -t ng -m cetolresultService -u https://localhost:45011
    

    It is still complaining about productService. This is a completely different service.

    [Invalid Module] Backend module "productService" does not exist in API definition.
    

    Epiphany

    I figured it out: abp generate-proxy appears to be reading src/app/proxy/generate-proxy.json That file only knows about productService at the moment.

    The generate proxy command is still not working when there are multiple microservices that need proxies. You cannot generate one proxy then another. If I delete the src/app/proxy/ folder I can generate proxies as expected for cetolresultService. Then, if I try to generate a proxy for product service, it complains about cetolresultService

    [Invalid Module] Backend module "cetolresultService" does not exist in API definition.
    

    **Please confirm with developers how to generate microservice proxies for multiple microservices? This is broken and needs to be fixed. ** Also, please investigate/advise how to work around this manually.

    Potential workaround until this is properly fixed

    Does the application use generate-proxy.json? If not, it looks like maybe I can delete that file, and for each service:

    • run the proxy generation
    • backup the new service's folder from the src/app/proxy/folder

    Then, when all services have had their proxy generated,

    • Put all the individual service folders back into src/app/proxy/folder
    • manually edit index.ts to include all the imports. For example:
    import * as CetolresultService from './cetolresult-service';
    export { CetolresultService };
    import * as ProductService from './product-service';
    export { ProductService };
    
    
  • User Avatar
    0
    alper created
    Support Team Director

    it would be great, if you opened the ticket as public, so that other members benefit it

  • User Avatar
    0
    jpietkiewicz_ created

    I'm fine with making this ticket public, but I can't seem to figure out how to do so.

    Have you checked with developers to see if the angular web application is using generate-proxy.json? Is that only there for the abp cli?

  • User Avatar
    0
    alper created
    Support Team Director

    it's public now!

  • User Avatar
    0
    muhammedaltug created

    Hello, You can create angular libs in the angular project for each microservice and generate proxies in related lib. In this way, proxy generation doesn't try to generate services, models, etc which were generated before. By the way, we have plans for the generating proxies to related libs as its default behavior

    You can follow the steps below to avoid this problem right now:

    Create an angular package with ng g library cetolresult-service

    Update tsconfig paths for cetolresult-service with the following in tsconfig.json

    "paths": {
        // other paths
        "cetolresult-service": ["projects/cetolresult-service/src/public-api.ts"]
      }
    

    Update your environment file for cetolresult-service with the following in environment.ts

    apis: {
        // other apis 
        CetolresultService: {
          url: 'https://localhost:45011'
          rootNamespace: 'ROOT_NAMESPACE',
        },
      }
    

    Run the generate proxy command in the angular folder. abp generate-proxy -t ng -m cetolresultService -u https://service-url --target cetolresult-service

    Update public-api.ts in packages/cetolresult-service/src/public-api.ts with following code

    // other exports
    export * from './lib/proxy';
    
  • User Avatar
    0
    jpietkiewicz_ created

    Thanks!

    Your suggestion does not work

    I made sure all services are running with run-tye.ps1 then confirmed in the tye dashboard.

    I generated the library code and made the modifications to .../apps/angular/tsconfig.json and .../apps/angular/src/environments/environment.ts

    Then I run the proxy generation command:

    abp generate-proxy -t ng -m cetolresultService -u https://localhost:45011 --target cetolresult-service
    

    fails with

    Unknown option: '--url'
    Unknown option: 'https://localhost:45011'
    

    I'm using v5.2.2. Do I need to use 5.3.0-rc.1 for your suggestion to work?

    Need examples of ng library approach in ABP microservice application

    Is there a microservice example that shows a completed implementation, i.e. the Product service, with the angular lib approach you propose? The microservice startup template (from 5.2.1) does not use this approach for the product service. I'm working/learning from the startup template and without an example I'm probably going to be lost on how to tie the pieces together.

  • User Avatar
    0
    muhammedaltug created

    Hello,

    What is your "@abp/ng.schematics" version? It seems it can't resolve the URL parameter. Can you upgrade the package version to 5.2.2? We will send an example project to your email address.

  • User Avatar
    0
    alirizaadiyahsi created

    Hi @muhammedaltug, your advice worked for me. It should be in Microservice documentation.

  • User Avatar
    0
    jpietkiewicz_ created

    Thanks!

    It looks like I had not upgraded the packages to 5.2.2 after updating the abp cli version. After abp update and a repo purge I was able to generate the proxy with the steps you provided.

    I have looked over the example you sent me and I think there are more steps I need to follow to clean out the old proxy info in tsconfig.json.

    I still have lines like this in the paths array:

          "@proxy": ["src/app/proxy/index.ts"],
          "@proxy/*": [
            "src/app/proxy/*"
          ],
    

    I'm removing those, the proxy folder, and repeating the steps for the product service that came with the template.

    It also looks like the sample you provided exports a slightly different public-api Your suggestion:

    export * from './lib/proxy';
    

    The sample application

    export * from './lib/proxy/product-service/index';
    
  • User Avatar
    0
    muhammedaltug created

    Hello,

    Both exports in public-api.ts are valid. The difference between these exports export * from './lib/proxy'; wraps a namespace for everything in lib/proxy/product-service and exports this namespace of service, the other one exports directly lib/proxy/product-service. You can use export * from './lib/proxy/product-service/index'; in this case because each library includes one microservice proxy. There will not be a conflict of service classes or interfaces

  • User Avatar
    0
    jpietkiewicz_ created

    Thank you very much!

Made with ❤️ on ABP v8.2.0-preview Updated on March 25, 2024, 15:11