What is the proper way to utilize a function in C# that integrates with a window form using TypeScript?

I am currently working on a code that is in c# and utilizes a web browser. My goal is to convert the existing JavaScript code to Angular 7 and Typescript.

Below is the c# code and the corresponding JavaScript code used to access the c# function from JavaScript:

In c#:

public int CheckLogin(object phone, object password)

In JavaScript:

window.external.CheckLogin(number,password)

Initially, it was simple to call the CheckLogin function from JavaScript using window.external.[method]. However, when trying to use window.external.CheckLogin in Typescript, I encountered the error message:

"Property 'CheckLogin' does not exist on type 'External'"

How can I access the c# function from a web browser using Angular 7 or Typescript?

c#angularwinformstypescript

Answer №1

To obtain the type information for this task, you have the option to expand the External interface utilized by window.external:

interface External {
    CheckLogin(num: number, pw: string);
}

window.external.CheckLogin(1, 'password');

If your intention is to execute server-side C# code from the client side, it is necessary to make a fetch request to an endpoint that will run the server-side code!

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Utilizing WebWorkers with @mediapipe/tasks-vision (Pose Landmarker): A Step-by-Step Guide

I've been experimenting with using a web worker to detect poses frame by frame, and then displaying the results on the main thread. However, I'm encountering some delays and synchronization issues. My setup involves Next.js 14.0.4 with @mediapip ...

typescriptnext.jsweb-workermediapipepose-detection

It appears that TypeScript is generating incorrect 'this' code without giving any warning

I seem to be facing some resistance filing a feature request related to this on GitHub issues, so I'll give it a shot here. Here is the code snippet that caused me trouble: export class Example { readonly myOtherElement: HTMLElement; public ...

typescript

Utilizing a Mocking/Spying Tool in Angular Unit Testing

I have a file named myHelpers.ts which contains multiple functions: myHelpers.ts export function multiply(a, b) { return a * b; } export function add(a, b) { return a + b; } export function subtract(a, b) { return a - b; } The above file al ...

javascriptangularjasminekarma-jasminespyon

Experiencing an issue with my Angular 6.1.0 setup, using angular-cli 7 and primeng 7 - specifically encountering the error message "Initializers are not allowed in ambient context."

Issue encountered in the primeng package: While examining node_modules/primeng/components/picklist/picklist.d.ts, errors were found at line numbers 65 and 66. I have investigated the primeng package further. primeng/components/picklist/picklist.d.ts l ...

angulartypescriptprimeng

Error message encountered in Nativescript app on Android only appears in Release build due to java.lang.Unsatisfied

I am encountering an issue with my NativeScript app where it runs smoothly in debug mode but crashes on startup in release mode. The logs reveal the following error message: 01-15 16:23:01.474 12229 12229 E script.demo: No implementation found for void co ...

androidangularnativescript

Inquiry about how TypeScript handles object property references when passed into functions

As a newcomer to TypeScript, I am exploring the creation of a range slider with dual handles using D3.js. I have developed a simple class for managing the slider objects: export class VerticalRangeSlider{ private sliderContainer: d3.Selection<SVGG ...

javascripttypescriptd3.js

Tips for adjusting the size of the selectBox options dropdown based on content in devExtreme Angular

Is there a way for a devExtreme selectBox dropdown window to dynamically adjust its size based on the length of the longest option text without specifying a static width in the dropDownOptions attribute? For example: https://i.sstatic.net/2xzX2.png I att ...

angulardevextreme-angular

How to Merge Items within an Array of Objects Using Typescript?

I'm currently facing a challenge in combining objects from an array of Objects in typescript. The structure of the array is as follows: 0: {type: 'FeatureCollection', features: Array(134)} 1: {type: 'FeatureCollection', features: ...

javascriptarraystypescriptjavascript-objects

The benefits of exporting a component from one module and using it in another module

After putting in long hours trying to figure this out on my own, I've finally decided to seek help from the community. Thank you in advance for any assistance! I have a Web Projects Module that utilizes a Webpage Component. Within the Webprojects Mod ...

angulartypescriptangular-directiveangular-componentsangular-module

Angular Service singleton constructor being invoked multiple times

I have been facing an issue with using an app-wide service called UserService to store authenticated user details. The problem is that UserService is being instantiated per route rather than shared across routes. To address this, I decided to create a Core ...

angulartypescriptangular-servicesangular-routerangular-module

TSLint now requires promises to be handled correctly using the `finally` clause

Encountering an error from TSLint, I am working to comprehend why it is raising concerns. In my code, there is a function that calls another method which returns a promise. However, the initial function does not return the promise; instead, it waits for c ...

typescriptqtslint

The test suite encountered an error: Invariant violation occurred because the statement "Buffer.from("") instanceof Uint8Array" was evaluated as false when it should have been

**Error: The condition "Buffer.from("") instanceof Uint8Array" is incorrectly evaluating to false This error indicates a problem with your JavaScript environment. eBuild relies on this specific condition which suggests that your JS environment is not funct ...

node.jsangulartypescriptjestjsts-jest

Troubleshooting: Bootstrap not functioning in Angular with Webpack due to vendor bundle issue

Bootstrap is included in my vendor.js bundle, as shown in the snapshot below, https://i.stack.imgur.com/q5k8c.png Upon inspecting the DOM, it's clear that bootstrap classes are being applied too, as seen in the snapshot below, https://i.stack.imgur. ...

angulartwitter-bootstrap-3webpack

Utilizing React Higher Order Components with TypeScript: can be initialized with a varied subtype of restriction

I am currently working on creating a Higher Order Component (HOC) that wraps a component with a required property called value, while excluding its own property called name. import React, { ComponentType } from 'react'; interface IPassThro ...

reactjstypescripttypescript-generics

Reading and processing JSON data in C#

My goal is to parse the JSON response I received from the Telegram Bot API using the getUpdate() method. The JSON data includes various updates: { "ok": true, "result": [ { "update_id": 920493886, "message": { "message_id": 12 ...

c#jsontelegram-bot

Tips on conditioning a query to reject fields that do not exist

My controller has a query that is working properly, but it also executes when receiving parameters that do not exist. I attempted to handle this by using HTTP status response codes, but the issue persists as it creates an empty array when a URL is manuall ...

mysqlsqlnode.jsangulartypescript

The sendKeys function in Selenium seems to be missing some characters when inputting text

Currently, I am working on test automation using Java, Selenium, and Chrome. Our developers recently made an upgrade from AngularJS to Angular2 for our UI. Ever since the upgrade, I've been facing an issue where sendKeys is inputting incomplete charac ...

javaseleniumangularsendkeys

Encountering a Problem with HTTP Requests in Angular 2

Seeking assistance with a technical issue. My objective: Make a REST API call to retrieve JSON data and resolve an Angular 2 promise. ServerAPI built with Node.js/ExpressJS/Lodash Sample of server.js file: var express = require('express'); va ...

expressangulartypescript

Unable to execute @angular/cli following installation

I recently set up the @angular/cli on my MacBook. The Node server version I am using is v6.9.5 and npm version 3.10.10. To install the @angular/cli, I executed the command below: sudo npm install -g @angular-cli However, whenever I try to run any ng co ...

node.jsangularnpmangular-cli

Encountering a CORS error in my Angular application while attempting to access a locally hosted Node Express API

I've been struggling with a CORS issue and can't seem to find a solution. My Node API application was built using Express, and the consumer is a simple Angular application. I've tried various solutions such as using CORS and including header ...

angularcors