Angular Bug: 'Add Xtreme Code' Feature Fails to Load Channels and VOD - URL Formatting and Functionality Issues

[warebytes]

Describe the bug The "Add Xtreme Code" feature in the Angular version of IPTVnaor is not functioning correctly. When attempting to use this feature, the browser displays a perpetual loading icon, and the list of channels and VOD (Video on Demand) content fails to load. Notably, the same servers used for testing this functionality in the Windows release of the application work as expected. This issue occurs in the latest release, v0.15.0.

To Reproduce Steps to reproduce the behavior:

1. Open the IPTVnator Workspace in VSCode Terminal.
2. Run the command: ng serve -c dev
3. The application loads correctly.
4. Navigate to the "Add Xtreme Code" feature, input the necessary playlist details, and click "Save."
5. The application displays a perpetual loading icon and fails to proceed.

Additional Information:

6. While inspecting the issue using Chrome Browser's developer tools, an ERR_CONNECTION_REFUSED error is identified on the Request URL for "action=get_vod_categories."
7. It's observed that the URL constructed by the application appears to be incorrect: http://localhost:3000/xtream?url=http://dummy.url.com:PORT&password=pa55w0rd&username=dummyuser&action=get_vod_categories.
   • This format differs from the expected Xtream API call: http://dummy.url.com:PORT/player_api.php?password=pa55w0rd&username=dummyuser&action=get_vod_categories.
   • There's uncertainty whether the request will be successful with the URL format: "http://dummy-deploymenturl.com/xtream?url=...".

Expected behavior When using the "Add Xtreme Code" feature in the Angular version of IPTVnaor, the application should:

1. Allow users to input playlist details and click "Save" without issues.
2. Successfully process the request and load the channels and VOD (Video on Demand) content associated with the Xtreme Code.
3. No perpetual loading icon should be displayed, and the application should respond promptly.
4. The constructed URL for the Xtream API call should follow the expected format: http://dummy.url.com:PORT/player_api.php?password=pa55w0rd&username=dummyuser&action=get_vod_categories.
5. The application should establish a connection without encountering the ERR_CONNECTION_REFUSED error.
6. The user should not experience issues related to URL formatting, and the request should be successfully executed.

Browser information

• Browser [Chrome]
• Version [Version 119.0.6045.105 (Official Build) (64-bit)]

Additional context Upon troubleshooting the issue and tweaking the code responsible for URL formatting in "iptvnator/src/app/xtream/xtream-main-container.component.ts," I made the following observations:

1. The code snippet responsible for sending the request constructed the URL as expected, like so:

   "http://dummy.url.com:PORT/player_api.php?password=pa55w0rd&username=dummyuser&action=get_vod_categories"

2. Despite the code adjustments I made to achieve the correctly formatted URL:

   "http://dummy-deploymenturl.com/xtream?url=http://dummy.url.com:PORT/player_api.php?password=pa55w0rd&username=dummyuser&action=get_vod_categories"

   The issue persists, and the feature remains non-functional.

3. It's worth noting that when accessing the URL directly in a browser, e.g., "http://dummy.url.com:PORT/player_api.php?password=pa55w0rd&username=dummyuser&action=get_vod_categories," the Xtream API responds as expected.

The issue may involve more than just URL formatting and could be related to the application's interaction with the Xtream API or the specific behavior of the Angular component.

[4gray]

Thanks for the detailed message! All arguments like username, password an server are passed in the request as query params separately to the backend and there the correct link is built with /player_api.php etc.