From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/zh-cn/web/api/response/url/index.html | 65 +++++++++++++++++++++++++++++ 1 file changed, 65 insertions(+) create mode 100644 files/zh-cn/web/api/response/url/index.html (limited to 'files/zh-cn/web/api/response/url/index.html') diff --git a/files/zh-cn/web/api/response/url/index.html b/files/zh-cn/web/api/response/url/index.html new file mode 100644 index 0000000000..89bcee01c6 --- /dev/null +++ b/files/zh-cn/web/api/response/url/index.html @@ -0,0 +1,65 @@ +--- +title: Response.url +slug: Web/API/Response/url +translation_of: Web/API/Response/url +--- +
{{APIRef("Fetch")}}
+ +

The url read-only property of the {{domxref("Response")}} interface contains the URL of the response. The value of the url property will be the final URL obtained after any redirects. 

+ +

Syntax

+ +
var myURL = response.url;
+ +

Value

+ +

A {{domxref("USVString")}}.

+ +

Example

+ +

In our Fetch Response example (see Fetch Response live) we create a new {{domxref("Request")}} object using the {{domxref("Request.Request","Request()")}} constructor, passing it a JPG path. We then fetch this request using {{domxref("GlobalFetch.fetch","fetch()")}}, extract a blob from the response using {{domxref("Body.blob")}}, create an object URL out of it using {{domxref("URL.createObjectURL")}}, and display this in an {{htmlelement("img")}}.

+ +

Note that at the top of the fetch() block we log the response URL to the console.

+ +
var myImage = document.querySelector('img');
+
+var myRequest = new Request('flowers.jpg');
+
+fetch(myRequest).then(function(response) {
+  console.log(response.url); // returns https://developer.mozilla.org/en-US/docs/Web/API/Response/flowers.jpg
+  response.blob().then(function(myBlob) {
+    var objectURL = URL.createObjectURL(myBlob);
+    myImage.src = objectURL;
+  });
+});
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Fetch','#dom-response-url','url')}}{{Spec2('Fetch')}}Initial definition
+ +

Browser compatibility

+ + + +

{{Compat("api.Response.url")}}

+ +

See also

+ + -- cgit v1.2.3-54-g00ecf