X Tutup
Skip to content

Commit 81abc39

Browse files
committed
feat(http): add support for JSONP requests
Closes #2905 Closes #2818
1 parent b4cde69 commit 81abc39

File tree

21 files changed

+566
-12
lines changed

21 files changed

+566
-12
lines changed

modules/angular2/http.ts

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,11 @@
55
* class.
66
*/
77
import {bind, Binding} from 'angular2/di';
8-
import {Http} from 'angular2/src/http/http';
8+
import {Http, Jsonp} from 'angular2/src/http/http';
99
import {XHRBackend, XHRConnection} from 'angular2/src/http/backends/xhr_backend';
10+
import {JSONPBackend, JSONPConnection} from 'angular2/src/http/backends/jsonp_backend';
1011
import {BrowserXhr} from 'angular2/src/http/backends/browser_xhr';
12+
import {BrowserJsonp} from 'angular2/src/http/backends/browser_jsonp';
1113
import {BaseRequestOptions, RequestOptions} from 'angular2/src/http/base_request_options';
1214
import {ConnectionBackend} from 'angular2/src/http/interfaces';
1315

@@ -26,7 +28,8 @@ export {
2628
export {BaseRequestOptions, RequestOptions} from 'angular2/src/http/base_request_options';
2729
export {BaseResponseOptions, ResponseOptions} from 'angular2/src/http/base_response_options';
2830
export {XHRBackend, XHRConnection} from 'angular2/src/http/backends/xhr_backend';
29-
export {Http} from 'angular2/src/http/http';
31+
export {JSONPBackend, JSONPConnection} from 'angular2/src/http/backends/jsonp_backend';
32+
export {Http, Jsonp} from 'angular2/src/http/http';
3033

3134
export {Headers} from 'angular2/src/http/headers';
3235

@@ -65,3 +68,12 @@ export var httpInjectables: List<any> = [
6568
bind(ResponseOptions).toClass(BaseResponseOptions),
6669
Http
6770
];
71+
72+
export var jsonpInjectables: List<any> = [
73+
bind(ConnectionBackend)
74+
.toClass(JSONPBackend),
75+
BrowserJsonp,
76+
bind(RequestOptions).toClass(BaseRequestOptions),
77+
bind(ResponseOptions).toClass(BaseResponseOptions),
78+
Jsonp
79+
];

modules/angular2/src/facade/lang.dart

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -190,6 +190,10 @@ class BaseException extends Error {
190190
}
191191
}
192192

193+
Error makeTypeError([String message = ""]) {
194+
return new BaseException(message);
195+
}
196+
193197
const _NAN_KEY = const Object();
194198

195199
// Dart can have identical(str1, str2) == false while str1 == str2

modules/angular2/src/facade/lang.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,10 @@ export class BaseException extends Error {
1515
toString(): string { return this.message; }
1616
}
1717

