重定向后得到 URL

Question

I'm building a React App in which I send an API get via fetch. To get the right API response, I need to send a specific link, but users might be able to provide these links in another format that redirect to the correct format if opened in a browser.

Example:

This link https://soundcloud.app.goo.gl/u6XXuqp3Q7Q7WXgH8
redirects to: https://soundcloud.com/gary-j/ladies-on-mars-kiss-me-baby?p=i&c=0
if opened in a browser.

Is there a way in Javascript to get the second link form the first one?

Thanks!

//EDIT: Im both trying to use fetch and request. Using request the following way:

import React, {Component} from 'react';
const request = require('request');

class Getlink extends Component {
getRequest = () => {
    request('https://soundcloud.app.goo.gl/u6XXuqp3Q7Q7WXgH8', function (error, response, body) {
    console.error('error:', error); 
    console.log('statusCode:', response && response.statusCode); 
    console.log('body:', body);
});
}

render() {
return (
    {this.getRequest()}
)}
}

which gives the following error

Access to fetch at 'https://soundcloud.app.goo.gl/u6XXuqp3Q7Q7WXgH8' from 
origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-
Control-Allow-Origin' header is present on the requested resource. If an 
opaque response serves your needs, set the request's mode to 'no-cors' to 
fetch the resource with CORS disabled.

plus a GET Failed Error.

Is this a normal reaction as I'm doing this from local?

Answer 1

The redirect url is in response.headers.location . For any redirect response code you could recursively fetch the urls using headers.location .

For example, a response to curl shows response code is 302 ( Found ), and the redirect url is specified in the location headers.

curl -s -o /dev/null -D -  https://soundcloud.app.goo.gl/u6XXuqp3Q7Q7WXgH8 

HTTP/2 302 
content-type: application/binary
vary: Sec-Fetch-Dest, Sec-Fetch-Mode, Sec-Fetch-Site
cache-control: no-cache, no-store, max-age=0, must-revalidate
pragma: no-cache
expires: Mon, 01 Jan 1990 00:00:00 GMT
date: Thu, 08 Oct 2020 10:47:50 GMT
location: https://soundcloud.com/gary-j/ladies-on-mars-kiss-me-baby?ref=clipboard&p=i&c=0
content-security-policy: script-src 'nonce-pxqEOSDMS5AkBDmVHzvHUQ' 'unsafe-inline';object-src 'none';base-uri 'self';report-uri /_/DurableDeepLinkUi/cspreport;worker-src 'self'
server: ESF
content-length: 0
x-xss-protection: 0
x-frame-options: SAMEORIGIN
x-content-type-options: nosniff
alt-svc: h3-Q050=":443"; ma=2592000,h3-29=":443"; ma=2592000,h3-27=":443"; ma=2592000,h3-T051=":443"; ma=2592000,h3-T050=":443"; ma=2592000,h3-Q046=":443"; ma=2592000,h3-Q043=":443"; ma=2592000,quic=":443"; ma=2592000; v="46,43"

Answer 2

I figured out some stuff and i guess the problem is related to the website. I came across using cors-anywhere which does help to make the request but gives back a 403 Forbidden . You can try here: https://robwu.nl/cors-anywhere.html and entering the url i want to resolve.

fetch("https://cors-anywhere.herokuapp.com/https://soundcloud.app.goo.gl/u6XXuqp3Q7Q7WXgH8")
        .then((result) => {
        console.log(result)
    })