8ef5cc680d
**Unit Testing Code Does Not Compile** The compilation error is: ``` The compilation error is ./src/testing/http-client.spec.ts - Error: Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js): Error: /home/projects/obk3vc--run/src/testing/http-client.spec.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property. ``` I’m not sure what to say about unit testing HTTP in a full Standalone app. Is it different? _This is the only known remaining defect in this conversion of HTTP to Standalone._ **Edited content of `http-request-data-from-server.md`** The current version of this page is confusing. In particular * It tells readers they **should always unsubscribe** from the HttpClient method calls. This is *not true* and this example doesn't even do it. I replaced this instruction with more nuanced advice and an explanation of why it is OK to not unsubscribe to HttpClient methods. * There is a "helpful" note about using the RxJS `map` operator to transform the response. This is *not "helpfulf"*. It is *confusing* because the sample doesn't use `map` anywhere. It was unnecessary here, even if it might be helpful elsewhere. I removed this note. * The "Requesting a typed response" section seemed unclear to me, particularly because the guide begins with a `get` request that already has the `Config` return type specification. My revision attempts to make this more clear. * The bold "callout" about the `observe` and `responseType` options appears out of nowhere after "Requesting a typed response". It's disconcerting at best. I moved it to the bottom of the page and linked to it from the `options` discussion at the top. I made a few other revisions that I hope improve the readability of this page. **Corrected `http-make-jsonp-request.md`** The JSONP example, handwritten in the guide page, would not have compiled. I added one that does to `heroes.service.ts` and displayed it on this page. **Corrected `http-handle-request-errors.md` This page ended with a section called "Sending data to a server" that introduces PUT, POST, and DELETE. These features have nothing to do with error handling and the verbiage here duplicates the opening paragraphs of the next topic which does: "Send data to a server". So I deleted this section from the error handling guide page. **Archived http-setup-server-communication.md** `http-setup-server-communication.md` appears to be the original long document that has since been divided over the other pages in this folder. It shouldn’t be in the reader’s flow. I did update it for Standalone. But I also removed it from left-nav and marked as archived. PR Close #51400
2.4 KiB
HTTP: Make a JSONP request
“JSON with Padding” (JSONP) is a method to deceive a web browser into carrying out requests with a <script> tag that uses the SRC attribute to make a special API request.
Apps can use the HttpClient to make JSONP requests across domains when a server doesn't support CORS protocol.
Angular JSONP requests return an Observable.
Follow the pattern for subscribing to observables and use the RxJS map operator to transform the response before using the async pipe to manage the results.
Enable JSONP by providing the HttpClientJsonpModule in the bootstrapApplication providers array in main.ts like this:
In the following example, the searchHeroesJsonp() method uses a JSONP request to query for heroes whose names contain the search term acquired from the user.
This request passes the heroesUrl with the search term as the first parameter and the standard callback function name, callback, as the second parameter.
You may have to map the Observable response from the http.jsonp method to the intended data type
as this example does with jsonpResultToHeroes.
Request non-JSON data
Not all APIs return JSON data.
In this next example, a DownloaderService method reads a text file from the server and logs the file contents, before returning those contents to the caller as an Observable<string>.
HttpClient.get() returns a string rather than the default JSON because of the responseType option.
The RxJS tap operator lets the code inspect both success and error values passing through the observable without disturbing them.
A download() method in the DownloaderComponent initiates the request by subscribing to the service method.
@reviewed 2023-08-17