18+
export function makeTypeError(message?: string): Error {
19+
return new TypeError(message);
20+
}
21+
1822
export var Math = _global.Math;
1923
export var Date = _global.Date;
2024

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
library angular2.src.http.backends.browser_jsonp;
2+
import 'package:angular2/di.dart';
3+
import 'dart:html' show document;
4+
import 'dart:js' show context, JsObject, JsArray;
5+
6+
int _nextRequestId = 0;
7+
const JSONP_HOME = '__ng_jsonp__';
8+
9+
var _jsonpConnections = null;
10+
11+
JsObject _getJsonpConnections() {
12+
if (_jsonpConnections == null) {
13+
_jsonpConnections = context[JSONP_HOME] = new JsObject(context['Object']);
14+
}
15+
return _jsonpConnections;
16+
}
17+
18+
// Make sure not to evaluate this in a non-browser environment!
19+
@Injectable()
20+
class BrowserJsonp {
21+
// Construct a <script> element with the specified URL
22+
dynamic build(String url) {
23+
var node = document.createElement('script');
24+
node.src = url;
25+
return node;
26+
}
27+
28+
nextRequestID() {
29+
return "__req${_nextRequestId++}";
30+
}
31+
32+
requestCallback(String id) {
33+
return """${JSONP_HOME}.${id}.finished""";
34+
}
35+
36+
exposeConnection(String id, dynamic connection) {
37+
var connections = _getJsonpConnections();
38+
var wrapper = new JsObject(context['Object']);
39+
40+
wrapper['_id'] = id;
41+
wrapper['__dart__'] = connection;
42+
wrapper['finished'] = ([dynamic data]) => connection.finished(data);
43+
44+
connections[id] = wrapper;
45+
}
46+
47+
removeConnection(String id) {
48+
var connections = _getJsonpConnections();
49+
connections[id] = null;
50+
}
51+
52+
// Attach the <script> element to the DOM
53+
send(dynamic node) { document.body.append(node); }
54+
55+
// Remove <script> element from the DOM
56+
cleanup(dynamic node) {
57+
node.remove();
58+
}
59+
}
Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import {Injectable} from 'angular2/di';
2+
import {global} from 'angular2/src/facade/lang';
3+
4+
let _nextRequestId = 0;
5+
export const JSONP_HOME = '__ng_jsonp__';
6+
var _jsonpConnections = null;
7+
8+
function _getJsonpConnections(): {[key: string]: any} {
9+
if (_jsonpConnections === null) {
10+
_jsonpConnections = global[JSONP_HOME] = {};
11+
}
12+
return _jsonpConnections;
13+
}
14+
15+
// Make sure not to evaluate this in a non-browser environment!
16+
@Injectable()
17+
export class BrowserJsonp {
18+
// Construct a <script> element with the specified URL
19+
build(url: string): any {
20+
let node = document.createElement('script');
21+
node.src = url;
22+
return node;
23+
}
24+
25+
nextRequestID(): string { return `__req${_nextRequestId++}`; }
26+
27+
requestCallback(id: string): string { return `${JSONP_HOME}.${id}.finished`; }
28+
29+
exposeConnection(id: string, connection: any) {
30+
let connections = _getJsonpConnections();
31+
connections[id] = connection;
32+
}
33+
34+
removeConnection(id: string) {
35+
var connections = _getJsonpConnections();
36+
connections[id] = null;
37+
}
38+
39+
// Attach the <script> element to the DOM
40+
send(node: any) { document.body.appendChild(<Node>(node)); }
41+
42+
// Remove <script> element from the DOM
43+
cleanup(node: any) {
44+
if (node.parentNode) {
45+
node.parentNode.removeChild(<Node>(node));
46+
}
47+
}
48+
}
Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
import {ConnectionBackend, Connection} from '../interfaces';
2+
import {ReadyStates, RequestMethods, RequestMethodsMap} from '../enums';
3+
import {Request} from '../static_request';
4+
import {Response} from '../static_response';
5+
import {ResponseOptions, BaseResponseOptions} from '../base_response_options';
6+
import {Injectable} from 'angular2/di';
7+
import {BrowserJsonp} from './browser_jsonp';
8+
import {EventEmitter, ObservableWrapper} from 'angular2/src/facade/async';
9+
import {StringWrapper, isPresent, ENUM_INDEX, makeTypeError} from 'angular2/src/facade/lang';
10+
11+
export class JSONPConnection implements Connection {
12+
readyState: ReadyStates;
13+
request: Request;
14+
response: EventEmitter;
15+
private _id: string;
16+
private _script: Element;
17+
private _responseData: any;
18+
private _finished: boolean = false;
19+
20+
constructor(req: Request, private _dom: BrowserJsonp,
21+
private baseResponseOptions?: ResponseOptions) {
22+
if (req.method !== RequestMethods.GET) {
23+
throw makeTypeError("JSONP requests must use GET request method.");
24+
}
25+
this.request = req;
26+
this.response = new EventEmitter();
27+
this.readyState = ReadyStates.LOADING;
28+
this._id = _dom.nextRequestID();
29+
30+
_dom.exposeConnection(this._id, this);
31+
32+
// Workaround Dart
33+
// url = url.replace(/=JSONP_CALLBACK(&|$)/, `generated method`);
34+
let callback = _dom.requestCallback(this._id);
35+
let url: string = req.url;
36+
if (url.indexOf('=JSONP_CALLBACK&') > -1) {
37+
url = StringWrapper.replace(url, '=JSONP_CALLBACK&', `=${callback}&`);
38+
} else if (url.lastIndexOf('=JSONP_CALLBACK') === url.length - '=JSONP_CALLBACK'.length) {
39+
url = StringWrapper.substring(url, 0, url.length - '=JSONP_CALLBACK'.length) + `=${callback}`;
40+
}
41+
42+
let script = this._script = _dom.build(url);
43+
44+
script.addEventListener('load', (event) => {
45+
if (this.readyState === ReadyStates.CANCELLED) return;
46+
this.readyState = ReadyStates.DONE;
47+
_dom.cleanup(script);
48+
if (!this._finished) {
49+
ObservableWrapper.callThrow(
50+
this.response, makeTypeError('JSONP injected script did not invoke callback.'));
51+
return;
52+
}
53+
54+
let responseOptions = new ResponseOptions({body: this._responseData});
55+
if (isPresent(this.baseResponseOptions)) {
56+
responseOptions = this.baseResponseOptions.merge(responseOptions);
57+
}
58+
59+
ObservableWrapper.callNext(this.response, new Response(responseOptions));
60+
});
61+
62+
script.addEventListener('error', (error) => {
63+
if (this.readyState === ReadyStates.CANCELLED) return;
64+
this.readyState = ReadyStates.DONE;
65+
_dom.cleanup(script);
66+
ObservableWrapper.callThrow(this.response, error);
67+
});
68+
69+
_dom.send(script);
70+
}
71+
72+
finished(data?: any) {
73+
// Don't leak connections
74+
this._finished = true;
75+
this._dom.removeConnection(this._id);
76+
if (this.readyState === ReadyStates.CANCELLED) return;
77+
this._responseData = data;
78+
}
79+
80+
dispose(): void {
81+
this.readyState = ReadyStates.CANCELLED;
82+
let script = this._script;
83+
this._script = null;
84+
if (isPresent(script)) {
85+
this._dom.cleanup(script);
86+
}
87+
ObservableWrapper.callReturn(this.response);
88+
}
89+
}
90+
91+
@Injectable()
92+
export class JSONPBackend implements ConnectionBackend {
93+
constructor(private _browserJSONP: BrowserJsonp, private _baseResponseOptions: ResponseOptions) {}
94+
createConnection(request: Request): JSONPConnection {
95+
return new JSONPConnection(request, this._browserJSONP, this._baseResponseOptions);
96+
}
97+
}

modules/angular2/src/http/http.ts

Lines changed: 29 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {isString, isPresent, isBlank} from 'angular2/src/facade/lang';
1+
import {isString, isPresent, isBlank, makeTypeError} from 'angular2/src/facade/lang';
22
import {Injectable} from 'angular2/src/di/decorators';
33
import {IRequestOptions, Connection, ConnectionBackend} from './interfaces';
44
import {Request} from './static_request';
@@ -102,7 +102,7 @@ function mergeOptions(defaultOpts, providedOpts, method, url): RequestOptions {
102102
**/
103103
@Injectable()
104104
export class Http {
105-
constructor(private _backend: ConnectionBackend, private _defaultOptions: RequestOptions) {}
105+
constructor(protected _backend: ConnectionBackend, protected _defaultOptions: RequestOptions) {}
106106

107107
/**
108108
* Performs any type of http request. First argument is required, and can either be a url or
@@ -176,3 +176,30 @@ export class Http {
176176
RequestMethods.HEAD, url)));
177177
}
178178
}
179+
180+
@Injectable()
181+
export class Jsonp extends Http {
182+
constructor(backend: ConnectionBackend, defaultOptions: RequestOptions) {
183+
super(backend, defaultOptions);
184+
}
185+
186+
/**
187+
* Performs any type of http request. First argument is required, and can either be a url or
188+
* a {@link Request} instance. If the first argument is a url, an optional {@link RequestOptions}
189+
* object can be provided as the 2nd argument. The options object will be merged with the values
190+
* of {@link BaseRequestOptions} before performing the request.
191+
*/
192+
request(url: string | Request, options?: IRequestOptions): EventEmitter {
193+
var responseObservable: EventEmitter;
194+
if (isString(url)) {
195+
url = new Request(mergeOptions(this._defaultOptions, options, RequestMethods.GET, url));
196+
}
197+
if (url instanceof Request) {
198+
if (url.method !== RequestMethods.GET) {
199+
makeTypeError('JSONP requests must use GET request method.');
200+
}
201+
responseObservable = httpRequest(this._backend, url);
202+
}
203+
return responseObservable;
204+
}
205+
}
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
library angular2.src.http.http_utils;
2+
import 'dart:js' show JsObject;
3+
import 'dart:collection' show LinkedHashMap, LinkedHashSet;
4+
5+
bool isJsObject(o) {
6+
return o is JsObject || o is LinkedHashMap || o is LinkedHashSet;
7+
}
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export {isJsObject} from 'angular2/src/facade/lang';

modules/angular2/src/http/static_response.ts

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,8 @@
11
import {ResponseTypes} from './enums';
2-
import {
3-
BaseException,
4-
CONST_EXPR,
5-
isJsObject,
6-
isString,
7-
isPresent,
8-
Json
9-
} from 'angular2/src/facade/lang';
2+
import {BaseException, CONST_EXPR, isString, isPresent, Json} from 'angular2/src/facade/lang';
103
import {Headers} from './headers';
114
import {ResponseOptions} from './base_response_options';
5+
import {isJsObject} from './http_utils';
126

137
/**
148
* Creates `Response` instances from provided values.

0 commit comments

Comments
 (0)
X Tutup